javascript - Select2 "Infinite Scroll with Remote Data" - Callback not firing -


following example on select2 project page, attempting pull more records when user scrolls bottom of result set. 

<script>   $(document).ready(function() {     $('#style_full_name').select2({         placeholder: "please type in make , model",         minimuminputlength: 3,         ajax: {           url: "/list_styles",           datatype: 'json',           quietmillis: 100,           data: function (term, page) { // page one-based page number tracked select2             return {                 q: term, //search term                 page_limit: 10, // page size                 page: page, // page number             };           },           results: function (data, page) {             var more = (page * 10) < data.total; // whether or not there more results available              // notice return value of more select2 knows if more results can loaded             return {results: data.styles, more: more};           }         },         formatresult: styleformatresult, // omitted brevity, see source of page         dropdowncssclass: "bigdrop", // apply css makes dropdown taller         escapemarkup: function (m) { return m; } // not want escape markup since displaying html in results     });     function styleformatresult(style) {       var markup = "<table class='style-result'><tr>";       if (style.dimage_url !== undefined) {           markup += "<td class='style-image'><img src='" + style.dimage_url + "'/></td>";       }       markup += "<td class='style-info'><div class='style-title'>" + style.full_name + "</div>";       //if (movie.critics_consensus !== undefined) {       //   markup += "<div class='movie-synopsis'>" + movie.critics_consensus + "</div>";       //}       //else if (movie.synopsis !== undefined) {       //    markup += "<div class='movie-synopsis'>" + movie.synopsis + "</div>";       //}       markup += "</td></tr></table>"       return markup;     }   }); </script>

while testing rotten tomatoes api example on select2's page , tracking network panel in chrome console can see callback fired when reaching bottom of scroll list. not happening when scroll bottom of scroll list in own use case above.

after digging around bit realized problem "total" not part of json response var more = (page * 10) < data.total evaluating false. here code styles controller (ror) required make infinite scroll work: 

  def list_styles      #sunspot solr query     @styles = style.search { fulltext params[:q]; paginate :page => params[:page], :per_page => params[:page_limit] }      #build json string     @styles = "{\"total\":#{@styles.total}, \"styles\":#{@styles.results.to_json(:only=>[:id, :full_name], :methods => [:dimage_url, :dimage_url_medium])}}"      #render json response     respond_to |format|       format.json {render :json => @styles }     end   end

Comments

Post a Comment

Popular posts from this blog

Change php variable from jquery value using ajax (same page) -

what i'm trying this: i've php global variable $currentid , simple jquery script check if there "id" (page) in hash of url , if yes wanted give value $currentid . i've been reading lot , notice shall use ajax i'm not managing it. my code is: <script type="text/javascript"> $(document).ready(function(){ if (parent.location.hash != '' ) { var thecurrentid = parent.location.hash.split('#')[1]; $.ajax({ url: 'my.php', //current page type: 'post', data: {theid: thecurrentid }, datatype: 'json', success: function () { } }); } // code here }); </script> could me please? thank in advance. php server side language, meaning once has sent data browser, php variables , data cannot changed... however, using ajax, can send request php page , change data in dom based on result. consider th...
Read more

Pull out data related to my apps from Android Play Store and iOS App Store -

i want pull out data related apps (ratings, reviews, etc) google play store , apple app store ? how can accomplish ? i have found open source apis google mentioned not reliable. also there paid apis (e.g. appfigures) available. has idea how able pull data these play stores ?? i looking direction on how can accomplish this. can suggest ? we (appfigures) have been working on developing infrastructure give ability reviews , bunch of other data points major app stores several years :] we make available via our api though may want check out.
Read more

How can I fetch data from a web server in an android application? -

i want retrieve data web server in android application, , don't know begin. should use web services? i recommend these tutorials: connect android php , mysql , json in android , php , mysqli i used these tutorials , managed trying working without difficulty. between them describe each step in how attempting @ each stage, android application, database , web server side , has information included can process , use received information the thing add connect android php , mysql tutorial makes use of mysql_ in php deprecated. better use mysqli why included third link. the basic outline of want this: 1) in android app make request server php script using class this: import java.io.bufferedreader; import java.io.ioexception; import java.io.inputstream; import java.io.inputstreamreader; import java.io.unsupportedencodingexception; import java.util.list; import org.apache.http.httpentity; import org.apache.http.httpresponse; import org.apache.http.namevaluepair...
Read more