asked on

form submission verification on jquery mobile

I have a mobile jquery form. ON submission I check for verification and return false.
It's not stopping the form and I think it has to do with jquery mobile.
How am I supposed to get around it?

<form action="<%=MM_editAction%>" method="post" name="FrontPage_Form1" id="FrontPage_Form1" data-ajax="false" onSubmit="return FrontPage_Form1_Validator(this)">
<input type="submit" name="button" id="button" value="Submit" class="btnplaceOrder" /></form>

Open in new window

Verification looks like this:

  if (theForm.ccf_FirstName.value == "")  {
    alert("Please enter a value for the \"First Name\" field.");
		  $("#accordion").accordion( "option", "active", 1 );

    theForm.ccf_FirstName.focus();
    return (false);
  }

Open in new window

Michel Plungjan

Perhaps post the HTML for the field and include the function statement

ASKER CERTIFIED SOLUTION

Roopesh Reddy

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Michel Plungjan

I strongly recommend never to use onclick of submit buttons.
The problem lies elsewhere

Roopesh Reddy

Hi,

@mplungjan -
Yeah! I just created a sampe for the author to test. Anyway thanks for highlighting it!!!

@Author

Can you show the complete code to find the culprit.

Moreover, you are using "theForm.ccf_FirstName" , but the form ID is FrontPage_Form1 according to your form tag!

Michel Plungjan

That is because the validation passes the form as theForm

function FrontPage_Form1_Validator(theForm) {
.
.
.

Roopesh Reddy

Hi,

In that case, it's working fine for me -

    <form action="sample.htm" onsubmit="return Validate(this);">
        <input type="text" name="txt" id="txt" />
        <input type="submit" value="Submit"/>
    </form>
    <script type="text/javascript">
        function Validate(theForm) {
            if (theForm.txt.value == "") {
                //Your logic to display custom message
                document.getElementById("txt").focus();
                return false;
            }
        }
    </script>

Open in new window

Hope it helps u...

Michel Plungjan

Why would you mix DOM and form access. You already have the field. Also return true if ok.

function Validate(theForm) {
if (theForm.txt.value == "") {
//Your logic to display custom message
theForm.txt.focus();
return false;
}
return true;
}

There is obviously something else wrong with the page - no need to post similar code to what is already used...

Roopesh Reddy

@mplungjan

Aaaah yeah! I didn't noticied it.

@Author
You need to respond to fix this issue!!!

rivkamak

ASKER

That script you gave didn't work either.
Is there any connection with the fact that I am using ajax mobile that isn't making that mobile form work?

Michel Plungjan

Possibly. Hard to tell with the snippet you sent.

I suggest you debug it

you can use Web Inspector on iPhone for example

Roopesh Reddy

Hi,

Are you using any third party plugins? Moreover, try creating a simple page and do some validation and check whether it works.

That way you can narrow down the issue easily!

Hope it helps u...

rivkamak

ASKER

I made it a simple form with a simple function

function Validate() {
console.log("function running");
return false;
}

the console is logged , but it doesn't return false. the form still submits.
my button looks like this:

<input type="submit" name="button" id="button" value="Submit" class="btnplaceOrder" onclick="Validate();"/>

Michel Plungjan

you need to
Onclick="return Validate()"

But better to do that in onsubmit of the form tag

Michel Plungjan

hmm