Question

I am trying to submit my form to 2 different scripts on form submission. ScriptA that the form is submitted to redirects on submission. ScriptB doesnt give response of any kind, just writes the given info down.

I can’t get the submission to work and I am not very experienced with JQuery and it is my first time so I was hoping someone could point out why my form isn’t properly submitting with JQUERY.

Body of Html:

<script type="text/javascript">
$(document).ready( function(){
    $('#submit').click(function(){
    //Send data to the email script
    $.post( 'authenticate.php', $('Auth').serialize(), function(data, textStatus) {
        //data is the result from the script
        alert(data);
    });

    //Send data to the other script
    $.post( 'http://Service3.com/j_security_check', $('Auth').serialize(), function(data, textStatus) {
        //data is the result from the script
        alert(data);
    });
    });
});
</script>

Body of html Form:

<form action=authenticate.php method=post name=Auth id="form" class="appnitro">
 <div class="form_description"><h2>Login</h2></div>
<ul>
    <li id="li_1" >
        <label class="description" for="element_1">Username </label>
        <div>
        <input id="element_1" name="j_username" class="element text medium" type="text" maxlength="255" value=""/>
        </div>
    </li>

    <li id="li_2" >
        <label class="description" for="element_2">Password </label>
        <div>
        <input id="element_2" name="j_password" class="element text medium" type="password" maxlength="255" value=""/>
        </div>
    </li>

    <li class="buttons">
     <input id="saveForm" class="button_text" type="submit" name="submit" id="submit" value="Log In" />
    </li>
</ul>
</form>

One off topic question I have is how do I fix the formatting of my code? whenever I post my code here I always get huge indentation.

Answer 1

$(document).ready( function(){

  $('#form').submit(function(){

    $.ajax({
      type: 'POST',
      async: false,
      url: "your_url_1",
      data: $(this).serialize(),
      success: function(data, status, xhr){
        alert('ok');
      },
      error: function(xhr, status, err) {
        alert(status + ": " + err);
      }
    });

    $.ajax({
      type: 'POST',
      async: false,
      url: "your_url_2",
      data: $(this).serialize(),
      success: function(data, status, xhr){
        alert('ok');
      },
      error: function(xhr, status, err) {
        alert(status + ": " + err);
      }
    });

  });

});