Highlighted

CFFORM onSubmit script works in FF but not in IE

Explorer ,
Jul 29, 2014

Copy link to clipboard

Copied

I've got a CFFORM that has an onSubmit additional javascript for  form validation, and while it works in FF, it passes right through in IE and ends up erroring because the mandatory fields aren't there...

the CFFORM call looks like this

<cfform name="add_project" method="post" action="xxxxxxx.cfm?view=admin-add-process&entity=project" enctype="multipart/form-data" onsubmit="return checkReq();">

and the function looks like

<script language="javascript">

function checkReq() {

var valid = true;

var errMsg = '';

if (document.add_project.projectreviewer_emails.value.trim() == '') {

...

} else {

...

}

...

</script>

Any ideas?

Thanks in advance,

bw

Adobe Community Professional
Correct answer by BKBK | Adobe Community Professional

There is some doubt regarding the universality of Javascript's trim function among browsers. Is it vital here?  If you leave it out, your code will work across all browsers. Something along the lines of:

<script type="text/javascript">

function checkReq() {

    var valid = true;

    var errMsg = '';

    var projectReviewerEmails = document.forms["add_project"]["projectreviewer_emails"].value;

    if (projectReviewerEmails == '') {

        // no no no no no

        return !valid;

    } else {

        // yeah yeah yeah yeah yeah

        return valid;

    }

}

</script>

<cfform name="add_project" method="post" action="test.cfm?view=admin-add-process&entity=project" enctype="multipart/form-data" onsubmit="return checkReq();">

<cfinput type="file" name="projectreviewer_emails" >

<cfinput type="submit" name="sbmt" value="Submit">

</cfform>

Views

423

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

CFFORM onSubmit script works in FF but not in IE

Explorer ,
Jul 29, 2014

Copy link to clipboard

Copied

I've got a CFFORM that has an onSubmit additional javascript for  form validation, and while it works in FF, it passes right through in IE and ends up erroring because the mandatory fields aren't there...

the CFFORM call looks like this

<cfform name="add_project" method="post" action="xxxxxxx.cfm?view=admin-add-process&entity=project" enctype="multipart/form-data" onsubmit="return checkReq();">

and the function looks like

<script language="javascript">

function checkReq() {

var valid = true;

var errMsg = '';

if (document.add_project.projectreviewer_emails.value.trim() == '') {

...

} else {

...

}

...

</script>

Any ideas?

Thanks in advance,

bw

Adobe Community Professional
Correct answer by BKBK | Adobe Community Professional

There is some doubt regarding the universality of Javascript's trim function among browsers. Is it vital here?  If you leave it out, your code will work across all browsers. Something along the lines of:

<script type="text/javascript">

function checkReq() {

    var valid = true;

    var errMsg = '';

    var projectReviewerEmails = document.forms["add_project"]["projectreviewer_emails"].value;

    if (projectReviewerEmails == '') {

        // no no no no no

        return !valid;

    } else {

        // yeah yeah yeah yeah yeah

        return valid;

    }

}

</script>

<cfform name="add_project" method="post" action="test.cfm?view=admin-add-process&entity=project" enctype="multipart/form-data" onsubmit="return checkReq();">

<cfinput type="file" name="projectreviewer_emails" >

<cfinput type="submit" name="sbmt" value="Submit">

</cfform>

Views

424

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jul 29, 2014 0
Engaged ,
Jul 30, 2014

Copy link to clipboard

Copied

What does the input field projectreviewer_emails look like in your HTML?

What do you get if you do

  • console.log(document.add_project.projectreviewer_emails.value);
  • console.log(document.add_project.projectreviewer_emails);
  • console.log(document.add_project);

PS: the language attribute on <script> has been deprecated since 1999, change it to

<script type="text/javascript">

or even just

<script>

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 30, 2014 0
Adobe Community Professional ,
Jul 30, 2014

Copy link to clipboard

Copied

There is some doubt regarding the universality of Javascript's trim function among browsers. Is it vital here?  If you leave it out, your code will work across all browsers. Something along the lines of:

<script type="text/javascript">

function checkReq() {

    var valid = true;

    var errMsg = '';

    var projectReviewerEmails = document.forms["add_project"]["projectreviewer_emails"].value;

    if (projectReviewerEmails == '') {

        // no no no no no

        return !valid;

    } else {

        // yeah yeah yeah yeah yeah

        return valid;

    }

}

</script>

<cfform name="add_project" method="post" action="test.cfm?view=admin-add-process&entity=project" enctype="multipart/form-data" onsubmit="return checkReq();">

<cfinput type="file" name="projectreviewer_emails" >

<cfinput type="submit" name="sbmt" value="Submit">

</cfform>

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 30, 2014 1