Ajax Contact Form submit bug

[eluser]guynamedkeith[/eluser]
Hello, I am in major need of some help. I am not very good with javascript and completely stuck on the below issue.

Goal: A codeigniter contact form sent through ajax that is validated using codeigniters validation and returns the proper view on failure or success, replacing DIV#contact-form with the new view.

Problem: My form submits fine through ajax, validates with codeigniter, and replaces DIV#content with the new form that has validation errors. If you now click submit again on the form currently filled with errors the form submits through http and does a full page refresh.

Notes: I am using codeigniter 1.7.2 and mootools 1.2 with mootools more.

Live example: http://keithloy.me/index.php/contact/index

Source: My dropbox

All relevant code is posted below:

mootools form send

Code:

 
window.addEvent('domready', function() {
    // You can skip the following two lines of code. We need them to make sure demos
    // are runnable on MooTools demos web page.
   
    // if (!window.demo_path) window.demo_path = '';
    // var demo_path = window.demo_path;
    // --
 
    var myForm = $('myForm');
   
    myForm.addEvent('submit', function(e) {
        //Prevents the default submit event from loading a new page.
        e.stop();
        //Empty the log and show the spinning indicator.
        var log = $('contact-form').addClass('ajax-loading');
        //Set the options of the form's Request handler.
        //("this" refers to the $('myForm') element).
        this.set('send', {onComplete: function(response) {
            log.removeClass('ajax-loading');
            log.empty();
            log.set('html', response);
        }});
        // send the form.
        this.send();
    });
});
 

[eluser]guynamedkeith[/eluser]
codeigniter controller

Code:

 
<?php
 
class Contact extends Controller {
 
    function Contact()
    {
        parent::Controller();
    }
   
    function index()
    {
        //run form validation
        $success = $this->form_validation->run();
        $form['test'] = 0;
       
        if(IS_AJAX)
        {
            $form['test'] = 1;
            if(!$success)
            {
                $this->form_validation->
                    set_error_delimiters('<em class="error">', '</em>');
                $this->load->view('contact/form', $form);
            }
            else
            {
                $form['name'] = $this->input->post('name');
                $form['email'] = $this->input->post('email');
                $form['subject'] = $this->input->post('subject');
                $form['message'] = $this->input->post('message');
                $this->load->view('contact/success', $form);
            }
        }
        else
        {
            if(!$success)
            {
                $this->form_validation->
                    set_error_delimiters('<em class="error">', '</em>');
                $data['form'] = $this->load->view('contact/form', $form, TRUE);
                $data['details'] = $this->load->view('contact/details', null, TRUE);
                $this->load->view('contact/layout', $data);
            }
            else
            {
                $form['name'] = $this->input->post('name');
                $form['email'] = $this->input->post('email');
                $form['subject'] = $this->input->post('subject');
                $form['message'] = $this->input->post('message');
                $this->load->view('contact/success', $form);
            }
        }
    }
   
    function ajaxSend()
    {      
        // validation is handled in config/form_validation.php
        if ($this->form_validation->run() == FALSE)
        {
            // change html for each error message
            $this->form_validation->
                set_error_delimiters('<em class="error">', '</em>');
            $this->load->view('contact/form');
        }
        else
        {
            $form['name'] = $this->input->post('name');
            $form['email'] = $this->input->post('email');
            $form['subject'] = $this->input->post('subject');
            $form['message'] = $this->input->post('message');
            $this->load->view('contact/success', $form);
        }
    }
}
 
/* End of file welcome.php */
/* Location: ./system/application/controllers/contact.php */
 

codeigniter view

Code:

 
<?php
$attributes = array('class' => 'email', 'id' => 'myForm', 'class' => 'klform');
echo form_open('contact/index', $attributes); ?>
 
    <fieldset>
        &lt;?php if($test == 1): ?&gt;
            <legend>Ajax Form</legend>
        &lt;?php else: ?&gt;
            <legend>Contact Form</legend>
        &lt;?php endif;?&gt;
        <ol>  
            <li>  
                <label for="name">Name &lt;?php echo form_error('name'); ?&gt;</label>  
                &lt;input type="text" name="name" class="textbox"
                       value="&lt;?php echo set_value('name'); ?&gt;" /&gt;  
            </li>
            <li>  
                <label for="email">Email Address &lt;?php echo form_error('email'); ?&gt;</label>  
                &lt;input type="text" name="email" class="textbox"
                       value="&lt;?php echo set_value('email'); ?&gt;" /&gt;  
            </li>
            <li>  
                <label for="subject">Subject &lt;?php echo form_error('subject'); ?&gt;</label>  
                &lt;input type="text" name="subject" class="textbox"
                       value="&lt;?php echo set_value('subject'); ?&gt;" /&gt;  
            </li>
            <li>  
                <label for="message">Message &lt;?php echo form_error('message'); ?&gt;</label>  
                &lt;textarea type="text" name="message" /&gt;&lt;?php echo set_value('message'); ?&gt;&lt;/textarea&gt;
            </li>
        </ol>
    </fieldset>
    <fieldset class="submit">  
        &lt;input class="submit" type="submit" value="Submit" /&gt;
    </fieldset>
 
&lt;/form&gt;
 

[eluser]guynamedkeith[/eluser]
I believe the issue is due to me replacing the entire form. Is there any other solution besides clearing the form instead of the div containing the form and placing content inside of the form?