Jquery ajax的問題​​調用

Question

我正在使用jqueryui對話框向用戶顯示一些細節，並傳遞給usercontrol的代碼隱藏以便執行CRUD操作。但是，我沒有成功。任何人都可以幫我解決錯誤的地方嗎？下面是完整的代碼：

<script> 
    $(function() { 
    // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore! 
    $("#dialog:ui-dialog").dialog("destroy"); 

    var name = $("#name"), 
     email = $("#email"), 
     selectedVal= $('#DropDownList1').val(); 
     allFields = $([]).add(name).add(email).add(selectedVal), 
     tips = $(".validateTips"); 

    function updateTips(t) { 
     tips 
     .text(t) 
     .addClass("ui-state-highlight"); 
     setTimeout(function() { 
     tips.removeClass("ui-state-highlight", 1500); 
     }, 500); 
    } 

    function checkLength(o, n, min, max) { 
     if (o.val().length > max || o.val().length < min) { 
     o.addClass("ui-state-error"); 
     updateTips("Length of " + n + " must be between " + 
      min + " and " + max + "."); 
     return false; 
     } else { 
     return true; 
     } 
    } 

    function checkRegexp(o, regexp, n) { 
     if (!(regexp.test(o.val()))) { 
     o.addClass("ui-state-error"); 
     updateTips(n); 
     return false; 
     } else { 
     return true; 
     } 
    } 

    $("#dialog-form").dialog({ 
     autoOpen: false, 
     height: 310, 
     width: 310, 
     modal: true, 
     buttons: { 
     "Login": function() { 
      var bValid = true; 
      allFields.removeClass("ui-state-error"); 

      bValid = bValid && checkLength(name, "username", 1, 16); 
     bValid = bValid && checkLength(email, "email", 6, 80); 
      bValid = bValid && checkRegexp(email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ui@jquery.com"); 


      if (bValid) { 
      //do ajax post , pass the login details and display details.aspx page 

      $.ajax({ 
       url: '/GroupSchemeLogin.ascx/insertLoginDetails' 
       type: 'POST', 
       // serialize the full name , email , selected list 
       data: $('#dialog-form').serialize(), //"{no:" + selectedVal + "}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json",  
       success: function(response) { 
          if (response.d != "") { 
           alert(response.d); 

          } 
         } 


        }); 



      $(this).dialog("close"); 
      } 
     }, 
     Cancel: function() { 
      $(this).dialog("close"); 
     } 
     }, 
     close: function() { 
     allFields.val("").removeClass("ui-state-error"); 
     } 
    }); 

    $("#login") 
     .click(function(e) { 
     e.preventDefault(); 

     $("#dialog-form").dialog("open"); 
     }); 
    }); 
    </script> 




    <div id="dialog-form" title="Login to Portfolio" 
    <p class="validateTips">All fields are required.</p> 

    <form> 
    <fieldset> 
    <label for="name">Username</label> 
    <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" /> 
    <label for="email">Email</label> 
    <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" /> 
    <select id="DropDownList1"> 
    <option value="product1">Camera</option> 
    <option value="product2">DVD</option> 
    <option value="product3">LCD</option> 
</select> 
    </fieldset> 
    </form> 
</div> 


<a href="#" id="login"><img src="/images/login.jpg" alt="b2bLogin" /></a> 

代碼隱藏ASCX：

[WebMethod] 
    public static string insertLoginDetails(string name, string email , string selection) 
    { 
     //do Calculation 
     return result; 
    } 

Answer 1

你有一個未關閉div標籤：

<div id="dialog-form" title="Login to Portfolio" 

Answer 2

您發送Ajax請求的用戶控件（的.ascx）。通常在ASP.NET Web Form應用程序中，您不能向用戶控件發送Ajax請求，這會導致從服務器拋出Http異常（403 Forbidden）。

//..... 
$.ajax({ 
       url: '/GroupSchemeLogin.ascx/insertLoginDetails' 
       type: 'POST', 
       // serialize the full name , email , selected list 
//..... 

你就可以搬進在.aspx頁面中用戶contror（或insertLoginDetails的WebMethod）。您也可以使用通用處理程序來呈現用戶控件的內容。