too long

Question

I Want to receive the values from the CKEditor. I Have written this HTML code

<div class="col-md-12">
    <div class="form-group">
        <label for="Image" class="control-label">Item Description </label>
        <textarea id="item_description" name="item_description" rows="10" cols="80" style="resize:none"></textarea>
    </div>
    <!-- /.form-group -->
</div>
<div class="col-md-2">
    <input type="submit" name="submit" id="Add" value="Add Items" class="btn btn-success">
</div>

This is the JQuery Code to get the value of the CKEditor

$("#Add").on("click", function(e) {
    e.preventDefault();
    var item_description = CKEDITOR.instances["item_description"].getData();
    var formData = new FormData($("#form1")[0]); //It automatically collects all fields from form
    $.ajax({
        url: "'.base_url().'Home/add_items",
        type: "post",
        data: formData,
        success: function(output) {
            alert('Added'):

        }
    });
});

And this the Home controller but when I here access the item_description value is empty.

<?php
class Home extends MY_Controller
{
    public function add_items()
    {
        echo $title = $this->input->post('item_description');
        //$this->show('admin/add_items.php');
    }
}
?>

Answer 1

Modify your javascript codes, like this :

$("#Add").on("click", function(e) {
    e.preventDefault();
    var formData = new FormData($("#form1")[0]); //It automatically collects all fields from form
    formData.append('item_description', CKEDITOR.instances['item_description'].getData());
    $.ajax({
        url: "<?=base_url()?>Home/add_items",
        type: "post",
        data: formData,
        success: function(output) {
            alert(output);

        }
    });
});