title: jQuery dialog and ajax login on form submit
body: <p>here is the scenario working in CodeIgniter: ( I am sorry if the Question format is not the right one, this is my fist post here.)</p>
  
  <ol>
  <li>I have large form to be submited and it is submiting OK with ajax, after the validation.</li>
  <li>In my controller i am passing the username in the view if the user is logged in, and it is placed in a hidden input field in the form. If the user is not logged in the result is </li>
  </ol>
  
  <p><code>&lt;input type="hidden" id="loggedin" name="username" value="" /&gt;</code></p>
  
  <p>3.in my javascript i check if the form is valid() and if the username!=="" and then i am posting the form with ajax , else i am popping a dialog with the login page. The form submition is working fine when a user is logged in.</p>
  
  <p>The problem is that i cannot figure out how to post the form after the user is logged in in the login dialog.</p>
  
  <p>here comes the code :</p>
  
  <pre><code>    $('#MyForm').submit(function(event){
       event.preventDefault();
  
  
       var username=document.getElementById('loggedin').value;
       if($('#MyForm').valid() &amp;&amp; username!=="" ){
       var serializeddata=$("#MyForm").serialize();
  
  
  
        $.ajax({
      type: "POST",
      url: "formsubmition", // The urls are in CI format
      contentType: "application/x-www-form-urlencoded;charset=UTF-8",
  
      data: serializeddata,
      dataType: "html",
      success: function(data) {
          $('#message_ajax_anaz').html(data);
                      }
                  })
  
  
  
  
       }else if($('#MyForm').valid() &amp;&amp; username==""){
  
        $("#loginpop").load("login").dialog();
  
  
       } 
       });
  </code></pre>
  
  <p>the login page ajax code:</p>
  
  <pre><code>$('#login').submit(function(event){
       event.preventDefault();
  
       var dataser=$('#login').serialize();
        $.ajax({
      type: "POST",
      url: "login",
      contentType: "application/x-www-form-urlencoded;charset=UTF-8",
  
      data: dataser,
      dataType: "html",
      success: function(data) {
          $('#message_ajax').html(data);
                      }
                  })
  </code></pre>
  
  <p>And the above is working fine in the dialog, i can login normally.</p>
  
  <p>Now How can i return in the $('#MyForm').submit(function
  with the user now as logged in ,also without having to fill the form again?</p>
  
  <p><strong>Just figured out a way</strong>
  I hope it helps more people.</p>
  
  <p>I initialized dialog outside the submit function :</p>
  
  <pre><code>    $("#loginpop").load("login").dialog({
          autoOpen:false
      })
  </code></pre>
  
  <p>then in changed my else statement :</p>
  
  <pre><code>    else if($('#MyForm').valid() &amp;&amp; username==""){
  
    $("#loginpop").dialog('open');
  </code></pre>
  
  <p>And in my login ajax success function i added :</p>
  
  <pre><code>    $("#loggedin").val(data); // Changed the value of the hidden input with the username value on the fly. data contains the username
  
          $('#MyForm').submit();
          $('#loginpop').dialog('close');
  </code></pre>
  
  <p>Now everything is working and my form is submiting after the loggin :)</p>