jQuery modal, and forms

[eluser]the_unforgiven[/eluser]
Hi All,

I have a small issue, i have a link which pulls up a modal box for people to login but i need to know how to show the validation_errors() function with that modal and also how to submit the form without it going to a function within my controller.

Can anyone advise please.

Heres my code:

Code:

Link: <li><a href="#login" role="button" data-toggle="modal">Login</a></li> which opens the jquery modal with this inside:

&lt;!-- Login Modal --&gt;

  <div id="login" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
   <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
   <h3 id="myModalLabel">Login</h3>
  </div>
  <div class="modal-body">
   &lt;form action="welcome/login" method="post"&gt;
   <table>
    <tr><td>Username:</td><td>&lt;input type="text" name="username"&gt;&lt;/td></tr>
    <tr><td>Password:</td><td>&lt;input type="password" name="password"&gt;&lt;/td></tr>
   </table>
  </div>
  <div class="modal-footer">
  <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
  <button class="btn btn-success">Login</button>
  </div>
  </div>

Code:

Controller
Then iside my controller i have this, but need to show any errors within the modal box and also how to login them in without going to the page set below:

public function login()
{
  $this->form_validation->set_rules('name','Your Name','required');

  $this->form_validation->set_rules('password','Password','required');
  
  if ($this->form_validation->run() == FALSE)
  {
   $data['title'] = 'Login';
   $this->load->view('login',$data);
  }
  else
  {
  
  }
}

Thanks in advance..

[eluser]skunkbad[/eluser]
You're going to have to submit the form via ajax, so you're going to have to send a request to a controller or a php script of some kind. It is there in that controller/method or script that you will do your form validation and determine the success of the login attempt. You will send back your ajax response from the server to the client including all of those details. What you do with the response is up to you. This is pretty simple stuff. Once you do it you will be amazed at how easy it is.

[eluser]the_unforgiven[/eluser]
Gracias, appreciate the in depth answer thank you!

[eluser]the_unforgiven[/eluser]
OK, i have done this ajax request,

Code:

$(function() {

  var baseUrl = '<?php echo base_url(); ?>';

  // Use validate function to validate fields
  $("#register").validate({
   debug: false,
   rules: {
    name: "required",
    username: "required",
    password: "required",
    conf_password: "required"
   },
   // Set validation messages
   messages: {
    name: "Fill out your name",
    username: "We need a username, please enter one.",
    password: "Please make sure you enter a password",
    conf_password: "Enter your password again please"
   },
   // Submit function to submit to PHP
   submitHandler: function(form) {
    // do other stuff for a valid form
    $.post(baseUrl + "register", $("#register").serialize(), function(data) {
     $('#results').html(data);
    });
   }
  });



});

based on what ive read on my book - but it shows no errors if empty and it needs to show then within the modal window, also do i just set a

Code:

if($this->form_validation->run() == TRUE) { submit to db }

in my controller? Seen has the javascript will be making the errors appear and not submit until those have gone?

If someone can help I'd be greatly apprecative with many thanks.

[eluser]the_unforgiven[/eluser]
Heres my modal code for the login form
http://d.pr/i/PpBc


Here's the controller: http://d.pr/i/bV1u



The ajax magic: http://d.pr/i/lAb1


But still i cant get it to show errors with the box modal popbox and also want it login like it would do within a normal page anyone have any idea's?

I pasted to droplr for ease of use!

[eluser]the_unforgiven[/eluser]
Anyone willing to advise? please