پرکردن DropDown توسط jquery

در این مقاله میخواهیم DropDown را توسط jquery بایند کنیم

ابتدا به صفحه خود jquery را رفرنس بدید:

<script src="jquery-1.6.4.js" type="text/javascript"></script>

سپس یک DropDown اضافه کنید و تابع زیر را بنویسید:

<script >  
      $(document).ready(function () {                 
          $.ajax({  
              type: "POST",  
              contentType: "application/json; charset=utf-8",  
              url: "test.aspx/LoadCountry",  
              data: "{}",  
              dataType: "json",  
              success: function (Result) {  
                  $.each(Result.d, function (key, value) {  
                      $("#ddlcountry").append($("<option></option>").val(value.CountryId).html(value.CountryName));  
                  });  
              },  
              error: function (Result) {  
                  alert("Error");  
              }  
          });  
      });

صفحه text.aspx به شکل زیر میشود:

<%@ 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="jquery-1.6.4.js" type="text/javascript"></script>

</head>
<body>
    <form id="form1" runat="server">
    <div>   
        
         <script >
             $(document).ready(function () {
                 debugger
                 $.ajax({
                     type: "POST",
                     contentType: "application/json; charset=utf-8",
                     url: "test.aspx/LoadCountry",
                     data: "{}",
                     dataType: "json",
                     success: function (Result) {
                         $.each(Result.d, function (key, value) {
                             $("#ddlcountry").append($("<option></option>").val(value.CountryId).html(value.CountryName));
                         });
                     },
                     error: function (Result) {
                         alert("Error");
                     }
                 });
             });

    </script>
        select your City
           <asp:DropDownList ID="ddlcountry" runat="server">
        </asp:DropDownList>
     </div>
    </form>
</body>
</html>

یک کلاس به نام property بسازید و کد زیر را وارد کنید:

public class property
{
	public property()
	{
		
	}
    public int CountryId { get; set; }
    public string CountryName { get; set; }
    public List<property> CountryInformation { get; set; }
}

صفحه test.aspx.cs را به شکل زیر ویرایش کنید:

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;

public partial class test : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    [System.Web.Services.WebMethod]
    public static List<property> LoadCountry()
    {
       return LoadCountry1();
    }
    

    public static List<property> LoadCountry1()
    {
       
        List<property> CountryInformation = new List<property>();
        DataSet ds;
        using (SqlConnection con = new SqlConnection(@"Data Source=JSB-PC\JOGI;Initial Catalog=jogi;Integrated Security=True"))
        {
            using (SqlCommand cmd = new SqlCommand("GetaCountryRecords", con))
            {
                con.Open();
                cmd.Connection = con;
                cmd.CommandType = CommandType.StoredProcedure;
                SqlParameter parameter = cmd.Parameters.Add(
     "@count", SqlDbType.Int);

                parameter.Direction = ParameterDirection.Output;
               
                using (SqlDataAdapter da = new SqlDataAdapter(cmd))
                {

                    ds = new DataSet();
                    da.Fill(ds);
                }
            }
        }
        try
        {
            if (ds != null)
            {
                if (ds.Tables.Count > 0)
                {
                    if (ds.Tables[0].Rows.Count > 0)
                    {
                        foreach (DataRow dr in ds.Tables[0].Rows)
                        {
                            CountryInformation.Add(new property()
                            {
                                CountryId = Convert.ToInt32(dr["CountryId"]),
                                CountryName = dr["CountryName"].ToString()
                            });
                        }
                    }
                }
            }
        }
        catch (Exception ex)
        {
            throw ex;
        }
        return CountryInformation;
    }
}

حالا میتونید برنامه رو اجرا کنید:

فایل های ضمیمه

WebSite1.zip

مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

دوره های در حال ثبت نام آکادمی برنامه نویسان

پرکردن DropDown توسط jquery

فایل های ضمیمه

برنامه نویسان

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید