Question

The title sort of explains what I’m trying to do.
The reason for this is that I am trying to implement infinite scrolling on my ASP.NET C# Website. I’ve previous accomplished the “effect” of lazy scrolling with the ListView Control but that was a dirty and ‘slow’ trick that used a DataPager and a couple of HiddenFields.

I would like to send a completely pre-formatted HTML element from a WebMethod to jQuery so that I can append it on the container <div>.

Actually what I need rendered in the WebMethod is a bunch of objects inside a container <div> that are similiar to the Facebook Wall. What I previous had was a ListView (B) nested in another ListView (A). A Single Each <ItemTemplate> from a single ListView had multiple ListViewItems of the other ListView. (A) Representing a wall post and (B) Comments bound to the Primary Key of (A).

Anyway, am I looking at this issue from the right corner or should I figure out some other way of doing this? Please share you thoughts.

Thank you.

Answer 1

You can just return a string from your webmethod with the html in it – and then pump it directly into an html element on your page on the ‘success’ function. NB I think this is the ‘html()’ element – or you can use .append(text);

Using JQuery

$(document).ready(function() {
  // Add the page method call as an onclick handler for the div.
  $("#Result").click(function() {
    $.ajax({
      type: "POST",
      url: "Default.aspx/GetHTMLFormatted",
      data: "{}",
      success: function(msg) {
        // Replace the div's content with the page method's return.
        $("#Result").html(msg.d); // or .append(msg.d);
      }
    });
  });
});

A better way to do it though is to return a JSON structure and use a template library to emit your html structure. See http://stephenwalther.com/blog/archive/2010/11/30/an-introduction-to-jquery-templates.aspx