Puedes hacerlo con AJAX de muchas formas, pero no te conviene guardar la tabla con los caracteres especiales todo en la base de datos.
Con respecto a los caracteres especiales te conviene armar una funcion que te reemplace los caracteres especiales de los acentos y demas por los que corresponden en formato html, pero en el momento entre el submit del formulario y la consulta SQL.
Para cargar en tu pagina la tabla te conviene hacerte un script PHP que haga exclusivamente el procesamiento de la tabla, segun parametros, y consultarlo con AJAX desde la pagina que quieras incluirlo.
Puedes incluir la tabla directamente en la primera consulta del cliente y hacer que se refresque con AJAX, o hacer la consulta con AJAX al momento de levantar la pagina con <body onload="funcionJavascript()">
ej:
Código HTML:
<html>
<head>
<title>Pagina Muestra Tabla</title>
<script languaje="javascript" type="text/javascript" src="ajax_base.js">
</script>
<script languaje="javascript" type="text/javascript" src="tabla_ajax.js">
</script>
</head>
<body onLoad="refrescarTabla()">
<h1>Super Tabla AJAX</h1>
<div id="tabla">
</div>
<input type="button" value="Refrescar Tabla" onClick="refrescarTabla()"/>
</body>
</html>
Para armar el obj. AJAX (seguro ya lo tenes pero...)
Código HTML:
/** ajax_base.js **/
function createAjax()
{
var obj = false;
if(window.XMLHttpRequest)
{
try
{
//Mozilla - Firefox, etc
obj = new XMLHttpRequest();
}
catch (e)
{
request = false;
}
}
else if (window.ActiveXObject)
{
try
{
obj = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
obj = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
obj = false;
}
}
}
if (obj)
{
return obj;
}
else
{
return null;
}
}
Para refrescar la tabla:
Código HTML:
/** tabla_ajax.js **/
var request = createAjax();
function refrescarTabla()
{
var method = 'post';
var url = 'localajax.php?accion=dameLaTabla&cantidad=10'
request.open(method,url);
request.onreadystatechange = llenarTabla;
request.send(null);
}
function llenarTabla()
{
var div = document.getElementById('tabla');
if (request.readyState == 4)
{
div.innerHTML = request.responseText;
}
}
En la url del request.open aparece localajax.php que es el que se tiene que encargar de armar tu tabla.
Código PHP:
<?
if ((isset($_REQUEST['accion']))&&($_REQUEST['accion'] == "dameLaTabla"))
{
$cantidad = 5; //cantidad de registros de la tabla como maximo;
if ($isset($_REQUEST['cantidad'])
{
$cantidad = $_REQUEST['cantidad'];
}
$query = "SELECT * FROM tabla WHERE lo que quieras LIMIT ".$cantidad;
//todo tu codigo de consulta a base de datos
//se empieza a armar la tabla:
?>
<table>
<?
$par ="even";
while ($fila = mysql_fetch_array($result))
{
?>
<tr>
<td><?=$fila['superprimercampo']; ?></td><td><?= $fila['otrocampo']; ?> </td>
</tr>
<?
}
?>
</table>
<?
}
?>
Supuestamente entonces este php responde a tu peticion a traves del objeto AJAX llamado "request", y cuando request.onreadystatechange la funcion llenarTabla se encarga del resto.