我是
AJAX的新手,我正在尝试阅读整个页面并更改其中的元素而不刷新.
我有一个看起来像这样的页面:
我正在使用PHP& JQuery的.每当我点击任何tr时,它都会获取id并将db中分配的数据放到表单上的id中.所以我可以更新用户的数据.
显然,当表单为空时,它是数据库中的标准插入.
当您单击每个tr(Eliminar)的最后一个td时,它会从数据库中删除该用户.
我的文件:
>构建页面的控制器(crud.php).
>包含每个与数据库相关的方法的数据库(database.php)
> CSS文件和带有基本html,js的模板.
我想用Ajax创建所有这些刷新页面,但我得到类似的东西:
我的所有页面都已插入到表单中,而不是使用新页面替换我的页面,或者只更换新表单.
任何可以帮助我学习的提示/指南?我在这个网站上搜索了所有相关的AJAX内容.还有JQuery网站……
我真的不知道AJAX如何工作以及如何将它与JS和PHP联系起来
相关代码:
//Capturador de eventos
$(document).ready(function(){
//Clickar en cualquier lado del tr (menos el ultimo td) para actualizar ese registro
$("#tablaDatos tr td:not(:last-child").click(function() {
if (confirm("¿Seguro que desea modificar el registro?")){
$("#idSelected").val($(this).closest('tr').attr('id'));
var data = $('#idSelected').serialize();
$.post(
'crud.php',
{data: data},
function(response){
$('#result').html(response);
}
);
return false;
}else
return false;
});
//Clickar en el borrar del listado para eliminar ese registro
$("#tablaDatos input").click(function(){
if (confirm("¿Seguro que deseas borrarlo del registro?")){
$("#idSelected").val($(this).closest('tr').attr('id'));
$("#eliminar").val("Eliminar");
var data = $('#idSelected').serialize();
$.post(
'crud.php',
{data: data},
function(response){
$('#result').html(response);
}
);
return false;
}else
return false;
});
// Clickar en Alta/Modificar para enviar los datos al crud a través de post
$('#submit').click(function() {
var data = $('#envioDatos').serialize();
$.post(
'crud.php',
{data: data},
function(response){
$('#envioDatos').html(response);
$("#envioDatos input, textarea").val('');
});
return false;
});
});
// INCLUDES
include 'lib/pintarHTML.php';
include 'lib/database.php';
// VARS
$tableName = 'ALEJANDRO';
$clientes = array ();
$page = null;
$body = null;
$elemSel = null;
$obj_pintar = new pintarHTML ();
$ID = null;
$result = null;
$type = null;
// CONECTION DB
$obj = new database ();
// POST READ
if (isset ( $_POST )) {
mpr($_POST);
if ($_POST['alta'] == "Alta" && empty ( $_POST['id'] )) {
// Llamo a insertar
$result = $obj->insert ( $_POST );
} else
if ($_POST['modificacion'] == "Modificacion" && ! empty ( $_POST['id'] )) {
// Llamo a modificar
$result = $obj->update ( $_POST );
} else
if ($_POST['eliminar'] == "Eliminar" && ! empty ( $_POST['idSelected'] )) {
// Llamo a eliminar
$result = $obj->delete ( $_POST );
} else
if ($_POST['idSelected'] && empty ( $_POST ['eliminar'] )) {
// Elemento Seleccionado
$ID = $_POST['idSelected'];
}
}
// Client list
$clientes = $obj->select ( $tableName );
// Title
$body .= $obj_pintar->pintarTitulo ( 'LISTADO DE CLIENTES' );
// Check ID
if (isset ( $ID )) {
// Formulario relleno con los datos del usuario para modificarlos
$elemSel = $obj->select ( $tableName, '*', 'id=' . $ID, null );
$body .= $obj_pintar->pintarFormulario ( $elemSel );
} else {
// Formulario vacío para alta de usuario
$body .= $obj_pintar->pintarFormulario ( $elemSel );
}
// Page echo
if (!empty($result)) {
$body .= $obj_pintar->pintarMessage($result);
}
$body .= $obj_pintar->pintarTable ( $clientes );
$page = $obj_pintar->composeHTML ( $body );
echo $page;
// Debug
function mpr($value, $text = null) {
echo "
" . $text;
print_r ( $value );
echo "
";}
?>