AJAX variables not updating

AJAX variables not updating

techguy12techguy12 Posts: 1Questions: 1Answers: 0

I'm trying to add some custom fields to my AJAX query. I've settled on the most "bullet-proof" solution, which is storing it in a hidden input.

Basically, the table setup is:

        var dataTable = $('#myTable').DataTable({
            "ajax": {
                "url": "{{ route('list-products') }}",
                "type": "GET",
                "data": function (d) {
                    return $.extend({}, d, {
                        "category":  myCategory,
                    });
                },
            },
            stateSaveParams: function (settings, data) {
                data.category = $("#myTable-category").val();
            }

Apologies if the formatting drives you crazy, it's what the editor suggested is for "code."

On page load this works - I populate the $("#myTable-category") field, and it gets sent to the server as the category variable.

HOWEVER - if I update that hidden input value, the datatable never refreshes that data before it sends to the server - it continues to use the same initial value in the input field. Everything else works as it should, changing page numbers, order, etc. If I examine the stateSaveParams, the new value is in there.

stateSaveParams: 
category: "Category One"
childRows: []
columns: (4) [{…}, {…}, {…}, {…}]...

Click on another link and the category does update:

stateSaveParams: 
category: "Category Three"
childRows: []
columns: (4) [{…}, {…}, {…}, {…}]...

But the server sees the same category each time no matter what's swapped out.

Thanks in advance!!! I'm sure I'm running all around the solution.

Answers

  • colincolin Posts: 14,442Questions: 1Answers: 2,460

    You're not showing how myCategory is set. If that was set at page load, then that would be the case - you would need to get the value from your hidden field each time ajax.data is called.

    Colin

Sign In or Register to comment.