将 JQuery 与 ASP.NET 结合使用进行幻灯片切换

发布于 2024-11-26 08:36:27 字数 721 浏览 8 评论 0原文

我想在单击按钮时使用 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 代码吗？

原文

I want to slideToggle a bulleted list in ASP.NET using jQuery when I click a button. The C# code behind will update the bulleted list by calling a web service and displaying the data.

Would I have to call the jQuery function from the C# code after the C# code has finished? Has anyone got an example to show?

Here is my code, which I will keep simple:

Page code:

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

C# code behind for button:

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

jQuery code on page:

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

Although it doesn't work. Is it because i'm not calling the jQuery code from the C# code behind?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

暖伴 2024-12-03 08:36:27

尝试这个解决方案

$("#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');
}
});

Try this solution

$("#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');
}
});

回复收藏 0 原文

你的心境我的脸 2024-12-03 08:36:27

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

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

Add code below as the very last string of the searchBtn_Click method:

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

回复收藏 0 原文

~没有更多了~