Question

例如，我有2个块，一个是可见的，一个是折叠的（标签控件）。 countriesList使用codebehind（OnPageLoad）填充数据：

for (int i = 0; i < 50;i++ )
    countriesList.Controls.Add(new LiteralControl(string.Format("<div class=\"list\"><div class=\"list-item\"><div class=\"list-item-content-wrapper\"><span class=\"list-item-content\">{0}</span></div></div></div>", i)));

<div class="frame" id="frame_1">
    <div class="listview">
        <asp:Panel runat="server" ID="countriesList">
        </asp:Panel>
    </div>
</div>
<div class="frame" id="frame_2">
    <div class="listview">
        <asp:Panel runat="server" ID="citiesList">
        </asp:Panel>
    </div>
</div>

当用户选择某个国家/地区时，我必须从服务器获取数据，然后在一秒钟内显示它（当前是隐藏的）。

有没有办法填充

<asp:Panel runat="server" ID="citiesList">
</asp:Panel>

无需再次从服务器请求整个页面？

我需要在服务器端执行请求，而不是在客户端。

Answer 1

您可以为您的国家/地区下拉菜单创建onchange事件处理程序。在事件处理程序内部，向服务器发出AJAX请求（将国家/地区值作为参数传递）。然后用响应数据填充城市DIV的内部HTML。

示例（使用jquery）：

$('#Country').change(function () {
        $.ajax({
            url: '<your url here>'
            , type: 'POST'
            , data: {
                country: $(this).val()
            }
        })
        .done(function (data) {
            $('#citiesList').html(data);
        });
});

Answer 2

在您的客户端：

$.ajax({
        type: "POST",
        data:
        {
            '__EVENTTARGET': '$GetSomeData',
            'param1': 'param1_value',
            'param2': 'param2_value'
        }
    })
    .done(function (data) {
        alert("have html data:\n" + data);
        $('#YourControlId').html(data);
    }).fail(function (p1, p2, p3) {
        alert("error");
    });

然后在服务器端的某个地方使用control_load方法：

if (IsPostBack)
{
    var et = Request.Params["__EVENTTARGET"];

    switch (et)
    {
        case "$GetSomeData":
            var param1 = Request.Params["param1"];
            var param2 = Request.Params["param2"];
            var html_data = GetSomeData(param1, param2);

            response.ClearContent();
            response.ContentType = "text/html";
            response.ContentEncoding = System.Text.Encoding.UTF8;

            using (var outStream = response.OutputStream)
            using (var writer = new System.IO.StreamWriter(outStream))
            {
                writer.Write(html_data);
            }

            response.Flush();
            response.SuppressContent = true;
            HttpContext.Current.ApplicationInstance.CompleteRequest();

            break;
        default:
            return;
    }

    return;
}

使用ASP.NET上的数据更新DIV内容

2 个答案: