5

Tôi có một thiết lập khá đơn giản ở đây sử dụng ASP.Net 4.5 mới trong một giải pháp Biểu mẫu Web. Tôi đã sử dụng Twitter Bootstrap trong gần một năm và thực sự tận hưởng thời gian nó tiết kiệm cho tôi và sự nhất quán nó mang lại cho bảng. Một số phương thức javascript của chúng khá hữu ích. Tuy nhiên, tôi đang gặp vấn đề với việc kết hợp một số cách "mới" dường như cần được thực hiện trong 4.5. Dưới đây là Master Page của tôi:ASP.Net 4.5 Twitter Bootstrap và Xác thực Phía Máy khách

<body> 
    <form id="frmMain" runat="server"> 
     <asp:ScriptManager ID="smManager" runat="server"> 
      <Scripts> 
       <asp:ScriptReference Name="jquery" /> 
       <asp:ScriptReference Name="bootstrap" /> 
      </Scripts> 
     </asp:ScriptManager> 
... 

Và đây là nội dung của một trang thử nghiệm:

<asp:Content ID="Content2" ContentPlaceHolderID="cphMain" runat="server"> 
    <asp:TextBox ID="txtTest" runat="server"></asp:TextBox> 
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Problem" ControlToValidate="txtTest" CssClass="error" SetFocusOnError="True" ToolTip="Problem">*</asp:RequiredFieldValidator> 
    <asp:Button ID="btnTest" runat="server" Text="Check" CausesValidation="true" OnClick="btnTest_Click" /><br /> 
    <asp:TextBox ID="txtAnother" runat="server"></asp:TextBox> 
    <asp:Button ID="btnOk" runat="server" CausesValidation="false" Text="No Check" /> 
</asp:Content> 

đây là Global.asax.cs của tôi nộp để hiển thị các ScriptReferences đã nói ở trên:

protected void Application_Start(object sender, EventArgs e) { 
    GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore; 

    ScriptManager.ScriptResourceMapping.AddDefinition(
     "jquery", 
     new ScriptResourceDefinition { 
      Path = "~/Scripts/jquery-1.8.2.min.js", 
      DebugPath = "~/Scripts/jquery-1.8.2.js", 
      CdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js", 
      CdnDebugPath = "http://ajax.microsoft.com/ajax/jQuery/jquery-1.8.2.js", 
      LoadSuccessExpression = "window.jQuery" 
     } 
    ); // Load jQuery 

    ValidationSettings.UnobtrusiveValidationMode = UnobtrusiveValidationMode.WebForms; 

    ScriptManager.ScriptResourceMapping.AddDefinition(
     "bootstrap", 
     new ScriptResourceDefinition { 
      Path = "~/Scripts/bootstrap.min.js", 
      DebugPath = "~/Scripts/bootstrap.js" 
     } 
    ); // Load Bootstrap 

Kiểm tra phía khách hàng trên hộp văn bản đầu tiên không kích hoạt. Nếu tôi nhấp vào nút 'Kiểm tra', nó sẽ thực hiện một chuyến đi khứ hồi và Page.IsValid == false của mã phía sau. Điều đó là tốt, nhưng tôi không muốn đăng lại khi trang không hợp lệ.

Tôi tạo ra một trang thử nghiệm mà không sử dụng trang chủ của tôi, nhưng có cùng mã trong đó như sau:

<form id="form1" runat="server"> 
    <div> 
     <asp:TextBox ID="txtTest" runat="server"></asp:TextBox> 
     <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Problem" ControlToValidate="txtTest" CssClass="error" SetFocusOnError="True" ToolTip="Problem">*</asp:RequiredFieldValidator> 
     <asp:Button ID="btnTest" runat="server" Text="Check" OnClick="btnTest_Click" /><br /> 
     <asp:TextBox ID="txtAnother" runat="server"></asp:TextBox> 
     <asp:Button ID="btnOk" runat="server" CausesValidation="false" OnClick="btnOk_Click" Text="No Check" /> 
    </div> 
</form> 

Trang này ném phía khách hàng và do đó ngăn chặn các bài trở lại như tôi muốn nó .

Dường như với tôi rằng bootstrap.js có thể là lỗi hoặc làm gián đoạn quá trình xác thực js chuẩn. Bất kỳ đề nghị mà tôi vẫn có thể sử dụng bootstrap? Tôi cần tệp bootstrap.js vì nó xử lý các menu thả xuống. Tôi ít nhất có thể sử dụng giao diện người dùng của jQuery cho các phương thức nhưng điều đó không giúp ích cho trình đơn thả xuống.

Tôi muốn sử dụng công nghệ mới nhưng chúng tôi luôn có những đường cong học tập này.

Trả lời

1

Bạn có thể chọn các plugin mà bạn thực sự cần tại đây: http://twitter.github.com/bootstrap/customize.html#plugins Tôi nghĩ rằng bootstrap.js chứa tất cả-trong-một giải pháp kết hợp. Vì vậy, bạn có thể thử chỉ sử dụng những gì bạn cần và xem liệu nó có giúp