Actualizar el contenido del sitio después de una llamada AJAX sin recargar la página
He creado esta función PHP que elimina un producto con un id pasado por una llamada AJAX:
function deleteSelectedProduct()
{
if ( isset($_POST['productToDelete']) && ! empty($_POST['productToDelete']) ) {
$postId=$_POST['productToDelete'];
wp_delete_post($postId);
}
die();
}
Mi llamada AJAX se ve así:
$.ajax({
data: sampleData,
type: 'POST',
url: AjaxObject.ss_ajax_url,
success: function(msg) {
window.location.reload(true);
}
});
Como pueden ver, realizo una recarga de página con window.location.reload(true);
para actualizar una lista de productos en una página (ya que un producto acaba de ser eliminado).
¿Hay alguna manera directa de actualizar el contenido de la página sin necesidad de recargarla?
Una de las soluciones que pensé sería modificar los scripts PHP para que utilicen buffer de salida:
function deleteSelectedProduct()
{
if ( isset($_POST['productToDelete']) && ! empty($_POST['productToDelete']) ) {
$postId=$_POST['productToDelete'];
wp_delete_post($postId);
}
ob_start();
include 'some_page.php';
$response = ob_clean();
echo $response;
die();
}
No estoy seguro si este es el camino a seguir. Agradecería su consejo.
Necesitarías usar el ID del producto como nombre de clase en tu HTML y luego podrías hacer:
$.ajax({
data: sampleData,
type: 'POST',
url: AjaxObject.ss_ajax_url,
success: function(msg) {
$( '.product-' + sampleData.productToDelete ).remove();
}
});
Si tienes contadores en la página, también necesitarías resolver eso. Además, si tienes paginación que no está generada mediante algún framework de JavaScript, tu mejor opción sería seguir recargando la página según sea necesario.
