$(document).ready(function() {
var operation;
function RefreshDBGrid() {
var table_id = $('#table_id');
$.ajax({
type: "POST",
url: "view_record.php",
data: "",
success: function(data) {
console.log('success view data of table ');
table_id.html(data);
},
error: function(data) {
console.log('Error: '+ data);
}
});
}
$(document).on('click', '.checkbox', function() {
var _this = $(this);
var checkbool = false;
var paneledit = $("#paneledit");
var famtext = $('#famtext'+_this.attr('id'));
var famedittext = $('#famedittext'+_this.attr('id'));
var fnametext = $('#fnametext'+ _this.attr('id'));
var fnameedittext = $('#fnameedittext'+ _this.attr('id'));
var snametext = $('#snametext' + _this.attr('id'));
var snameedittext = $('#snameedittext' + _this.attr('id'));
if (_this.is(':checked')) {
if (!famtext.hasClass('disabled'))
famtext.addClass('disabled');
if (famedittext.hasClass('disabled'))
famedittext.removeClass('disabled');
if (!fnametext.hasClass('disabled'))
fnametext.addClass('disabled');
if (fnameedittext.hasClass('disabled'))
fnameedittext.removeClass('disabled');
if (!snametext.hasClass('disabled'))
snametext.addClass('disabled');
if (snameedittext.hasClass('disabled'))
snameedittext.removeClass('disabled');
} else {
if (famtext.hasClass('disabled'))
famtext.removeClass('disabled');
if (!famedittext.hasClass('disabled'))
famedittext.addClass('disabled');
if (fnametext.hasClass('disabled'))
fnametext.removeClass('disabled');
if (!fnameedittext.hasClass('disabled'))
fnameedittext.addClass('disabled');
if (snametext.hasClass('disabled'))
snametext.removeClass('disabled');
if (!snameedittext.hasClass('disabled'))
snameedittext.addClass('disabled');
}
$('.checkbox').each(function() {
var t = $(this);
if (t.is(':checked')) {
checkbool = true;
}
});
if (!checkbool)
if (!paneledit.hasClass('disabled'))
paneledit.addClass('disabled');
}
);
$(document).on('click', '#canceledit', function() {
var paneledit = $('#paneledit');
if (!paneledit.hasClass('disabled'))
paneledit.addClass('disabled');
}
);
$(document).on('click', '#edit', function() {
var checks = $('.checkbox');
var check_elems = [];
var checkbool = false;
var paneledit = $('#paneledit');
var paneladd = $('#paneladd');
console.log('Edit data...');
operation = 'edit';
$(checks).each(function() {
var _this = $(this);
if (_this.is(':checked')) {
checkbool = true;
}
});
if (checkbool) {
if (!paneladd.hasClass('disabled'))
paneladd.addClass('disabled');
if (paneledit.hasClass('disabled'))
paneledit.removeClass('disabled');
else
paneledit.addClass('disabled');
}
}
);
$(document).on('click', '#del', function() {
var checks = $('.checkbox');
var check_elems = [];
console.log('Delete data...');
$(checks).each(function() {
var _this = $(this);
if (_this.is(':checked'))
check_elems.push(_this.attr('id'));
});
$.ajax({
type: "POST",
url: "del_record.php",
data: "data="+JSON.stringify(check_elems)+"",
success: function(data) {
console.log('success delete data in table: '+data);
RefreshDBGrid();
},
error: function(data) {
console.log('Error: '+ data);
}
});
});
$("#add").click(
function(e) {
var paneladd = $("#paneladd");
var paneledit = $("#paneledit");
operation = "add";
if (!paneledit.hasClass('disabled'))
paneledit.addClass('disabled');
if (paneladd.hasClass('disabled'))
paneladd.removeClass('disabled');
else
paneladd.addClass('disabled');
});
$("#cancel").click(
function() {
var paneladd = $("#paneladd");
if (!paneladd.hasClass('disabled'))
paneladd.addClass('disabled');
}
);
$("#saveedit").click(
function(e) {
var data_mas = [];
$('.checkbox').each(function() {
var _this = $(this);
if (_this.is(':checked')) {
var famedittext = $('#famedit'+_this.attr('id'));
var fnameedittext = $('#fnameedit'+ _this.attr('id'));
var snameedittext = $('#snameedit' + _this.attr('id'));
data_mas.push([famedittext.val(), fnameedittext.val(), snameedittext.val(), _this.attr('id')]);
//console.log(famedittext.attr('id')+":"+famval);
}
});
//console.log(data_mas);
$.get("edit_record.php",
{mas: JSON.stringify(data_mas)}
).done(
function(data) {
console.log( "Record success editing: " + data);
RefreshDBGrid();
});
}
);
$("#save").click(
function() {
var fam_input = $("#fam_input");
var name_input = $("#name_input");
var sname_input = $("#sname_input");
var val_fam = fam_input.val();
var val_name = name_input.val();
var val_sname = sname_input.val();
var error = false;
if (val_fam == '') {
if (!fam_input.hasClass('error'))
fam_input.addClass('error');
error = true;
} else {
if (fam_input.hasClass('error'))
fam_input.removeClass('error');
}
if (val_name == '') {
if (!name_input.hasClass('error'))
name_input.addClass('error');
error = true;
} else {
if (name_input.hasClass('error'))
name_input.removeClass('error');
}
if (val_sname == '') {
if (!sname_input.hasClass('error'))
sname_input.addClass('error');
error = true;
} else {
if (sname_input.hasClass('error'))
sname_input.removeClass('error');
}
if (!error) {
$.ajax({
type: "POST",
url: "add_record.php",
data: "fam_input="+val_fam+"&name_input="+val_name+"&sname_input="+val_sname+"",
success: function(data) {
console.log('success insert data in table: '+data);
RefreshDBGrid();
},
error: function(data) {
console.log('Error: '+ data);
}
});
$("#cancel").click();
fam_input.val("");
name_input.val("");
sname_input.val("");
}
}
);
});
В итоге получаем готовую страницу с механизмами ajax, способная работать и выполнять весь функционал работы.
Если вы считаете текст данного блога оскорбительным или некорректным, напишите об этом по адресу IntegralAL@mail.ru
с URL-адресом блога. В теме письма пишите <Жалоба>, либо <Неккоректно>.