[Answer]-Jquery ajax loads list of results even there's nothing to query

by

1👍

$('#search').keyup(function () {
    if (!$.trim(this.value).length) return; //<< returns from here if nothing to search
    $.ajax({
        type: "POST",
        url: "/status/search_status/",
        data: {
            'search_text': $('#search').val(),
                'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
        },
        success: searchSuccess,
        dataType: 'html'
    });
});

BTW, you should throttle your request on keyup to avoid multiple call if user is typing too fast:

(function () {
    var throttleTimer;
    $('#search').keyup(function () {
        clearTimeout(throttleTimer);
        throttleTimer = setTimeout(function () {
            if (!$.trim(this.value).length) return;
            $.ajax({
                type: "POST",
                url: "/status/search_status/",
                data: {
                    'search_text': $('#search').val(),
                        'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
                },
                success: searchSuccess,
                dataType: 'html'
            });
        }, 100);
    });
}());
👤A. Wolff

Leave a comment