绑定下拉使用JQuery

这是我的aspx编码绑定下拉使用JQuery

[WebMethod] 
    public static CountryDetails[] BindDatatoDropdown() 
    { 
     DataTable dt = new DataTable(); 
     List<CountryDetails> details = new List<CountryDetails>(); 

     using (SqlConnection con = new SqlConnection(@"Data Source=DEVSYS;Initial Catalog=Items;Persist Security Info=True;User ID=sa;Password=*****")) 
     { 
      using (SqlCommand cmd = new SqlCommand("SELECT ItemTypeID,ItemType FROM ItemTypeTable", con)) 
      { 
       con.Open(); 
       SqlDataAdapter da = new SqlDataAdapter(cmd); 
       da.Fill(dt); 
       foreach (DataRow dtrow in dt.Rows) 
       { 
        CountryDetails country = new CountryDetails(); 
        country.CountryId = Convert.ToInt32(dtrow["ItemTypeID"].ToString()); 
        country.CountryName = dtrow["ItemType"].ToString(); 
        details.Add(country); 
       } 
      } 
     } 
     return details.ToArray(); 
    } 
    public class CountryDetails 
    { 
     public int CountryId { get; set; } 
     public string CountryName { get; set; } 
    }

我想下拉使用jQuery绑定。但我它只显示错误警报这是我设计的编码

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="jquery.selectboxes.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $.ajax({ 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      url: "WebForm1.aspx/BindDatatoDropdown", 
      data: "{}", 
      dataType: "json", 
      success: function (data) { 
       alert("hi"); 
       $.each(data.d, function (key, value) { 
        $("#ddlCountry").append($("<option></option>").val(value.CountryId).html(value.CountryName)); 
       }); 
      }, 
      error: function ajaxError(response) { 
      alert(response.status + ' ' + response.statusText); 
      } 
     }); 
    }); 
</script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
    <asp:DropDownList ID="ddlCountry" runat="server" /> 
    </div> 
    </form>

正是我要牛逼绑定在下拉，而页面加载项的详细信息。它总是显示错误的警报。它说500内部服务器错误

来源

2013-07-16 Golda

我已经找到了问题。 Jquery脚本只绑定有限的数据。它只绑定近1000个数据。我想绑定2000，以便它显示错误 – Golda

如果仍然需要帮助，请

ASPX CODE：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %> 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 

     <title></title> 
     <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 
     <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
     <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script> 
     <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script> 

     <script type="text/javascript" language="javascript"> 
      $(document).ready(function() { 
       $.ajax 
        ({ 
         type: "POST", 
         url: "test.aspx/options", 
         data: '', 
         contentType: "application/json;charset=utf-8", 
         dataType: "json", 
         success: function (data) { 

          var lankanListArray = JSON.parse(data.d); 



          // running a loop 
          $.each(lankanListArray, function (index, value) { 
           $("#ddlCountry").append($("<option></option>").val(this.name).html(this.price)); 
          }); 




         }, 
         error: function (err) { 

         } 
        }); 

      }); 
     </script> 
    </head> 
    <body> 
     <form id="form1" runat="server"> 
     <div> 
     <asp:DropDownList ID="ddlCountry" runat="server" /> 
     </div> 
     </form> 
    </body> 
    </html> 



    C# CODE 


    using System; 
    using System.Collections.Generic; 
    using System.Linq; 
    using System.Web; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
    using MailDLL; 
    using System.Web.Services; 
    using System.Web.Script.Serialization; 
    public partial class test : System.Web.UI.Page 
    { 
     protected void Page_Load(object sender, EventArgs e) 
     { 
     } 


     [WebMethod] 
     public static string options() 
     { 
      JavaScriptSerializer serializer = new JavaScriptSerializer(); 
      landmarkEntities A = new landmarkEntities(); 
      var b = A.sp_test().ToList(); 


      List<Test1> c=new List<Test1>(); 
      foreach (var s in b) 
      { 
       Test1 testobj = new Test1(); 
       testobj.name = s.Name; 
       testobj.price = s.price; 
       c.Add(testobj); 

      } 

      string jsonString = serializer.Serialize(c); 
      return jsonString; 

     } 

     public class Test1 
     { 
      public Test1(string _name, string _price) 
      { 
       name = _name; 
       price = _price; 


      } 
      public Test1() 
      { } 
      public string name { get; set; } 
      public string price { get; set; } 

     } 


    } 


first add refrence to these js files in your application. 

<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script> 



then create class that will hold the data 

public class Test1 
    { 
     public Test1(string _name, string _price) 
     { 
      name = _name; 
      price = _price; 


     } 
     public Test1() 
     { } 
     public string name { get; set; } 
     public string price { get; set; } 

    } 




add using System.Web.Script.Serialization; in your cs page so that you can use JavaScriptSerializer. 
the create a list of type class. 
Loop through the data. 

inside loop create object of a class. 
assign the data that you had fetched to the class, 
add the object to the list of type class. 

then Serialize the list using serializer.Serialize() function.And return as string. 

string jsonString = serializer.Serialize(c); 
     return jsonString;

来源

2013-09-22 07:20:41

绑定下拉使用JQuery

回答

相关问题