Answer the question
In order to leave comments, you need to log in
Ajax adding cell to table from received json?
Please tell me how to add a row to the table without reloading the page:
<table id="doc_step_table" class="table table-hover table-condensed table-bordered">
<thead>
<tr>
<th width="16%" class="active">Document</th>
<th width="11%" class="active">Number</th>
<th width="11%" class="active">issued</th>
<th width="12%" class="active">Expiry</th>
<th width="12%" class="active">Country</th>
<th width="17%" class="active">Upload(Front side)</th>
<th width="17%" class="active">Upload(Revers side)</th>
<th width="2%" class="active"></th>
</tr>
</thead>
<tbody>
<tr class="information_json_add">
<td class="disabled"></td
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><span class="btn btn-success plus pull-right" data-toggle="modal" data-target="#AE_DOCS">+</span></td>
</tr>
</tbody>
</table>
$('#doc_modal_form').on('submit', function (e) {
e.preventDefault();
var $that = $(this),
formData = new FormData($that.get(0));
formData.append('step_form', 'DOCS');
$.ajax({
url: $that.attr('action'),
type: $that.attr('method'),
contentType: false,
processData: false,
data: formData,
dataType: 'json',
success: function (data) {
if (data['added'] == true){
var field = data;
console.log("TableID: " + field['TableID'] + " Document: "+ field['Document'] + " Number: "+ field['Number'] +" Issued: " + field['Issued'] +
" Expiry: " + field['Expiry'] + " CountryD: " + field['CountryD'] + " Scan: " + field['Scan'] + " ScanR: " + field['ScanR']);
$('table #doc_step_table .information_json_add').after(
'<tr>' +
'<td class="disabled">field[\'TableID\'] </td>' +
'<td>field[\'Document\'] </td>' +
'<td>field[\'Issued\'] </td>' +
'<td>field[\'Expiry\'] </td>' +
'<td>field[\'CountryD\'] </td>' +
'<td>field[\'Document\'] </td>' +
'<td>field[\'Scan\']</td>' +
'<td>field[\'ScanR\']</td>' +
'<td><span class="btn btn-danger edit pull-right">–</span></td>' +
'</tr>'
);
$('#AE_DOCS').modal('hide');
} else {
$('#doc_modal_form #msg').fadeIn(100).delay(5000).html(data['error']);
$('#doc_modal_form #msg').fadeOut(100).html(data['error']);
}
}
});
Answer the question
In order to leave comments, you need to log in
Decision:
...
$("#doc_step_table tr:last").before('<tr>' +
'<td>' + data['Document'] + '</td>' +
'<td>' + data['Number'] + '</td>' +
'<td>' + data['Issued'] + '</td>' +
'<td>' + data['Expiry'] + '</td>' +
'<td>' + data['CountryD'] + '</td>' +
'<td>' + data['Scan'] + '</td>' +
'<td>' + data['ScanR'] + '</td>' +
'<td><span data-row="'+data['TableID']+'" class="btn btn-danger edit pull-right">e</span></td>' +
'</tr>');
...
It's not clear what exactly doesn't work for you. success not working? Not returning data?
I would generally use pjax for this ( https://habrahabr.ru/post/123972/)
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question