[Answered ]-Handle dropdown box with Django pagination and jquery

2👍

✅

That is some pretty odd JavaScript you have there. For starters you should never be doing this.

{% for category in response_dict.category %}
  gp = '{{category.categorygroup.id}}' ;
  if(cgroup == gp)
  {
    html += '<option class="data" value="{{category.id}}">{{category.name}}</option>';  
  }
{% endfor %}

It means that you are dumping out the same JavaScript over and over again. You should instead build a JavaScript array and loop over it with pure JavaScript. Just look at the rendered page you get from that code, it will be huge.

// Build your array with Django templates or load it with ajax
var data = [...],
    i; // Also initialise the counter for the loop

for(i = 0; i < data.length; i += 1) {
    // Loop over your built array and construct your HTML
    // This line now only occurs once
    html += '<option foo=' + data[i].foo + '>' + data[i].bar + '</option>';
}

I would never actually dynamically build JavaScript either. My personal preference is to have plain JavaScript with no Django tags inside it, I make an ajax request to my server which renders some JSON containing the data I need. It is so much cleaner. I have to do this because I keep my JavaScript in a separate file I can minify.

So if you do not want to do this in what I feel is the “right” way I would use your same pagination loop to build your JavaScript. Call {% autopaginate %} twice or what ever it is you use to render the HTML.

Leave a comment