綁定下拉使用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

回答

相關問題