Codeigniter insert data using ajax - ajax

Question

I'm using Ajax for CRUD. How can I use an associative array for inserting data with Ajax, so I don't have to reload the page and to append the inserted data below the existing data?
Here's The JS
function addTextBox(section, id_group) {
row_section = "#row_" + section;
wrapper = $(row_section);
// $(wrapper).append('<div class="movement_group"><input type="text" class="title_group" name="title_detail[' + section + ']" placeholder="Input" required="" style="width: 300px" /><button type="button" style="margin-left:10px;" class="btn btn-sm sending">Ok</button><button type="button" onClick="remove_field(\'' + section + '\')" style="margin-left:10px;" class="btn btn-sm remove_content">X</button></div>'); //add input box
// $(wrapper).append('<ul id="' + section + '" class="input_fields" style="list-style-type:none"><li><div class="movement_group"><input type="text" class="title_group" name="title_detail[\'' + section + '\']" placeholder="Input" required="" style="width: 300px" /><button type="button" style="margin-left:10px;" class="btn btn-sm sending">Ok</button><button type="button" onClick="remove_field(\'' + section + '\')" style="margin-left:10px;" class="btn btn-sm remove_content">X</button></div></li></ul>'); //add input box
$(wrapper).append('<ul id="fail_' + section + '" class="input_fields" style="list-style-type:none"><li><div class="movement_group"><input type="text" id="txt_' + section + '" id_group = "' + id_group + '"class="title_group" name="title_detail[\'' + section + '\']" placeholder="Input" required="" style="width: 300px" /><button type="button" style="margin-left:10px;" class="btn btn-sm sending" onClick="saveTitleGroup(\'' + section + '\', \'' + id_group + '\')">Ok</button><button type="button" onClick="remove_field(\'' + section + '\')" style="margin-left:10px;" class="btn btn-sm remove_content">X</button></div></li></ul>'); //add input box }
function remove_field(section) {
section_id = "#fail_" + section;
$(section_id).remove(); }
function saveTitleGroup(section, id_group) {
title_group = "#txt_" + section;
title_group = $(title_group).val();
td_section = "#td_" + section;
row_section = "#row_section" + section;
$.ajax({
type: "POST",
url: adminUrl+"/interest/save_detail",
data: {title: title_group, interest_group_id: id_group},
dataType: "text",
cache:false,
success:
function(data, textStatus, jqXHR){
console.log('test');
console.log(row_section);
/*$('.movement').fadeOut(800, function(){
$('.movement').fadeIn().delay(500);
// $('.movement').reload('http://127.0.0.1/camtravel-web/administrator/interest');
// return data;
window.location.reload();
});*/
// console.log(row_section);
// console.log(title_group);
// $('#tableinterest').html('');
$(td_section).html(data);
// $(row_section).html(''');
}
}); }
View
<table id="tableinterest" class="table table-bordered table-striped">
<thead>
<tr>
<th>No</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<?php
$n=0;
foreach ($interest_groups as $interest_group) {
$n++;
echo "<tr>";
echo "<td>";
// echo $interest_group['id'] . ". "
echo $n . ". ";
?>
</td>
<?php
echo "<td id='td_section_$interest_group[id]' group-id='$interest_group[id]'>";
// echo "<div id='title_group_'></div>";
echo "<b style='font-size:11pt !important;'>" . $interest_group['title'] . "</b>" . "<span style='margin-left:850px; font-size:15pt;' class='glyphicon glyphicon-plus interest_add' data-toggle='tooltip' data-placement='top' title='Add Detail' onclick='addTextBox(\"section_$interest_group[id]\", \"$interest_group[id]\")'></span><button type='button' style='float:right;' class='btn btn-xs text-red btn-delete-group' data-id='$interest_group[id]' data-category='$interest_group[title]'><span class='glyphicon glyphicon-minus'></span></button> ";
echo "<br>";
echo "</br>";
foreach ($interest_details as $interest_detail) {
echo "<ul style='list-style-type:none'>";
if ($interest_detail['interest_group_id'] == $interest_group['id']) {
echo "<li id='" . $interest_detail['id'] . "'>" . "<label style='font-size:10pt !important;' data-title=\"$interest_detail[title]\" id=\"$interest_detail[id]\" detail_id=\"$interest_group[id]\" class='editme1' id-title='\"$interest_group[id]\"'>" . $interest_detail['title'] . "</label>" .
"<button type='button' style='float:right;' class='btn btn-xs btn-delete-interest text-red' data-id='$interest_detail[id]' data-category='$interest_detail[title]'><span class='glyphicon glyphicon-minus'></span></button>" . "</li>";
}
echo "</ul>";
}
/*echo "<ul style='list-style-type:none'>";
echo "<li id='row_section_$interest_group[id]' class='input_fields'>" . "</li>";
echo "</ul>";*/
echo "<div id='row_section_$interest_group[id]'></div>";
echo "</td>";
// echo "<tr class='input_content'>";
// echo "</tr>";
echo "</tr>";
}
?>
</tbody>
</table>
Controller
function save_detail(){
// $id = $this->input->post('interest_group_id');
$title = $this->input->post('title');
$save = $this->save = $this->interest_group->save();
if ($save) {
echo $title;
// redirect('administrator/interest','refresh');
$this->layout = false;
} else {
echo "save failed";
// $this->layout = false;
}
// $title = $this->input->post('id-title');
// echo $title;
}
Model
function save(){
$id = $this->input->post('id');
// date_default_timezone_set('Asia/Jakarta');
$data = array(
"interest_group_id" => $this->input->post('interest_group_id'),
"title" => $this->input->post('title'),
"created_at" => date("Y-m-d H:i:s"),
"updated_at" => date("Y-m-d H:i:s"),
);
if ($id == null) {
$save = $this->db->insert('interest_detail',$data);
if ($save) {
return true;
$data = array();
$data['interest_group_id'] = 'interest_group_id';
$data['title'] = 'title';
// $data['title'] =
$data = array("data" => $data);
$data = json_encode($data);
$interest_group = $this->get_interest_group_by_id($this->input->post('interest_group_id'));
$interest_details = $this->get_interest_detail_by_id($this->input->post('interest_group_id'));
echo "<b>" . $interest_group['title'] . "</b>" . "<span style='margin-left:875px;' class='glyphicon glyphicon-plus interest_add' data-toggle='tooltip' data-placement='top' title='Add Detail' onclick='addTextBox(\"section_$interest_group[id]\", \"$interest_group[id]\")'></span><button type='button' style='float:right;' class='btn btn-xs text-red btn-delete-group' data-id='$interest_group[id]' data-category='$interest_group[title]'><span class='glyphicon glyphicon-minus'></span></button> ";
echo "<br>";
echo "<br>";
foreach ($interest_details as $interest_detail) {
echo "<ul style='list-style-type:none'>";
if ($interest_detail['interest_group_id'] == $interest_group['id']) {
echo "<li>" . "<label class='editme1'>" . $interest_detail['title'] . "</label>" .
"<button type='button' style='float:right;' class='btn btn-xs btn-delete-interest text-red' data-id='$interest_detail[id]' data-category='$interest_detail[title]'><span class='glyphicon glyphicon-minus'></span></button>" . "</li>";
}
echo "</ul>";
}
echo "<div id='row_section_$interest_group[id]'></div>";
print_r($interest_group);
print_r($interest_details);
} else {
return false;
}
} else {
$this->db->where('id', $id);
$update = $this->db->update('interest_detail', $data);
if ($update) {
return true;
} else {
return false;
}
}
}

Answer 1

Use single quotes when defining a string $string = '<div class"dre"></div>' and associative arrays need quotes names $array['name'] not $array[name] and last properly concatenate the strings and variables.
Try this:
<table id="tableinterest" class="table table-bordered table-striped">
<thead>
<tr>
<th>No</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<?php
$n=0;
foreach ($interest_groups as $interest_group) {
$n++;
echo "<tr>";
echo "<td>";
// echo $interest_group['id'] . ". "
echo $n . ". ";
?>
</td>
<?php
echo "<td id='td_section_".$interest_group['id']."' group-id='".$interest_group['id']."'>";
echo "<b style='font-size:11pt !important;'>" . $interest_group['title'] . "</b>" . '<span style="margin-left:850px; font-size:15pt;" class="glyphicon glyphicon-plus interest_add" data-toggle="tooltip" data-placement="top" title="Add Detail" onclick="addTextBox(section_'.$interest_group['id'].','.$interest_group['id'].')"></span><button type="button" style="float:right;" class="btn btn-xs text-red btn-delete-group" data-id='.$interest_group['id'].' data-category="'.$interest_group['title'].'"><span class="glyphicon glyphicon-minus"></span></button> ';
echo "<br>";
echo "</br>";
foreach ($interest_details as $interest_detail) {
echo "<ul style='list-style-type:none'>";
if ($interest_detail['interest_group_id'] == $interest_group['id']) {
echo "<li id='" . $interest_detail['id'] . "'>" . "<label style='font-size:10pt !important;' data-title=\"".$interest_detail['title']."\" id=\"".$interest_detail['id']."\" detail_id=\"".$interest_group['id']."\" class='editme1' id-title='\"".$interest_group['id']."\"'>" . $interest_detail['title'] . "</label>" .
"<button type='button' style='float:right;' class='btn btn-xs btn-delete-interest text-red' data-id='$interest_detail[id]' data-category='$interest_detail[title]'><span class='glyphicon glyphicon-minus'></span></button>" . "</li>";
}
echo "</ul>";
}
echo "<div id='row_section_".$interest_group['id']."'></div>";
echo "</td>"
echo "</tr>";
}
?>
</tbody>
</table>