Llenar combobox con base de datos y crear una lista html con valor seleccionado
XAJAX es una librería de código abierto PHP que permite crear de manera sencilla aplicaciones Web basadas en AJAX haciendo también uso de HTML, CSS, y Javascript.
Descargar e instalar xajax
Manos a la obra descargamos la liberia desde este enlace XAJAX lo guardamos en una carpeta de nuestro proyecto y lo configuramosd e la siguiente manera:
<?php
//incluímos la clase ajax
require ($_SERVER['DOCUMENT_ROOT']. '/xajax/xajax.inc.php');
// Creamos una instancia de un objeto de la clase xajax
$xajax = new xajax();
// Le indica la codificación que debe utilizar
// usar 'utf-8' o 'ISO-8859-1'
$xajax->setCharEncoding('ISO-8859-1');
//Decodifica los caracteres extraños
$xajax->decodeUTF8InputOn();
//Registramos la función para indicar que se utilizará con xajax.
// la funcion lo podemos cambiar
$xajax->registerFunction("procesar_estilos");
$xajax->processRequests();
?>
Creamos las Funciones para conectarse a la Base de datos Mysql
Conexión a base de datos MySQL con Extensión MySQLi desde PHP
Creamos la función para mostrar el resultado segun lo seleccionado en combobox:
Mostramos el resultado de nuestra consulta a nuestra base de datos segun lo seleccionado en nuestro combobox , en la function procesar_estilos recibimos el valor del combobox.
function procesar_estilos($form_entrada)
{
$mostrarsec = new xajaxResponse('ISO-8859-1');
$opsec = "<ul class='stylos'>";
$sqlsec = " SELECT * FROM _estiloseccionweb WHERE idcodmodulo='".$form_entrada['idcodmodulo']."' and cestadoestiloseccion='1' order by idcodestiloseccion";
$sqlmsec = db_query($sqlsec);
$na = 1;
while ($rows = db_fetch_array($sqlmsec))
{
if ($na==1) { $check = " checked";} else { $check = "";}
$opsec .= '<li><img src="/webadmin/estilos/images/'.$rows["cimgestiloseccion"].'"><div style="clear:both;"><input type="radio" name="selectestilo" value="'.$rows["idcodestiloseccion"].'" '.$check.'>'.$rows["cnombreestiloseccion"].'</div></li>';
$na++;
}
$opsec .= "</ul>";
$mostrarsec->addAssign("estilos","innerHTML","$opsec");
return $mostrarsec;
}
3) Indicamos al objeto xajax se encargue de generar el javascript necesario. El método recibe un parámetro, que es la ruta relativa para acceder al directorio donde están los archivos xajax descomprimidos.
// Lo hemos descargado en la carpeta xajax.
<?php $xajax->printJavascript("/xajax/");?>
Cargamos los valores del combobox con los datos de nuestra base de datos :
Podemos hacer llamadas a las funciones PHP en cualquier lugar del código, como respuesta a las acciones del usuario con javascript. desde el select se le envia su valor a la funcion procesar_chat .
<li><label>Modulo</label>
<select name="idcodmodulo" style="width:190px" onChange="xajax_procesar_estilos(xajax.getFormValues('form'))" class="box">
<?php $querysec = db_query("select * from _modulosweb where cestadomoduloweb='1'");
while($row_sec = db_fetch_array($querysec))
{ if( $row_sec['idcodmodulo']==$row['idcodmodulo'])
echo '<option value="' . $row_sec['idcodmodulo'].'" selected>' . $row_sec['cnombremoduloweb'] . '</option>';
else
echo '<option value="' . $row_sec['idcodmodulo'].'" >' . $row_sec['cnombremoduloweb'] . '</option>';
}
?>
</select>
</li>
Cargamos los Estilos del Modulo Seleccionado:
<div id="estilos">
<li><label id="jform_published-lbl" for="jform_published" class="hasTip" title="" aria-invalid="false">Estilo Sección</label>
<ul class='stylos'>
<?php
$sql_estilo = "SELECT * FROM _estiloseccionweb WHERE cestadoestiloseccion='1' AND idcodmodulo='".$row['idcodmodulo']."' order by idcodestiloseccion";
$res_estilo = db_query($sql_estilo);
while($rowestilo = db_fetch_array($res_estilo))
{
if ($rowestilo['idcodestiloseccion']==$row['idcodestiloseccion']) { $check = " checked";} else { $check = "";}
echo "<li>\n";
echo "<img border='0' src=\"/webadmin/estilos/images/" . $rowestilo['cimgestiloseccion'] . "\"> <div style='clear:both;'>
<input type='radio' name='idcodestiloseccion' value='".$rowestilo['idcodestiloseccion']."'".$check.">" . $rowestilo['cnombreestiloseccion'];
echo "</div></li>";
$na++;
}
?>
</ul>
</li>
</div>
Problemas con la clase Xajax:
Error: the XML responde that was returned from the server is invalid