Databases
StackOverflow2013
Postsdbo
POProblem displaying dynamically generated records with client-side paging using jQuery Templates plugin & Pagination plugin
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POProblem displaying dynamically generated records with client-side paging using jQuery Templates plugin & Pagination plugin
    primarykey
    data
    text
    <p>For a custom requirement to display dynamically generated records with client-side paging, I'm using <a href="http://stephenwalther.com/blog/archive/2010/10/05/jquery-templates-on-microsoft-ajax-cdn.aspx" rel="nofollow noreferrer">Microsoft's jQuery Templates plugin</a> alongwith <a href="https://github.com/gbirke/jquery_pagination" rel="nofollow noreferrer">G Birke's jQuery Pagination plugin</a>. I could have managed with just the Pagination plugin but now definitely need the Template plugin to conserve on server side processing involved in generating records with formatting.</p> <p>I've shared <a href="http://jsbin.com/ebepa3/2" rel="nofollow noreferrer">my code sample on JSBin</a> (<a href="http://jsbin.com/ebepa3/2/edit" rel="nofollow noreferrer">see source</a>). This sample is an adaption of <a href="http://stephenwalther.com/blog/archive/2010/10/05/jquery-templates-on-microsoft-ajax-cdn.aspx" rel="nofollow noreferrer">Stephen Walther's Templates plugin example</a> &amp; a <a href="http://jsbin.com/upuwe" rel="nofollow noreferrer">Pagination plugin example</a> by <a href="https://stackoverflow.com/questions/1523163/jquery-pagination-plugin/1523265#1523265">StackOverflow member brianpeiris</a> </p> <pre><code>$("#flickr").live("click", function() { var url = "http://api.flickr.com/services/feeds/groups_pool.gne?id=44124373027@N01&amp;lang=en-us&amp;format=json&amp;jsoncallback=?"; // Grab some flickr images of cats $.getJSON(url, function (data) { // Format the data using the catTemplate template $("#catTemplate").tmpl(data.items).appendTo("#hiddenresult"); }); alert("Total flickr records fetched =" + $('#hiddenresult div.result').length); initPagination(); }); </code></pre> <p>The problems are:</p> <ol> <li>The records show up with paging in Firefox &amp; IE8 only if the alert in the code above is present. The alert probably introduces a delay. How to fix the code so that it works without that alert?</li> <li>Even if the alert is present, the sample doesn't work in Chrome, Safari &amp; Opera. How to make the solution cross-browser?</li> </ol> <p>I'll appreciate if anyone can help me fix these issues</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USmvark
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload