Getting form validation errors through ajax

[eluser]Wonder Woman[/eluser]
I'm having a bit trouble getting my ajax response to display my error messages, it just alerts "Object object" to display:

view:

Code:

$.ajax({
   url: $(this).attr('action'),
   type: 'POST',
   data: $(this).serialize(),
   dataType: 'json',
   success: function(respond) {
      if(respond.result == 'false') {
         $('#error_messages').html(respond);
         alert(respond);
      } else {
         alert('success');
      }
   }
});

controller:

Code:

if($this->input->is_ajax_request()) {
   $respond = array();
   if($this->form_validation->run() == false) {
      $respond['result'] = 'false';
      $respond['errors'] = validation_errors();
   } else {
      $respond['result'] = 'true';
      $respond['errors'] = null;
   }
   return $this->output->set_output(json_encode($respond));
}

Any help would be greatly appreciated! Thanks.

[eluser]Aidy[/eluser]
I think you've just missed referencing the parmeter in the JS

Code:

$.ajax({
   url: $(this).attr('action'),
   type: 'POST',
   data: $(this).serialize(),
   dataType: 'json',
   success: function(respond) {
      if(respond.result == 'false') {
         $('#error_messages').html(respond.errors);
         alert(respond.errors);
      } else {
         alert('success');
      }
   }
});

[eluser]Wonder Woman[/eluser]
I've added in the errors reference but nothing is returned, not even in my alert, it's blank I'm well and truly stuck!

[eluser]Aidy[/eluser]
That all looks ok to me, can you confirm that validation_errors() is returning something.

[eluser]Wonder Woman[/eluser]
Ah good point, it would appear to not be returning anything

[eluser]Wonder Woman[/eluser]
Fixed it - I wasn't actually posting the form data through ajax...duh!

[eluser]Wonder Woman[/eluser]
Actually, I have another question! How would I be able to load in another view on success? Is this possible?

[eluser]boltsabre[/eluser]
I don't think so, because it has to be compiled on the server before it can be sent to the browser. Besides, loading an entire new view kind of defeats the purpose of using ajax in the first place.

What you could do is include both views on your initial page load, and wrap them in wrappers as such:

Code:

<div id="wrapper1">
   &lt;?php $this->load->view('view1');?&gt;
</div>
<div id="wrapper2" s.tyle='display:none'>
   &lt;?php $this->load->view('view2');?&gt;
</div>

And on a successful return of your ajax function just use JS to change the display status of your wrapper divs.

[eluser]Aidy[/eluser]
You could load another view in via ajax just return something like

Code:

$respond['view'] = $this->load->view('your_view', $data, TRUE);

With the third option TRUE so it isn't output directly. The view most likely would just be a content area rather than a full page

[eluser]Wonder Woman[/eluser]
Hmm I see what you're saying but it comes back blank, I have done it so that the content in the div content will be replaced with the content on page two.

For example, in page two I have the text "this is page two" and in my controller I have:

Code:

$respond['next'] = $this->load->view('part_two', TRUE);

and in my view I have updated my ajax:

Code:

if(respond.result == 'false') {
   $('#error_messages').html(respond.errors);
} else {
   $('#content').html(respond.next);
}