Volver al Programación / Codificación foro

un poco de ayuda de Javascript / código php

  • tiffix
  • Student
  • Student
  • Avatar de Usuario
  • Registrado: Jun 03, 2009
  • Mensajes: 65
  • Loc: kenya
  • Status: Offline

Nota Abril 29th, 2010, 5:20 am

hola a todos, gracias por ver este post. estoy teniendo un problema que viene con un código que permitir a los usuarios hacer clic en un botón y automáticamente agregar un nuevo campo de entrada. i entonces transmitir estos valores a un "PHP" página a través de "post" en un formulario a continuación, ser capaz de hacer referencia a estos valores, ya sea usando un bucle while o un ciclo for para que yo pueda escribir en la base de datos. gracias por su ayuda chicos...:?
Código: [ Select ]
// JavaScript Document
var arrInput = new Array(0);
 var arrInputValue = new Array(0);

function addInput() {
 arrInput.push(arrInput.length);
 arrInputValue.push("");
 display();
}

function display() {
 document.getElementById('parah').innerHTML="";
 for (intI=0;intI<arrInput.length;intI++) {
  document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
 }
}

function saveValue(intId,strValue) {
 arrInputValue[intId]=strValue;
} 

function createInput(id,value) {
 return "<input type='text' id='test "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'><br>";
}

function deleteInput() {
 if (arrInput.length > 0) {
   arrInput.pop();
   arrInputValue.pop();
 }
 display();
}
  1. // JavaScript Document
  2. var arrInput = new Array(0);
  3.  var arrInputValue = new Array(0);
  5. function addInput() {
  6.  arrInput.push(arrInput.length);
  7.  arrInputValue.push("");
  8.  display();
  9. }
  11. function display() {
  12.  document.getElementById('parah').innerHTML="";
  13.  for (intI=0;intI<arrInput.length;intI++) {
  14.   document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  15.  }
  16. }
  18. function saveValue(intId,strValue) {
  19.  arrInputValue[intId]=strValue;
  20. } 
  22. function createInput(id,value) {
  23.  return "<input type='text' id='test "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'><br>";
  24. }
  26. function deleteInput() {
  27.  if (arrInput.length > 0) {
  28.    arrInput.pop();
  29.    arrInputValue.pop();
  30.  }
  31.  display();
  32. }


y esta es la parte html
Código: [ Select ]
<p id="parah">Click below to dynamically create/remove input boxes in this field</p>
      <a href="javascript:addInput()">Add more input field(s)</a><br>
    <a href="javascript:deleteInput()">Remove field(s)</a>
  1. <p id="parah">Click below to dynamically create/remove input boxes in this field</p>
  2.       <a href="javascript:addInput()">Add more input field(s)</a><br>
  3.     <a href="javascript:deleteInput()">Remove field(s)</a>



Por supuesto que tengo parte de la cabeza se puede html.
  • Anonymous
  • Bot
  • No Avatar
  • Registrado: 25 Feb 2008
  • Mensajes: ?
  • Loc: Ozzuland
  • Status: Online

Nota Abril 29th, 2010, 5:20 am

  • righteous_trespasser
  • Scuffle
  • Genius
  • Avatar de Usuario
  • Registrado: Mar 12, 2007
  • Mensajes: 6228
  • Loc: South-Africa
  • Status: Offline

Nota Abril 30th, 2010, 3:53 am

Puedo usar jQuery para este tipo de cosas...su forma más fácil de ponerlo en marcha. Les puedo mostrar cómo lo haría en jQuery si el youd como...?
Let's leave all our *plum* where it is and go live in the jungle ...
  • X3ndou
  • Proficient
  • Proficient
  • Avatar de Usuario
  • Registrado: Nov 06, 2004
  • Mensajes: 263
  • Loc: New Jersey
  • Status: Offline

Nota Abril 30th, 2010, 5:20 pm

Sí, cambiar a usar jQuery inmediatamente. Se le hará la vida mil veces más fácil.

http://jquery.com/

También, consiga un navegador con algunas herramientas de desarrollo como una consola de Javascript. Chrome ha construido adentro Si usas Firefox descargar una copia de Firebug.

Tuve que hacer esto en realidad hace poco, los heres una visión rápida de cómo hacerlo con jQuery.

Código: [ Select ]
<script type="text/javascript">
function add_input()
{
  $("#add-button").after("<input type='text' name='fields[]' size=40 maxlength=129 />");
}
</script>
<a id="add-button" href="#" onclick="add_input()">Add an input!</a>
  1. <script type="text/javascript">
  2. function add_input()
  3. {
  4.   $("#add-button").after("<input type='text' name='fields[]' size=40 maxlength=129 />");
  5. }
  6. </script>
  7. <a id="add-button" href="#" onclick="add_input()">Add an input!</a>


La función add_input inicia con la selección el elemento en el DOM con el id "añadir un botón", sino que a continuación, agrega el código html pasé después de que el uso después de () método.

http://api.jquery.com/after/

Espero que esto ayude!
"On the day *I* go to work for Microsoft, faint oinking sounds will be heard from far overhead, the moon will not merely turn blue but develop polkadots, and hell will freeze over so solid the brimstone will go superconductive." -Eric S. Raymond

Página 1 de 1

Publicar Información

  • Total de mensajes en este tema: 3 mensajes
  • Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 221 invitados
  • No puede abrir nuevos temas en este Foro
  • No puede responder a temas en este Foro
  • No puede editar sus mensajes en este Foro
  • No puede borrar sus mensajes en este Foro
  • No puede enviar adjuntos en este Foro
 
 

© 2011 Unmelted, LLC. Ozzu® es una marca registrada de Unmelted, LLC