JavaScript Does Not Work with Multiple DataPages

2 minutes to read

There could be many reasons why a JavaScript code does not work properly. There are two common issues when you have multiple DataPages deployed on one page.

When the form (DataPage) elements are not being referenced correctly.
JavaScript syntax such as document.forms[0] refers to your first DataPage. This could be a problem if you have multiple DataPages and want to work with fields of other DataPages.
To refer to the correct field of the right DataPage use document.getElementById(“InsertRecordFIELDNAME”) rather than document.forms[0].InsertRecordFIELDNAME.
When the form submission is not referenced properly.
JavaScript syntax such as document.getElementById(“caspioform”) refers to any Caspio DataPage on your page because they all share the same id as “caspioform”. This could be a problem when you have multiple DataPages and want to call onsubmit event of specific DataPage.
To refer to the right DataPage, use document.forms[X]. X starts at 0 which refers to the first form on the page and increments based on the order. For example to call onsubmit event of the second DataPage on your page use the following:
document.forms[1].onsubmit

For further information about using JavaScript in Caspio, refer to the JavaScript Tips at https://forums.caspio.com/index.php/topic/4377-js-guide-caspio-form-elements/.

If you still have questions or experiencing problems, post your JavaScript inquiry in our https://forums.caspio.com/ which is monitored by the developer community. We have also provided some JavaScript examples in the forum, please check them out at https://forums.caspio.com/index.php/forum/49-javascript-solutions-for-caspio-bridge/ Please note these solutions are as is and they have not been tested for different scenarios.

Another useful resource is http://www.w3schools.com/js/default.asp