Answers

• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  May 2

  Using ajax, whether using server side processing or not, is an asynchronous process. If you only need this once after initialization move that code into initComplete. If you want to use it each time the server side process is called then use xhr.

  Kevin
• washuit-iamm Posts: 121Questions: 51Answers: 2

  May 3

  @kthorngren Same issue:

  
• washuit-iamm Posts: 121Questions: 51Answers: 2

  May 3

  @kthorngren And with xhr event, same issue:

  

  There seems to be no way to access the queryBuilder API in events when using serverSide.

  What am I missing?
• allan Posts: 61,972Questions: 1Answers: 10,160 Site admin

  May 3

  I rather suspect that SearchBuilder hasn't been created on the DataTable by the time the xhr event fires the first time, but I haven't had a chance to try it out yet. That would explain why it works if you add a time delay though.

  What are you trying to do with the details in the xhr event? Can you wait for draw?

  Allan
• washuit-iamm Posts: 121Questions: 51Answers: 2

  May 3 edited May 3

  @allan Similar issue with draw event and .rebuild().

              table.on('draw', function () {
  
                  console.log("draw - TODO Share SearchBuilder Feature");
                  // console.log(table.searchBuilder.getDetails());
  
                  const urlParams = new URLSearchParams(window.location.search);
                  const searchBuilderParam = urlParams.get('searchBuilder');
                  if (searchBuilderParam) {
                      table.searchBuilder.rebuild(JSON.parse(searchBuilderParam));
                  }
              })
  

  

  Usecase: Allow user to share their search config with eachother. And save/bookmark as well.

  IE:

  {
      text: 'Share',
      action: function (e, dt, node, config) {
          const search = dt.searchBuilder.getDetails();
          const value = JSON.stringify(search);
          const queryParams = new URLSearchParams();
          queryParams.set("searchBuilder", value);
          const shareUrl = `${window.location.origin}/index.html?${queryParams}`;
  // TODO - Display link to user
          console.log(shareUrl);
      }
  },
  

  Open to advice or alternative solutions.
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  May 3 edited May 3 Answer ✓

  Using the new ready() API seems the way to go. I placed your code into this test case:
  https://live.datatables.net/yaroyala/2/edit

  I tried this "share" link and it worked:
  https://live.datatables.net/yaroyala/2?searchBuilder=%7B%22criteria%22%3A%5B%7B%22condition%22%3A%22starts%22%2C%22data%22%3A%22Name%22%2C%22origData%22%3A%22first_name%22%2C%22type%22%3A%22string%22%2C%22value%22%3A%5B%22air%22%5D%7D%5D%2C%22logic%22%3A%22AND%22%7D

  Kevin
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  May 3 edited May 3

  You may also be interested in the Deep link plugin. Although this example is using searchPanes.preSelect with deep linking it might give you an idea of how to do the same with searchBuilder.preDefined:
  https://live.datatables.net/rejeqese/1?searchPanes.preSelect=[{%22rows%22:[%22Edinburgh%22,%22London%22],%22column%22:2}]

  The example is from this thread if you want some background.

  Kevin
• washuit-iamm Posts: 121Questions: 51Answers: 2

  May 7

  @kthorngren that is very helpful. Regarding that ready method, the docs say:

  but they only fire once on a table and (without this method) there is no way to know if the table is ready or not.

  That seems to suggest ready couple be called more than once, obviously that would be a big issue if the query string is being read and searchBuilder invoked multiple times after the page loads.

  In my testing, I was able to search, sort, filter and mess with the query builder without seeing ready be called > 1 time but the docs worry me in that regard.
• kthorngren Posts: 20,425Questions: 26Answers: 4,794

  May 7

  I agree that sentence is a bit confusing but true; those events fire only once

  The ready() docs state this:

  DataTables is in it's "ready" state - i.e. it has initialised, its control elements are on the page and the first data has been loaded and displayed.

  My understanding is the "ready" state happens only once. However you could call ready() multiple times and the function defined will execute each time called but only after the Datatable has reached the "ready" state. As long as you call it only once the function will execute only once. Again that is my understanding. I haven't messed with it much though.

  @allan can confirm and maybe adjust that verbiage a bit.

  Kevin
• allan Posts: 61,972Questions: 1Answers: 10,160 Site admin

  May 8

  Yes, Kevin's understanding is spot on. You can call ready() as many times as you want - it will execute whatever is given to it when the DataTable is ready, or immediately if the DataTable is already in a "ready" state.

  Allan