Jump to content
  • 0

Dynamic filtering


Question

Does anyone know if its possible in JS to dynamically change the filters applying to a Table or View that's linked to a datapage?  I have several checkboxes for Users to select from, and the selections can drastically alter the types of filters I want to apply.   Essentially I'm looking for much greater control over the results table than the Caspio wizard screen filters can allow.

Thanks

Link to post
Share on other sites

3 answers to this question

Recommended Posts

  • 0
On 5/23/2017 at 10:48 PM, Gregstand said:

Does anyone know if its possible in JS to dynamically change the filters applying to a Table or View that's linked to a datapage?  I have several checkboxes for Users to select from, and the selections can drastically alter the types of filters I want to apply.   Essentially I'm looking for much greater control over the results table than the Caspio wizard screen filters can allow.

Thanks

Hi Gregstand,

It looks to me that you need something similar to this.

Hope this helps.

 

Link to post
Share on other sites
  • 0

Thanks Vitalikssssss,

Yes, that explains how to filter a results datapage.  But the problem I face is that I'd need many many datapages with their own tailored filters to achieve what I need.  I'm trying to drastically cut down on the number of results datapages by trying to have some control over filtering using JS or jquery.  I don't really care whether the code directly affects the Tables, the Views or the datapages, as long as I can have some control using coding.

Thanks

 

Link to post
Share on other sites
  • 0
On 6/1/2017 at 11:11 AM, Gregstand said:

Thanks Vitalikssssss,

Yes, that explains how to filter a results datapage.  But the problem I face is that I'd need many many datapages with their own tailored filters to achieve what I need.  I'm trying to drastically cut down on the number of results datapages by trying to have some control over filtering using JS or jquery.  I don't really care whether the code directly affects the Tables, the Views or the datapages, as long as I can have some control using coding.

Thanks

 

I actually just learned a rustic way on how to do this.

You will first need to set up your DataPage as a table (I haven't tested this for any other DataPage type, but the principle may be the same). Go through the whole set up, and once you arrive at the Configure Results Page Fields, add a Header and a Footer as DataPage Elements.

Here is where it gets a bit tricky. Go to the Header and click on the "Source" button to add the following HTML code:

<input id="myInput" onkeyup="myFunction()" placeholder="Carrier" type="text" />

<script>
function myFunction() {
  var input, filter, table, tr, td, i;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  table = document.getElementById("caspioform");
  tr = table.getElementsByTagName("tr");


  for (i = 0; i < tr.length; i++) {
    td = tr.getElementsByTagName("td")[0];
    if (td) {
      if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
        tr.style.display = "";
      } else {
        tr.style.display = "none";
      }
    } 
  }
}
</script>

Click preview and the filter will only keep the text that matches what's in the input box no matter where the text actually resides. Do note this will only filter the FIRST column in the table. If you want to change the column that's being filter, change this line of code:

td = tr.getElementsByTagName("td")[0]; (Change the [0] to the column where you want the filter to be applied; i.e. [0] is the first column, [1] is the second column, so on and so forth)

Also note this will only work depending on how scripts are ran in the host page. The preview page runs the script just fine, but when you embed the the table in something like Wordpress, you will have to add the Script to Wordpress or this won't work. Some webpages don't let you run JS willy-nilly to prevent websites from crashing.

Also note this is a basic filter that can only filter ONE column at a time. If you need multiple filters to work in tandem, this will not work for you. You can Copy/Paste the same script with some modification to sort different columns (you will have to change the myInput and myFunction in the new script to something like myInput1 and myFunction1), but like I said they will only work on the column you tell them to filter.

I am a pleb when it comes to programming, but I am sure savvy people can work this if you need it.

Thanks.

 

 

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...