Question

我想在单击按钮时使用jQuery在ASP.NET中切换项目符号列表。后面的C＃代码将通过调用Web服务并显示数据来更新项目符号列表。

在C＃代码完成后，我是否必须从C＃代码调用jQuery函数？有没有人有一个展示的例子？

这是我的代码，我将保持简单：

网页代码：

<asp:BulletedList runat="server" id="resultsList">
</asp:BulletedList>
<asp:Button runat="server" Text="Search" id="searchBtn" 
onclick="searchBtn_Click" />

按钮的C＃代码：

resultsList.Item.Add( "New Item");
//do other stuff to list

页面上的jQuery代码：

$("#searchBtn").click(function () {
        $("#resultsList").slideToggle('slow', function () {
            //do something
        });
});

虽然不起作用。是因为我没有从后面的C＃代码中调用jQuery代码吗？

Answer 1

将以下代码添加为searchBtn_Click方法的最后一个字符串：

ClientScript.RegisterStartupScript(this.GetType(), "ToogleResultsList", string.Format("$('#{0}').slideToggle('slow', function () { alert('Foo!'); });", resultsList.ClientID), true);

Answer 2

试试这个解决方案

$("#searchBtn").click(function () {

  if(!$("#resultsList").data("listBound")){

  $.ajax({
    url: "urlWhichWillReturnListMarkUpOrJsonResult",
    succcess: function(response){
       //If the response is just the requried markup
       $("#resultsList").html(response).slideToggle('slow');
       //If the response is a json result then you have to write a logic to read the response and create the required markup for the list and append that markup to resultList container and then call slideToggle method.

       //Once the list is populated set at flag using data attributes so that next time when u click u dont have to make ajax call but just slideToggle it
      $("#resultsList").data("listBound", true);
    }
  });
}
else
{
    $("#resultsList").slideToggle('slow');
}
});

使用JQuery和ASP.NET进行slideToggle

2 个答案: