Highlighted

Checking HTML 5 validation is successful or not

Explorer ,
Jul 04, 2014

Copy link to clipboard

Copied

I need to check whether HTML 5 native validation is successful or not. Based on this I need to call an ajax function.

An example code is here. http://jsfiddle.net/inDiscover/4Pbcp/

Also providing the example code as below.

    <!DOCTYPE html>

    <html>

        <head>

            <title>jQuery UI Dialog: Open Dialog on Clicksssssssssss</title>

            <link rel="stylesheet" href="../css/jquery-ui.css" />

            <link rel="stylesheet" href="../css/style.css" />

            <script type="text/javascript" src="../scripts/jquery.js"></script>

            <script type="text/javascript" src="../scripts/jquery-ui.js"></script>

            <script type="text/javascript" src="../scripts/jquery.validate.js"></script>

   

            <script type="text/javascript">

                $(function(){

                    $("#pop_submit").click(function()

                    {

                        alert("am here");

                        //return false;

                    });

                });

            </script>

   

        </head>

        <body>

            <div id="popup" style="display:block">

                <form action="" name="pop_up_form" id="pop_up_form" method="post">

                    <input class="pop_up_textbox" type="text" name="acct_nmbr" id="acct_nmbr" required maxlength="19" value=""/>

                    <input type="submit" name="pop_submit" id="pop_submit" style="display:block;" />

                </form>

            </div>

        </body>

    </html>

Here in the jquery code I have put an alert while submitting the button. But I need to show this alert only after successful HTML 5 native validation. If any one can point me out that is how can I achieve this then I can call an ajax function instead of an alert message after successful HTML 5 native validation.

I know we can use JQuery Validator to validate a form by using valid() method but I don't wanna go in that way. I need to know whether my HTML 5 native validation is successful and if it is I need to do some logic.

Most Valuable Participant
Correct answer by Carl_Von_Stetten | Most Valuable Participant

Abdul,

I meant no disrespect.  There are many who use these forums who don't understand the difference between client-side and server-side code, and only see things from the "ColdFusion perspective".  They tend to ask any and all web-development related questions here, rather than in more appropriate forums.  With only the little bit of information provided in your post to go on, I unwittingly painted you with the same brush.  For that I apologize.

I'm probably not the only one who drew this conclusion, though.  If you had included this little bit in your original post:

As you suggested I posted in stackoverflow but no luck , I posted in jquery forumn too but use there too...

it would have been apparent that you had made efforts to find an answer in those more appropriate places, and forum members would be less likely to skip over your question.

Anyway, I just did a little Googling, and may have an answer for you.  Take a look at the checkValidity() form method (an HTML5 API method) to see if this will accomplish what you need.  An excellent tutorial on native HTML5 form validation can be found here.  I'll post this answer on your StackOverflow question too, in case it helps others.

-Carl V.

Views

1.2K

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

Checking HTML 5 validation is successful or not

Explorer ,
Jul 04, 2014

Copy link to clipboard

Copied

I need to check whether HTML 5 native validation is successful or not. Based on this I need to call an ajax function.

An example code is here. http://jsfiddle.net/inDiscover/4Pbcp/

Also providing the example code as below.

    <!DOCTYPE html>

    <html>

        <head>

            <title>jQuery UI Dialog: Open Dialog on Clicksssssssssss</title>

            <link rel="stylesheet" href="../css/jquery-ui.css" />

            <link rel="stylesheet" href="../css/style.css" />

            <script type="text/javascript" src="../scripts/jquery.js"></script>

            <script type="text/javascript" src="../scripts/jquery-ui.js"></script>

            <script type="text/javascript" src="../scripts/jquery.validate.js"></script>

   

            <script type="text/javascript">

                $(function(){

                    $("#pop_submit").click(function()

                    {

                        alert("am here");

                        //return false;

                    });

                });

            </script>

   

        </head>

        <body>

            <div id="popup" style="display:block">

                <form action="" name="pop_up_form" id="pop_up_form" method="post">

                    <input class="pop_up_textbox" type="text" name="acct_nmbr" id="acct_nmbr" required maxlength="19" value=""/>

                    <input type="submit" name="pop_submit" id="pop_submit" style="display:block;" />

                </form>

            </div>

        </body>

    </html>

