Solved

Best way to validate from fields before ajax submission

Posted on 2014-03-22
8
505 Views
Last Modified: 2014-03-25
Hi,

I need to validate form and once the form is validated then the ajax should submit the form?

validate method -> true -> call ajax -> form submitted...
0
Comment
Question by:Rocking
[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
8 Comments
 
LVL 22

Expert Comment

by:Mrunal
ID: 39948281
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39948293
0
 

Author Comment

by:Rocking
ID: 39948799
is it the best approach to create a plain java script method to do the validation and then check in the another function its return value and then call ajax to submit the form?

function validate(){
xxx
xxx
xxxx

return true/false
}

function SubmitFrm() {
 var chkfrmValidation = validate();
//if the return value true go for ajax
       {
            $.ajax({
                  type : 'post',
                  url : 'testsubmit',
                  data : $('#registerform').serialize(),
                  async : false,
                  dataType : "text",
                  beforeSend : function() {
                        $.blockUI({ message: '<h1><img src="../img/loading.gif" /> Processing...</h1>'});
                  },
                  complete : function() {
                        $.unblockUI();
                  },
                  success : function(data) {
                  $.unblockUI();
                        alert(data);
                        
                  },
                  error : function(data) {
                        // check status && error
                  }

            });
      }
0
Are You Using the Best Web Development Editor?

The worlds of web hosting and web development are constantly evolving. Every year we see design trends change, coding standards adapt and new frameworks/CMS created. With such a quick pace of change it’s easy to get lost trying to keep up.

See if your editor made the list.

 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 80 total points
ID: 39949168
I prefer this

$(function() {
  $("#formId").on("submit",function(e) {
    e.preventDefault();
    if (.......) {
      $.ajax(...)
    }
  });
});
0
 

Author Comment

by:Rocking
ID: 39950827
What if we call the validate function in   beforeSend : function() {} ?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39951711
Why even start the ajaxing if not valid?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39951716
Why even start the ajaxing if not valid?
0
 
LVL 34

Assisted Solution

by:Slick812
Slick812 earned 30 total points
ID: 39952304
greetings him121, Here you ask -
 "is it the best approach to create a plain java script method to do the validation and then check in the another function its return value and then call ajax to submit the form?"

Right, , That would get it done, to use the function validate(), and if TRUE then proceed to the ajax.

The  ajax   beforeSend : function()   is NOT the place to do the validate, as this beforeSend is suppose to be a place to RE-configure the ajax headers and other PRE ajax send adjustments or Call in a wait image, , , , beforeSend is not a place to do work outside of the necessary Ajax stuff .

No one can say if "is it the best approach", since there are many ways to go through the processes (validation, get form input data, send the ajax to server).

But you seem to be new at doing this sort of thing, so are you asking for suggestions on how to do this with plain javascript, or with just jQuery javascript,

or what sort of answers could help you here?
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

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

Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

717 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