Ver Mensaje Individual
  #1 (permalink)  
Antiguo 28/05/2012, 10:00
Ojopex2
 
Fecha de Ingreso: abril-2010
Mensajes: 112
Antigüedad: 14 años, 1 mes
Puntos: 2
Ajax para este script?

Hola amigos, en este foro encontré este script, el cual está muy bueno (no quise seguir el hilo dónde lo encontré ya que tenía su tiempo Enlace).
Les cuento lo que necesito.
Una de las particularidades que me gustó este código es que puedo agregar un grupo completo de inputs y en especial <select>. Pero surge el impedimiento que en este código hay que declarar todo el formulario dentro el JS, incluídas las opciones del select. El problema es que el select que necesito podría variar, si se agrega o modifica un elemento debería cambiarlo acá. Por eso necesito traer con ajax el contenido del combo.

Pero el problema es que por más que me han explicado como funciona esto de AJAX, no logro captarlo. Si alguien me puede dar una mano, se lo agradecería.

Me imagino que hay que hacer una llamada a un archivo PHP dónde se genere un XML y esto retornarlo. ¿Estoy bien? Pero la verdad no se cómo.



Código HTML:
Ver original
  1. <script type="text/javascript">
  2. var contLin = 3;
  3. function agregar() {
  4.     var tr, td, tabla;
  5.  
  6.     tabla = document.getElementById('tabla');
  7.     tr = tabla.insertRow(tabla.rows.length);
  8.     td = tr.insertCell(tr.cells.length);
  9.     td.innerHTML = "<select id='sel" + contLin + "'>" +
  10.                    "<option>1" +
  11.                    "<option>2" +
  12.                    "<option>3"; // esto debería venir desde BD
  13.     td = tr.insertCell(tr.cells.length);
  14.     td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
  15.     td = tr.insertCell(tr.cells.length);
  16.     td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "2'>";
  17.     contLin++;
  18. }
  19. function borrarUltima() {
  20.     ultima = document.all.tabla.rows.length - 1;
  21.     if(ultima > -1){
  22.         document.all.tabla.deleteRow(ultima);
  23.         contLin--;
  24.     }
  25. }
  26. </head>
  27. <table id="tabla" border="1">
  28.     <tr><!-- Esto viene de BD -->
  29.         <td><select name="sel1" id="sel1">
  30.             <option>1</option>
  31.             <option>2</option>
  32.             <option>3</option>
  33.             </select>
  34.         </td>
  35.         <td><input type="text" id="t11" value="t11"></td>
  36.         <td><input type="text" id="t12" value="t12"></td>
  37.     </tr>
  38.     <tr>
  39.         <td><select name="sel2" id="sel2">
  40.             <option>1</option>
  41.             <option>2</option>
  42.             <option>3</option>
  43.             </select>
  44.         </td>
  45.         <td><input type="text" id="t21" value="t21"></td>
  46.         <td><input type="text" id="t22" value="t22"></td>
  47.     </tr>
  48. <br>
  49. <input type="button" value="Agregar" onclick="agregar()">
  50. <input type="button" value="Borrar ultima" onclick="borrarUltima()">
  51. </form>
  52. </body>
  53. </html>