Welcome Guest, Not a member yet? Register   Sign In
validation_errors not showing up with ajax
#1

[eluser]joeizang[/eluser]
Hi,

I have a question, I am using ajax on a form and I seem to have a response from the server but when I get an answer from the server I seem to get back my entire page again and not the validation_errors() like normal in a view. Below is my code from within the controller, the view and my .js code. I would like to know what I am doing wrong? Will the output be necessary? :cheese:
Code:
function showsupport()
    {
        $this->form_validation->set_rules('supportername','Your Name','trim|required|max_length[20]|xss_clean');
        $this->form_validation->set_rules('supporteremail','Email Address','trim|required|valid_email|xss_clean');
        $this->form_validation->set_rules('pledgedate','Pledge Date','trim|required|xss_clean');
        $this->form_validation->set_rules('messagetxt','Your Message','trim|required|xss_clean');

        if($this->form_validation->run() == FALSE)
        {
            echo validation_errors();
        } else {

            $this->load->model('support_m');
            $name = $this->input->post('supportername');
            $email = $this->input->post('supporteremail');
            $date = $this->input->post('pledgedate');
            $msg = $this->input->post('messagetxt');
            
            $qry = $this->support_m->storepledge($name,$email,$date,$msg);

            if($qry){
             //$this->template->write_view('content','thanks');
             //$this->template->render();
             $datamsg['supportmsg'] = 'Message Added Successfully';
            }else{
                echo 'There was an error inserting into db';
            }
        }
    }

VIEW FORM
Code:
<?php
                                        $formdata = array('id'=>'suppform');
                                        echo form_open('homepage/showsupport',$formdata);

                                        $namedata = array('name'=>'supportname','id'=>'supportname','size'=>'30','max_length'=>'25','value'=>set_value('supportname'));
                                        echo '<label for="supportername">Your Name:'.form_input($namedata).'</label><br /><br />';
                                        $emaildata = array('name'=>'supporteremail','id'=>'supporteremail','size'=>'30','max_lenth'=>'25','value'=>set_value('suppoteremail'));
                                        echo '<label for="supporteremail">Email Address:'.form_input($emaildata).'</label><br /><br />';
                                        $pledgedata = array('name'=>'pledgedate','id'=>'pledgedate','size'=>'30','max_length'=>'20','value'=>set_value('pledgedate'));
                                        echo '<label for="pledgedate">Today\'s Date:'.form_input($pledgedata).'</label><br /><br />';
                                        $msgdata = array('name'=>'messagetxt','id'=>'messagetxt','col'=>'2','rows'=>'8');
                                        echo '<label for="messagetext">Your Pledge:'.form_textarea($msgdata).'</label><br />';
                                        $submitdata = array('name'=>'submitbtn','id'=>'submitbtn','value'=>'Send');
                                        echo '<label for="submitbutton">'.form_submit($submitdata).'</label><br />';

                                        echo form_close();
                                    ?&gt;
                </div>
            <div id="errorsechoed">&lt;?php echo validation_errors();?&gt;</div>

JAVASCRIPT CODE
Code:
$('#suppform').submit(function(eve){
            eve.preventDefault();
        $.ajax({
        type: 'POST',
                cache: false,
        url: 'homepage/showsupport',
        data: $('#suppform').serialize(),
        beforeSend: function(){
                    $('#supportform').block({message:'<h4> Processing...</h4>'})
        },
        complete: function(){
            
        },
        success: function(html){
                    $('#errorsechoed').text(html);
        }

                });
    });
#2

[eluser]danmontgomery[/eluser]
The page is reloading (submitting normally)? Or the entire page is being loaded by the javascript into $('#errorsechoed')?
#3

[eluser]joeizang[/eluser]
Thanks for the response,

the whole page is being returned into the #echoederror div. On firefox, if I enable the net part of firebug, I see the html of the side return in the div visible. thought you should know. oh and without ajax, the page submits fine and I see the validation errors.
#4

