problem with jquery ajax

Question

0.00/5 (No votes)

See more:

Hi I have a problem with my javascript function. I have a register form in which i used jquery ajax to check that entered username is used by another or not(by Checking database). after press submit button "validateMyForm()" -my javascript function- is called in which i validate inputs in it. my jquery ajax is in it too.(you can see my codes in following).
You know that if returned value of "validateMyForm()" function is true, form is posted(in normal way no with ajax way). i want to post my form if entered username don't match with any one and don't want to post if username is used by another. but when i press submit button, the function skips "$.post" section and returns true always.
Can you help me?

My PHP code is:

HTML

<form method="post" action="signup.php"   önsubmit="return validateMyForm();" id="formtag">
   <input id="username" name="username" class="input-text" type="text"/>
   <p id="username-avil" style="display: none;color: rgb(255, 0, 71);">* Sorry, This username is          
       avilable!!!</p>
   <input type="submit" name="submit1" id="register" value="Register" />
</form>

And my javascript function is:

JavaScript

function validateMyForm() {
var returnedVal = true;
      //get username input text
      .
      .
      .
      $.post('ajax/checkUsername.php',{ username:username },function(data){
                     //Checking that entered username is used by another person or no
                     .
                     .
                     .
                     if(is used by another)
                        returnedVal= false;
                     else
                        ShowError;

       }, "json");

return returnedVal;
}

Posted 15-Jul-13 11:46am

alisohrabi

Updated 1-Aug-13 4:19am

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

v2

Add a Solution

Comments

Sergey Alexandrovich Kryukov 15-Jul-13 18:25pm

"Skips post" is not really clear. What likes are "skipped", exactly?
Also, you should understand that you are doing a double post, as "onsubmit" happens before form post. Why? You could use either form or Ajax to do both.
—SA

alisohrabi 16-Jul-13 7:51am

about your last sentence: I want to redirect to "userprofile.php" page if entered values of form (specially username) are valid.In addition code of redirection is in "signup.php".

Sergey Alexandrovich Kryukov 16-Jul-13 12:45pm

It doesn't explain why you are doing so. First you request for checkUsername.php, get confirmation. After that, the form sends another HTTP request for signup.php, which actually accepts the sign. Not only someone can get this name (so you cannot really satisfy your criterion for unused name), but you also do redundant post. The post should always be atomic, and it's easy to achieve. You should not do what you do.
Did you get it now?
—SA

alisohrabi 16-Jul-13 14:48pm

OK.My problem is solved by 2 words in "$.post" that is: "async: false".

Sergey Alexandrovich Kryukov 16-Jul-13 20:07pm

I see, but it does not really solve your problem. I already explained: you have two separate HTTP requests, which makes validation incorrect. Atomicity!
—SA

2 solutions

Solution 2

Hi,
Problem is in your ValidationMyForm.

C#

function validateMyForm() {
var returnedVal = true;
      //get username input text
      .
      .
      .
      $.post('ajax/checkUsername.php',{ username:username },function(data){
                     //Checking that entered username is used by another person or no
                     .
                     .
                     .
                     if(is used by another)
                     {
                        returnedVal= false;
                       
                     else
                        ShowError;

       }return returnedVal;}, "json");

return returnedVal; //remove this
}

Posted 1-Aug-13 4:26am

Harshil_Raval

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Deviprasad Das · Accepted Answer · 2013-08-01T04:17:00

I think there is a problem with the code.

In validateMyForm() you are setting returnedVal to true and after ajax response you are setting the value to true / false.

So the problem here is "AJAX call are Asynchronous", so the code written after $.post will be executed and will not wait for the response from the server.
i.e, it will always return true.

I hope you got it.

problem with jquery ajax

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

problem with jquery ajax

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

Existing Members

...or Join us