How to pass form values from jquery ajax to codeigniter controller?

Question

I am trying to create a contact form that send email. I am using jquery ajax. My question is how can I pass the form values from jquery ajax to codeigniter function? This is my html form:

<form id="ph-form">
    <input type="text" name="name" placeholder="Name*" id="name" />
    <input type="email" name="email" placeholder="Email*" id="email"  />
    <input type="text" name="subject" placeholder="Subject*" id="subject"  />
    <textarea  name="message" placeholder="Messaage*" id="message" ></textarea>
    <input type="submit" name="send_message" value="Send Message" id="submit_btn">
</form>

This is my jquery ajax script:

<script type="text/javascript">
    $('#submit_btn').click(function(){
        var form_data = {
            name : $('#name').val(),
            email : $('#email').val(),
            subject : $('#subject').val(),
            message : $('#message').val(),
            ajax : '1'
        };
        $.ajax({
            type : 'POST',
            url : '<?= $this->config->site_url().$this->uri->uri_string() ?>',
            async : false,
            data : form_data,
            success : function(data){
                alert("wew success!");
            }
        });
        return false;
    });
</script>

And finally my controller:

public function test($view){
    switch($view){
        case 'contact1':
            $this->load->view('ph-contact1');
            break;
        case 'contact2':
            $this->load->view('ph-contact2');
            break;
        case 'contact3':
            $this->load->view('ph-contact3');
            break;
                default:
                    $this->load->view('ph-contact1');
                    break;
    }

    if($this->input->post('ajax') == '1'){
        echo "<script>alert(".$this->input->post('name').")</script>";
    }
}

I am not sure if the ajax is working and I don't have form validation.

Answer 1

First change input "submit" to "button" to prevent page refresh.

<input type="button" name="send_message" value="Send Message" id="submit_btn">

then url will be

url : "<?= site_url().'your_controller_name/test'; ?>",

this will be post data on your controller function test, then you get post data by $this->input->post('ajax') . for debugging you can use console by inspect element of browser

Answer 2

Your code looks ok to pass values to your controller by ajax

You can get your form values separately like

$this->input->post('name');
$this->input->post('email');
$this->input->post('subject');
$this->input->post('message');

Also please confirm once that your requested url is pointing to given controller or not from console of your browse.

Hope this will help you. Let me know if still you are facing any problem.