Question

当用户第一次点击DropDownList时，是否可以在asp.NET中加载下拉列表？

我会尽力解释一下。我有一个带有DropDownList和一个项目的aspx页面。

ListItem listlt = new ListItem("UNDEFINED", "-1");
ddl.Items.Insert(0, listlt);

当用户点击DropDownList时，我想加载DropDownList中的所有数据。这是因为下拉列表包含大量数据，并且页面负载非常慢。

任何想法？ thx提前

Answer 1

您可以改用PageMethods。

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


    }

    [WebMethod]
    public static Dictionary<string, string> getItems()
    {
        return new Dictionary<string, string>(){
            {"1","Item1"} ,{"2","Item2"}};
    }
}

ASPX

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <title>jQuery to call page methods in ASP.NET</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
</head>
<body>
    <form id="Form1" runat="server">
    <asp:ScriptManager EnablePageMethods="true" ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

    <script type="text/javascript">
        $(document).ready(function() {
            $('select#<%= DropDownList1.ClientID %>').click(function() {

                if (this.options.length <= 0) {
                    PageMethods.getItems(function(res) {
                        //alert('e');
                        for (r in res) {
                            //$(this).append($('<option value="'+ r+'">' + res[r] + '</option>'));
                            //$(this).append($('<option></option>'));
                            $('select#<%= DropDownList1.ClientID %>').append( $('<option></option>').val(r).html(res[r]) );
                        }
                    });
                }
            });
        });
    </script>
    <asp:DropDownList ID="DropDownList1" runat="server" />
    </form>
</body>
</html>

Answer 2

使用jquery load

$("select#theDropdownID").click(function(){
    $(this).load("thedropdownItems.html");
});

并在thedropdownItems.html

<option value='foo'>foo</option>
<option value='bar'>bar</option>
....

使用jQuery加载下拉列表

2 个答案: