Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

form submission verification on jquery mobile

Posted on 2013-01-25
14
Medium Priority
?
414 Views
Last Modified: 2013-01-28
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

0
Comment
Question by:rivkamak
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 5
  • 2
14 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38821444
Perhaps post the HTML for the field and include the function statement
0
 
LVL 23

Accepted Solution

by:
Roopesh Reddy earned 2000 total points
ID: 38821613
Hi,

Sample for you -

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

Open in new window


Hope it helps u...
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38821642
I strongly recommend never to use onclick of submit buttons.
The problem lies elsewhere
0
A new era in Cloud training has arrived.

A day that will go down in Cloud history.. But are you ready for it? Will you accept this Cloud challenge?

 
LVL 23

Expert Comment

by:Roopesh Reddy
ID: 38821894
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!
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38821951
That is because the validation passes the form as theForm

function FrontPage_Form1_Validator(theForm) {
.
.
.
0
 
LVL 23

Expert Comment

by:Roopesh Reddy
ID: 38822103
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...
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38822117
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...
0
 
LVL 23

Expert Comment

by:Roopesh Reddy
ID: 38822147
@mplungjan

Aaaah yeah! I didn't noticied it.

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

Author Comment

by:rivkamak
ID: 38825629
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?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38826005
Possibly. Hard to tell with the snippet you sent.

I suggest you debug it

you can use Web Inspector on iPhone for example
0
 
LVL 23

Expert Comment

by:Roopesh Reddy
ID: 38826828
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...
0
 

Author Comment

by:rivkamak
ID: 38828138
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();"/>
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38828339
you need to
Onclick="return Validate()"

But better to do that in onsubmit of the form tag
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38828995
hmm
0

Featured Post

[Webinar] Lessons on Recovering from Petya

Skyport is working hard to help customers recover from recent attacks, like the Petya worm. This work has brought to light some important lessons. New malware attacks like this can take down your entire environment. Learn from others mistakes on how to prevent Petya like worms.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn how to dynamically set the form action using jQuery.

721 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question