[eluser]joeizang[/eluser]
I thought I should mention it that I am using the Template Library found at
http://williamsconcepts.com/ci/codeignit...index.html. The error should be showing in my content area of the templating system. Please I really need help on this because the ajax response I get still comes with the whole page and doesn't even carry the errors from the validation_errors() function. I am confused with this. Any help folks?!
#5

[eluser]joeizang[/eluser]
hi y'all,

I have been trying to get this figured out and I think I have made some progress, here is what I have:

a) the template library from William Colin works where regions are specified and so only a particular region will be refreshed all the time and not the only page. As a result it sort of works differently from other standard setups for codeigniter. This is definitely getting in the way of jquery getting a response from the server. It gets the bits of template library (i.e. regions) and renders it out which ends up rebuilding the whole page again.

b) When you run the form_validation library, Template doesn't allow you to just load a view the normal way in codeigniter, rather you do this by running:

Code:
$this->template->write_view('contentregion','viewname'); //writes the view
$this->template->render(); //renders the view on screen.

so if this is not done if validation fails, the error messages spat out by the formvalidation library just never seem to get to the view.

I have tried a lot of permutations of using functions that come with this library and still am just able to render out another page of my site. :-S

CONCLUSION:

I think this template library is great but it needs some updating so these issues are met. I will have to look at other templating systems when I have to do a site with a lot of ajax required. Hope Mr. William can see this and help look into this.

Thanks community for an avenue to say what I have learned. Hope this is useful to someone.
#6

[eluser]pickupman[/eluser]
I am using the same template library, and the way I use it by defining a ajax request variable.
Code:
//Global define for AJAX Requests
define('IS_AJAX', isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');

Now in my controller, when I finished parsing the results I use
Code:
if(IS_AJAX){
   //Page was loaded by ajax request
   $data['response'] = 'true';
   $data['message']  = $this->template->write_view('content','tpl.login_ajax.php',$data);
   echo json_encode($data); //Or have a ajax view to echo the json string
}else{
  $this->template->write_view('content','tpl.login.php', $data);
  $this->template->render(); //Echo out whole template
}

I use jQuery, and post login using .ajax(); I read the json response from the server to update the dom accordingly.
#7

[eluser]joeizang[/eluser]
Thanks man for picking interest in this. I would like to make sure I understand what you are doing here:

a) Your datatype in your js file would then be json i believe.
b) You have a separate ajax optimized page if the request is an ajax req. hence the tpl.login_ajax.php, hope i'm right.
c) so then you use json encode to help with the transfer of the errors to the "ajax aware" page in the form of variables?

I was actually trying to show the errors that result from validation_errors() and got this problem (sorry for repeating myself) so at this rate would be criminal if I did this?

Code:
$errors['mainerror'] = validation_errors();
$errors['shownerror'] = $this->template->write_view('content','tpl.login_ajax',$errors);
echo json_encode($errors);

if possible I would like to know what structure the ajax aware pages carry or even a sample if it's different.

Thanks in advance.

Joe
#8

[eluser]pickupman[/eluser]
Quote:a) Your datatype in your js file would then be json i believe.
b) You have a separate ajax optimized page if the request is an ajax req. hence the tpl.login_ajax.php, hope i’m right.
c) so then you use json encode to help with the transfer of the errors to the “ajax aware” page in the form of variables?
a). Yep, anytime I am doing ajax and expect a response, I always use json as it allows you to return an array of values/strings.
b). Yes, even it to display the validation errors. Just pass that to the view. You need recreate whatever data you want to updated in the DOM.
c). You are on track. Pass whatever you need to get the ajax response. Maybe, you want just the error html, maybe you want to update the div with the whole login form. With, this template library you can these blocks and update just them for ajax requests, or render the whole template for non-ajax requests. That's what I liked about this template library.

The code you posted looks fine. Just render what ever it is that you need. Maybe you will have a validation error view that can be used globally.
#9

[eluser]joeizang[/eluser]
Much obliged man. I will give it a shot. Thanks for talking to me




Theme © iAndrew 2016 - Forum software by © MyBB