logo
down
shadow

AJAX call in Django project: Loading next 3 items from list


AJAX call in Django project: Loading next 3 items from list

By : sGray
Date : November 17 2020, 11:52 AM
I hope this helps . I'm stuck on this ajax call. What I was trying to do was pull data from the data that is returned from the ajax call (return_data, also known as item_list) from the django views file in my project. The items are being pulled via alphabetical order, due to code in the django models module that I inputed. As I am new to Django, my problem is getting the ajax call to give the next 3 items in the return_data/item_list lists, via the click of the "show more button", and loading those on to the page. Can someone break down how I can go about doing this? Thank you in advance! , perhaps something like this:
code :
var indexLast = 0;
$("#showmore").click(function() {
    $.ajax({
        type: 'GET',
        url: SUBMIT_URL,
        data: {
            indexStart: indexLast  //you'll need you backend to take this index and get the next 3 items from the list starting at this index count, so first time, get first 3, second call you would need to get 3-5, 6-9, etc
        },
        dataType: 'html',
        success: function (return_data, textStatus_ignored, jqXHR_ignored)  {
            indexLast += 3;  //add 3 to the index
            // Now Use the Data here, or save to a variable and use elsewhere.
            // if your sever simply returns the table formated data already you can just call your jQuery.append(return_data) and your done.
        }
    });

});


Share : facebook icon twitter icon
Passing list of values to django view via jQuery ajax call

Passing list of values to django view via jQuery ajax call


By : Imnewb
Date : March 29 2020, 07:55 AM
This might help you I found a solution to my original problem. Posting it here as an answer, hopefully it helps somebody.
jQuery:
code :
var postUrl = "http://localhost:8000/ingredients/";
$('li').click(function(){
    values = [1, 2];
    var jsonText = JSON.stringify(values);
    $.ajax({
        url: postUrl,
        type: 'POST',
        data: jsonText,
        traditional: true,
        dataType: 'html',
        success: function(result){
            $('#ingredients').append(result);
            }
    });       
});
def ingredients(request):
    if request.is_ajax():
        ourid = json.loads(request.raw_post_data)
        ingredients = Ingredience.objects.filter(food__id__in=ourid)
        t = get_template('ingredients.html')
        html = t.render(Context({'ingredients': ingredients,}))
        return HttpResponse(html)
    else:
        html = '<p>This is not ajax</p>'      
        return HttpResponse(html)
JSON not loading into dropdown list from ajax call using jQuery loadJSON plugin

JSON not loading into dropdown list from ajax call using jQuery loadJSON plugin


By : Carla Deplano
Date : March 29 2020, 07:55 AM
Hope this helps I'm a noob using Ajax and I could really use some help. I've been going through the tutorial for the loadJSON plugin here. Has anyone used this plugin with ajax? , According to the documentation:
code :
<select name="Region" >
<select name="Region" id="Region" >
jQuery Ajax loading image not loading on ajax call

jQuery Ajax loading image not loading on ajax call


By : red
Date : March 29 2020, 07:55 AM
this will help I'm using the below jQuery snippet for an ajax loading image which I use on numerous sites, for some reason it wont disply the loading image when an ajax request is fired. , you can make it with beforeSend and complete methods:
code :
     $.ajax({
        url: "ajax.php",
        type: "POST",
        data: vData,
        beforeSend: function () {
            $(".loading").show();  // <----show before sending
        },
        success: function (data, textStatus, jqXHR) {
            $('#itemList').html(data);
        },
        complete: function () {
            $(".loading").hide(); // on complete of ajax hide it.
        }
    });
Appending data fetched by an AJAX call to an already existing list for lazy-loading

Appending data fetched by an AJAX call to an already existing list for lazy-loading


By : Julien
Date : March 29 2020, 07:55 AM
like below fixes the issue I am pretty new to UI development, so please, bear with me. I am trying to implement lazy-loading on a webpage. That is, when the user scrolls to the bottom of the page, a page is fetched from the server using an AJAX call. What is wish to do is to append the new data to the already existing one. Currently, the new data occupies the entire list-view and the scroll bar moves to the top. Here is my code: , Because you erase your existing array.
So replace
code :
if($scope.providersList == null) {
  $scope.providersList = []; /* init if null */
}
/* Update the existing array */
Array.prototype.push.apply($scope.providersList, JSON.parse(data.serviceproviderlist));
Return updated session variables (while page is loading) through Ajax call using Django

