Reputation: 115
I tried to follow this tutorial but for some reason, the JS does nothing in my template.
I copied each step in it, added is an anchor div with an id of “newItems” and included the infinite scroll script as asked.
my template looks like this:
<body>
{% for i in "0123456789" %}
{% for j in "0123456789" %}
<li>{{i}} , {{j}}</li>
{% endfor %}
{% endfor %}
<a id="newItems">in here</a>
<script>
$(document).ready(function(){
$(window).bind('scroll', loadOnScroll);
});
// Scroll globals
...
SAME AS IN THE TUTORIAL
...
</script>
</body>
my view.py:
def debate_archive(request):
debates = range(1,1000)
paginator = Paginator(debates, 10)
if request.method == 'GET':
if request.is_ajax():
if request.GET.get('page_number'):
# Paginate based on the page number in the GET request
page_number = request.GET.get('page_number');
try:
page_objects = paginator.page(page_number).object_list
except InvalidPage:
return HttpResponseBadRequest(mimetype="json")
# Serialize the paginated objects
resp = serialize_debates(page_objects)
return HttpResponse(json.dumps(resp), mimetype='json')
debates = paginator.page(1).object_list
return render(request, 'polls/example.html', locals())
my urls.py:
url(r'^test/$', views.debate_archive, name='home'),
Any ideas?
Upvotes: 0
Views: 691
Reputation: 151
I have the same error. In console chrome said that: Uncaught TypeError: $ is not a function
Here is solution work with me:
you must use jQuery, and $ is not used (this is for compatibility with other libraries)
If you must use $(document).ready(function(){
, you can actually pass $ into the function call:
jQuery(function ($) { ...
Find more here
Upvotes: 0
Reputation:
The problem appears to be with templates within another template. I have had the same problem, but couldn't find the solution. Scrips from static are not loaded and inline scripts are not executed if they are positioned in a template of another template.
Upvotes: 1