Required Field Errors Not Working Upon Forms Submission

[lmsimple]

Hello,

 

We have an ongoing problem that we have not yet found a solution to, so would like to try the forum again. We have embedded our Submission Form in our website here:  https://napo.site-ym.com/?caspio_submission

 

When pressing the submit button without all required fields completed, the submitter SHOULD get the red error messages for those fields that are not complete. BUT INSTEAD, he is redirected to the Home Page of our website. 

 

This has randomly worked correctly a couple of times, but then stops working again (with no back-end changes made).  We only have simple javascript in the footer of our form as follows:

 

<SCRIPT LANGUAGE="JavaScript">

 /* "fieldName" is the variable name for the listbox type form element field. */

   var fieldName = "InsertRecordAreaofFocus";

 

   var x=document.getElementsByName(fieldName);

   x[0].multiple=true;

 

</SCRIPT>

 

<SCRIPT LANGUAGE="JavaScript">

 /* "fieldName" is the variable name for the listbox type form element field. */

   var fieldName = "InsertRecordKeywords";

 

   var x=document.getElementsByName(fieldName);

   x[0].multiple=true;

 

</SCRIPT>

 

Thanks for any assistance you can provide,

Lori

[svitlanataran]

Hi Lori, 

 

I've checked direct link to the form and validation works well. But Form behaves strange on the website. 

Can you please check your source table? Do you see blank records there? I've clicked "Submit"  several times without filling out the form, please check. 

 

One of possible reasons - you use JavaScript on your website, which redirect user without validation.

[MayMusic]

A recommendation which might not be related to your issue, combine your javascipts together. You can easily add fields that need to have multi select enabled here in the array

<script>
var o_els = new Array("InsertRecordAreaofFocus","InsertRecordKeywords");

function f_cap() {
    for (var i = 0; i < o_els.length; i++) {
        var fieldName = o_els[i];

   var x=document.getElementsByName(fieldName);
   x[0].multiple=true;
        
    }
}

f_cap();
</script>

[lmsimple]

Matilda - I don't show any new submissions to the table today. The last one is from April 6.  I have tested this before and a submission is not added to the table when it is submitted with errors.  It works fine if all required fields are completed.

 

MayMusic - I replaced our Javascript with your suggested. While it didn't solve the problem, the form works as before so we are no worse off  Good to have cleaner script.

[svitlanataran]

Lori,

 

If there is no blank fields in the source table, it means that validation on the form works fine. It submits data only when all the required fields filled out.

 

Please check scripts on your webpage, it looks like on the some event like "submit" it redirects user to the other page without submitting data.

[lmsimple]

Thanks for your assistance Matilda.  I'll have our web team look into the web script.

[lmsimple]

Hi Matilda,

 

Our web team has reviewed the web page and there is no coding on the page other than the embed HTML from Caspio.  Following is the HTML we are using as well as the script from the 2nd line (https://b5.caspio.com/scripts/e1.js). Thanks again.

 

<div id="cb7f0630007e9136e2dac24d3293a2"><a href="http://www.caspio.com" target="_blank">Online Database</a> by Caspio</div>

<script type="text/javascript" src="https://b5.caspio.com/scripts/e1.js"></script>

<script type="text/javascript">try{f_cbload("7f0630007e9136e2dac24d3293a2","https:");}catch(v_e){;}</script>

<div id="cxkg"><a href="https://b5.caspio.com/dp.asp?AppKey=7f0630007e9136e2dac24d3293a2">Click here</a> to load this Caspio <a href="http://www.caspio.com" title="Online Database">Online Database</a>.</div>

function f_cbload(appKey, protocol) { var l = { _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=", encode: function(a) { var b = "", d, c, e, f, g, n, h = 0; for(a = l._utf8_encode(a) ; h < a.length;) d = a.charCodeAt(h++), c = a.charCodeAt(h++), e = a.charCodeAt(h++), f = d >> 2, d = (d & 3) << 4 | c >> 4, g = (c & 15) << 2 | e >> 6, n = e & 63, isNaN(c) ? g = n = 64 : isNaN(e) && (n = 64), b = b + this._keyStr.charAt(f) + this._keyStr.charAt(d) + this._keyStr.charAt(g) + this._keyStr.charAt(n); return b; }, _utf8_encode: function(a) { a = a.replace(/\r\n/g, "\n"); for(var b = "", d = 0; d < a.length; d++) { var c = a.charCodeAt(d); 128 > c ? b += String.fromCharCode(c) : (127 < c && 2048 > c ? b += String.fromCharCode(c >> 6 | 192) : (b += String.fromCharCode(c >> 12 | 224), b += String.fromCharCode(c >> 6 & 63 | 128)), b += String.fromCharCode(c & 63 | 128)); } return b; } }; var v_winloc_search = window.location.search.substring(1); var v_path = window.location.pathname + v_winloc_search; document.write('\n<style type="text/css">\n\x3c!--\n #cxkg {visibility:hidden; font-size:6px; position:relative; }\n--\x3e\n</style>\n'); if(-1 != v_path.toUpperCase().indexOf("DP.ASP?APPKEY=") || -1 != v_path.toUpperCase().indexOf("DP.ASP?APPSESSION=")) { document.write("<br/><strong>Error - Cannot display DataPage due to multiple embedded deployments.</strong></br>"); } else { appKey = (appKey || '').replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, '"').replace(/'/g, "'"); var v_queryString = "AppKey=" + appKey + "&js=true" + "&pathname=" + window.location.protocol + "//" + window.location.host + window.location.pathname + "&" + v_winloc_search; v_queryString = "cbqe=" + l.encode(v_queryString) + "&cbEmbedTimeStamp=" + new Date().valueOf(); document.write('<script type="text/javascript" src="' + protocol + "//b5.caspio.com/dp.asp?" + v_queryString + '">\x3c/script>'); } };