Here in the jquery code I have put an alert while submitting the button. But I need to show this alert only after successful HTML 5 native validation. If any one can point me out that is how can I achieve this then I can call an ajax function instead of an alert message after successful HTML 5 native validation.

I know we can use JQuery Validator to validate a form by using valid() method but I don't wanna go in that way. I need to know whether my HTML 5 native validation is successful and if it is I need to do some logic.

Most Valuable Participant
Correct answer by Carl_Von_Stetten | Most Valuable Participant

Abdul,

I meant no disrespect.  There are many who use these forums who don't understand the difference between client-side and server-side code, and only see things from the "ColdFusion perspective".  They tend to ask any and all web-development related questions here, rather than in more appropriate forums.  With only the little bit of information provided in your post to go on, I unwittingly painted you with the same brush.  For that I apologize.

I'm probably not the only one who drew this conclusion, though.  If you had included this little bit in your original post:

As you suggested I posted in stackoverflow but no luck , I posted in jquery forumn too but use there too...

it would have been apparent that you had made efforts to find an answer in those more appropriate places, and forum members would be less likely to skip over your question.

Anyway, I just did a little Googling, and may have an answer for you.  Take a look at the checkValidity() form method (an HTML5 API method) to see if this will accomplish what you need.  An excellent tutorial on native HTML5 form validation can be found here.  I'll post this answer on your StackOverflow question too, in case it helps others.

-Carl V.

Views

1.2K

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 04, 2014 0
Most Valuable Participant ,
Jul 07, 2014

Copy link to clipboard

Copied

This is not a ColdFusion-related question.  In fact, the code you listed above has zero ColdFusion tags in it.  You would be better off posting this on StackOverflow, and use the "HTML5" and "JavaScript" tags on the question.

-Carl V.

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 07, 2014 0
Explorer ,
Jul 07, 2014

Copy link to clipboard

Copied

Thanks for you comments Carl. I knew this before posting here. As you suggested I posted in stackoverflow but no luck , I posted in jquery forumn too but use there too...

I am using this in one of my coldfusion application. I thought, if any of you CF guys are aware of this I can seek help from.

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 07, 2014 0
Most Valuable Participant ,
Jul 08, 2014

Copy link to clipboard

Copied

Abdul,

I meant no disrespect.  There are many who use these forums who don't understand the difference between client-side and server-side code, and only see things from the "ColdFusion perspective".  They tend to ask any and all web-development related questions here, rather than in more appropriate forums.  With only the little bit of information provided in your post to go on, I unwittingly painted you with the same brush.  For that I apologize.

I'm probably not the only one who drew this conclusion, though.  If you had included this little bit in your original post:

As you suggested I posted in stackoverflow but no luck , I posted in jquery forumn too but use there too...

it would have been apparent that you had made efforts to find an answer in those more appropriate places, and forum members would be less likely to skip over your question.

Anyway, I just did a little Googling, and may have an answer for you.  Take a look at the checkValidity() form method (an HTML5 API method) to see if this will accomplish what you need.  An excellent tutorial on native HTML5 form validation can be found here.  I'll post this answer on your StackOverflow question too, in case it helps others.

-Carl V.

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 08, 2014 0
Explorer ,
Jul 17, 2014

Copy link to clipboard

Copied

Thanks Carl... I understand....

Thanks for your help and it is really appreciated. I got answer for the problem after reading the link that you posted.

I have marked my question (that I posted in StackOverflow) as "answered" against your comments.

Thanks again.

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 17, 2014 0