columnControl: pre load columnControl values when using searchList

columnControl: pre load columnControl values when using searchList

timb72timb72 Posts: 12Questions: 2Answers: 0

Looking at the "Options via Ajax only" example it shows how searchList dropdowns can be populated by values returned in columnControl when the table is loaded via ajax.

This is nice, but for my requirement I already know what specific items I want in each dropdown and because I'm using ajax I want them to stay the same, even if the values do not currently exist in the corresponding column of the currently rendered table.

Is there a way of pre-loading the values in columnControl rather than them being returned with every ajax request and thus reducing the size of the response?

Answers

  • allanallan Posts: 64,653Questions: 1Answers: 10,689 Site admin

    You could return the options in the first data request for the Ajax info, and not in any subsequent requests. That should work.

    There isn't currently an API method to update the options, otherwise you could have disabled all the auto update stuff and then just populate it when you need. I'll consider that for a future enhancement.

    Allan

  • timb72timb72 Posts: 12Questions: 2Answers: 0

    Thanks for the guidance @allan, I will update so they only return from the first request. The project I'm working on has quite a few searchList dropdowns and some have many options (100+, slightly ridiculous but not my decision) so sending all those back for every request seemed a bit much.

    Tim

  • timb72timb72 Posts: 12Questions: 2Answers: 0

    @allan I'm afraid that approach doesn't work. I return the columnControl options in the first request, and they all display in the searchList dropdowns, but then on subsequent requests (when I'm not returning the options) it reverts back to the searchList dropdowns only dynamically displaying the options in relation to the table content.

  • allanallan Posts: 64,653Questions: 1Answers: 10,689 Site admin

    I've created this little test case showing the behaviour you describe - apologies, I hadn't remembered how things work when I was replying last night.

    If you were to uncomment the columnControl: {} in data2 then it falls into this section and would hide the list.

    I'm wondering if it would be worth there being another option hideOnNoData (horrible horrible name) that would just do a return there and would allow what you are looking for.

    Any suggestions for a better property name?

    Allan

  • timb72timb72 Posts: 12Questions: 2Answers: 0

    Thanks for looking into it @allan

    There may be a bit of confusion, because what I want is for there always to be the same dropdown options on each column - and once we have them from the first request I want them to persist for all subsequent requests without having to include them in the response each time?

    Sorry if I've not explained it very well - or if I've missed something in your test case.

    Tim

  • allanallan Posts: 64,653Questions: 1Answers: 10,689 Site admin

    Is that not what the example I linked to represents? It doesn't work the way you want, but the first fake response has the ColumnControl list properties:

    {
      data: [
        { A: '1,1', B: '1,2' },
        { A: '2,1', B: '2,2' }
      ],
      columnControl: {
        A: ['1,1', '1,2', '1,3']
      }
    };
    

    And the second doesn't (with different values for the DataTable to show):

    {
      data: [
        { A: '5,1', B: '5,2' },
        { A: '6,1', B: '6,2' },
        { A: '7,1', B: '7,2' },
        { A: '8,1', B: '8,2' }
      ],
      // columnControl: {}
    };
    

    Allan

  • kthorngrenkthorngren Posts: 22,080Questions: 26Answers: 5,087
    edited June 24

    I updated Allan's test case with this just to demo Allan'is suggestion:

        // If columnControl: {} is returned then don't update the options
        if ($.isEmptyObject(json) && config.ajaxOnly) {
          return;
        }
    

    And uncommented columnControl: {} in data2.

    https://live.datatables.net/gumugotu/5/edit

    It doesn't check for an option like hideOnNoData but does check for an empty columnControl. If empty it simply returns not updating the options. How about an option name of updateEmptyOptions with the default of true and if false do the above check.

    @timb72 is this what you are looking for?

    EDIT: Something will need to be added in case the columnControl object is not supplied. Currently this code:

    var json = (_a = dt.ajax.json()) === null || _a === void 0 ? void 0 : _a.columnControl;

    results in an empty object if columnControl doesn't exist in the JSON response.

    Kevin

  • timb72timb72 Posts: 12Questions: 2Answers: 0

    Thanks @allan and @kthorngren - again really appreciate your time and how quickly you respond.

    Kevin's demo from Allan's test case is exactly what I'm looking for - so an option like 'updateEmptyOptions' would be great, making sure that columnControl: {} is returned in the response for subsequent requests.

  • allanallan Posts: 64,653Questions: 1Answers: 10,689 Site admin

    I've committed a change which adds a new hidable option which achieves what you are looking for.

    It is in the nightly now and I've updated the example here. It will be in the next release :).

    Allan

  • timb72timb72 Posts: 12Questions: 2Answers: 0

    That's great @allan, many thanks.

    Tim

Sign In or Register to comment.