Return updated session variables (while page is loading) through Ajax call using Django


By : OnlyTwentyCharacters
Date : March 29 2020, 07:55 AM
Hope this helps My engine problem: I was using the wrong SESSION_ENGINE for what I was trying to accomplish.
code :
SESSION_ENGINE = "django.contrib.sessions.backends.signed_cookies"
SESSION_ENGINE = "django.contrib.sessions.backends.db"
request.session.save()
SESSION_SAVE_EVERY_REQUEST = True
def callback_progress(request):

    request.session["data"]['numgames'] = request.session["numgames"]
    request.session["data"]['progress'] = request.session["progress"]
    request.session["data"]['win_ratio'] = round(request.session["win_ratio"],2)

    request.session.save()

    response = JsonResponse(request.session["data"])

    return response
Related Posts Related Posts :
  • TableTools plugin export buttons are not working
  • Prepopulate jquery token input textbox
  • Open a fancybox link with ajax
  • Getting jQuery and AngularJS content assist / auto-complete in eclipse for standalone HTML "file"
  • TR alternate background colour with unequal number of TD
  • DATATABLE jQuery TH and TD alignment
  • Jquery UI Convert Select's to Range Slider
  • Change text in text field according to link that has been clicked
  • Animate addClass + removeClass transitions?
  • knockout ajax call data-BIND
  • How do I create a variable with a number based on an element's number position using jquery?
  • Prevent fixed position element from flickering during jQuery animation
  • points are not visible clearly in nvd3 ghaph
  • How to write a regular expression for IP address format
  • Animate 3 DIVs from right to left when page is loading.
  • How to pivot columns in free jqgrid 4.15.4
  • the jquery method works fine but when made as a function not working
  • Show/hide text doesn't work when targeting link within div
  • multiple autocomplete search input fields
  • Display image in cell using Jquery jTable
  • jQuery and Wordpress - Scripts not working
  • flickering when mouse over, .hover() show/hide div(s)
  • Using Django's JSONResponseMixin to respond to AJAX requests
  • Unable to render charts using Wicked PDF
  • Style to dynamically created elements
  • hover not working for items in list
  • Keep server session alive automatically based on activity / input, using JQuery
  • jQuery load() taking a long time
  • Change / Exchange values in textboxes on text change in jquery
  • Unslider arrow code overriding slider options
  • what is the traditional way of sorting search results?
  • Do the action when the DIV comes in the display area of the browser with jQuery
  • jQuery slideshow overlapping CSS ribbon
  • JQuery animate function dont work
  • problems charts jquery highcharts
  • How to reset the select box values in Jquery sumoselect Multi select plugin
  • css absolute position on top of another element
  • How use jQuery String variable in html body
  • Get a row from table in view on modal bootstrap using codeigniter
  • How to make the effect of a div that covers an other div when scrolling?
  • Data binding using a button
  • How do i replace all dot in string to Underscore?
  • grab non-sibling element with jquery
  • Select a word and click it
  • Trigger modal instead redirect to /users/sign_in path, Rails 4 with devise
  • Combining Parent theme JS and CSS
  • Angular ui-grid - DropDown Selection shows Id
  • jquery addclass when there is content on body
  • JQUERY : CSS does not apply to dynamically created elements
  • Bootstrap multiselect dropdown checkbox not working on paginated table
  • JQuery scroll to dynamic id
  • Jquery first time tried ajax
  • Disable the link on the active tab (Bootstrap)
  • How to handle this validation when a div is added?
  • how to show/hide and check/uncheck checkboxes dynamically inside kendo grid
  • Conditional parameters for AJAX function
  • Jquery add class to input checkbox field
  • Bootstrap countdown timer Jquery
  • Open the closest modal of jQuery clicked element
  • change background color of specific button on click
  • shadow
    Privacy Policy - Terms - Contact Us © ourworld-yourmove.org