Using JQuery with ASP.NET for slideToggle
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开发者_如何学Python code from the C# code behind?
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');
}
});
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);
精彩评论