Searchpanes not functional with searching columns with comma-separated values (not array).

Searchpanes not functional with searching columns with comma-separated values (not array).

tfrancoistfrancois Posts: 9Questions: 2Answers: 0
edited March 2020 in Free community support

I am having a dilemma where I have data in one column that consists of a string of comma-delimited values (not an object array). I was able to create a custom SearchPane using the options function with a list of all the unique or distinct values in this column with no problem. But I am not able to produce the equivalent function that will return filters where each unique value appears in the column. And I have tried using rowData[rowIdx].includes() to no avail. See picture below:

Can anyone help me? I can't seem for the life of me to get the custom options function correct at all.

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    This example here should help, it's doing the same,

    Colin

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0

    Hi Colin,

    Thank you for the reply. But no, I did see that example and that example is based on a source object with an array, but my object source is not. It is a string that happens to have values separated by commas in the string. I don't know why I can't seem to figure out how to get the JS .includes() or similar function to work.

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    The same principal would apply - you need to return an array of the values. If that doesn't help, could you create a test case reproducing this, please - it would help us move this forward.

    Colin

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0
    edited March 2020

    Hmmm...now I'm confused. I got this to work in this live.datatables.net example, so I'm not sure why it's not working in my current environment. The only major difference is that in my current code, I pull my data from a MySQL table with ajax. Glad to see though that it is working here! Or is there a fix that was added to the nightly builds to support .includes() function? Thanks!

  • kthorngrenkthorngren Posts: 21,167Questions: 26Answers: 4,921
    Answer ✓

    Can you update your example with a sample of your real data? You can get the data from the browser's network inspector. Create a Javascript variable with some or all of the data - whatever is needed to show the issue. Then use data like this example for Datatables to use the data.

    Kevin

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0

    Kevin,

    Believe it or not, your suggestion gave me a clue! I noticed in the data example you showed, the JSON data object was a simple array while my ajax array had named columns and switching the rowData[index] to rowData[columnName] worked!!!! Never would have thought to make that change had you not given me an example of the data to compare how different it looked to my data object. Thank you again!

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0

    Now my only issue is trying to figure out why when I select a filtered result row in the search pane larger than say 500 records it takes a LONG time to display the results. I guess it's processing the includes() eval for each row, one row at a time? Any way to speed this up?

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    It should be fast with 500 records - see here with 5,000. Could you update examples to demonstrate the issue, please.

    Colin

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0

    Hi Colin,

    Please remember I am searching for a substring match with the SearchPanes using custom filter function leveraging .includes() or indexOf(). They both take a long time to return the filtered results. The example you referenced does not make use of a custom filtering function or partial string search. Do you have any thoughts on what I could do to make it faster?

  • tfrancoistfrancois Posts: 9Questions: 2Answers: 0

    Ok it appears as if setting the cascasePanes = true has dramatically improved response time/performance with the includes()-based custom function. I think I might be all set at this point. Thank you all for your feedback and responses.

This discussion has been closed.