Question

After tons of coding, I feel like I am finally wrapping my head around AJAX, JSON, and CI to a degree.

However, I feel I have hit one final snag. Below is my code:

HTML

<div id="structures">
    <h1>Build</h1>
    <form name="buildForm" id="buildForm" method="POST" action="<?php echo base_url(); ?>/ajax/index/">
        <select name="buildID" class="buildClass">
        <option value="0" selected="selected" data-skip="1">Build a Structure</option>
<?php foreach ($structures as $structure_info): ?>
    <option name='<?php echo $structure_info['str_name'] ?>' value='<?php echo $structure_info['str_id'] ?>' data-icon='<?php echo $structure_info['str_imageloc'] ?>' data-html-text='<?php echo $structure_info['str_name'] ?><i>
        <?php echo $structure_info['timebuildmins'] ?> minutes<br><?php echo $structure_info['buy_gold'] ?> gold</i>'><?php echo $structure_info['str_name'] ?></option>
<?php endforeach ?>
        </select>
        <div id="buildSubmit">
            <input id ="btnSubmit" class="button" type="submit" value="Submit"/>
        </div>
    </form>
</div>

Here I am simply building my form.

AJAX/JS

$(function(){
    $("#buildForm").click(function(e, buildID){
        e.preventDefault();
        var frm = $(document.buildForm);
        var dat = JSON.stringify(frm.serializeArray());
        alert("I am about to POST this:\n\n" + dat);
        $.post(
            frm.attr("action"),
            dat,        
        function(response) 
        {  
            alert(response);
        }  
    );
});
});

Model Function

public function insert_build()
   {    
      $str_id = $this->input->post(dat);
      print_r($str_id);
   }

I created a new controller class extension “Ajax” and function “index” This simply calls my model “insert_build.” It was my workaround to take the .js file off the page and keep it in the header.

Anyway. When I hit the submit button, it successfully alerts the JSON output. Though after it is passed to the controller->model, it doesn’t seem to catch anywhere. I assume I’m doing it wrong, but can not figure out what.

Thanks for the help.

Answer 1

Try a couple things here.

After var frm = $(document.buildForm); try alerting it’s action value

alert(frm.attr("action"));

to make sure your $.post is actually getting a valid URL.

Then try changing your insert_build function to just print out what it’s receiving. You shouldn’t be calling $this->input->post(dat); because you won’t have a post named dat.

public function insert_build()
{
    print_r($_POST);
}

EDIT

You’ll need to pass the json string as a url param. Try

$.post(frm.attr("action"), {data:dat}, function(response) 
    {  
        alert(response);
    });

And then changing your PHP to

public function insert_build()
{    
    $str_id = $this->input->post('data');
    print_r(json_decode($str_id));
}