JavaScript removeChild lógica / pregunta

Question

Estoy usando Dojo de arrastrar y soltar. Cuando un usuario añade un elemento a un contenedor (div dojoType = 'dojo.dnd.Source') entonces necesito para obtener esos datos en un formulario por lo que más adelante se pueda procesar en un servidor cuando el usuario envía toda la página. Esa parte está trabajando. Luego de eliminar un elemento, les permito arrastrar / soltar un elemento a un contenedor de "basura". Estoy teniendo difícil conceptualizar cómo quitar el elemento de los campos ocultos. Ya tengo suscribirse / código de evento para llamar a los siguientes dos funciones.

¿Puede usted decirme si hay una mejor manera de hacer la función removeGoalFromHiddenFields? No puede haber muchos elementos "sub-objetivo".

Estoy a punto de comenzar las pruebas con lo que tengo a continuación, pero tengo algunas dudas al respecto.

Gracias,

Neal Walters

   function addGoalToHiddenFields( goalText){
      var field = document.createElement("input");
      field.setAttribute("type","hidden");
      field.setAttribute("value",goalText);
      field.setAttribute("name","subgoal");

      //add new hidden-element to the existing form
      document.getElementById("form1").appendChild(field);
   }

   function removeGoalFromHiddenFields( goalText){

      //remove hidden field 
      nodes = document.getElementById("form1")
      for (i=0;i<nodes.length ;i++ )
           {
             var pos = nodes[i].innerHTML.IndexOf(goalText)
             if (pos > 0)
             {
                 nodes.removeChild(node[i]);

             }
           }

}

Además, puedo hacer esto en su lugar:           nodos = document.getElementById ( "subobjetivo")

Answer 1

Estoy adivinando lo que queremos aquí es la funcionalidad de dojo.query .

Pruebe algo como:

dojo.query("#form1 input[value=\"" + goalText + "\"]").forEach(function(field) {
    field.parentNode.removeChild(field)
});

Answer 2

  

field.setAttribute ( "tipo", "oculta");

No utilice setAttribute en documentos HTML. Hay muchos errores en que IE. Utilice las propiedades normales DOM-HTML, que también son más fáciles de leer:

field.type= 'hidden';

  

var pos = nodo [i] .innerHTML.IndexOf (goalText)

Buscando a través de marcado HTML para un valor es tonto, y no funcionará cuando goalText contiene un personaje como ‘<’ o ‘Y’ que HTML se escapará.

En el código anterior, parece que nodes[i] debe ser uno de los elementos <input> que adjuntas no, en cuyo caso innerHTML no es bueno, ya que sólo va a buscar el contenido de la entrada, que nada es como entrada es un elemento vacío . En su lugar, ver la propiedad value que puso:

var input= nodes[i];
if (input.name=='subgoal' && input.value==goalText)
    input.parentNode.removeChild(input);

  

También, puedo hacer esto en su lugar: nodos = document.getElementById ( "subobjetivo")

No, ya que sus elementos subgoal tienen ningún ID. O bien obtener por su nombre:

var subgoals= form.getElementsByName('subgoal');

(que es el mismo que el DOM-0:)

var subgoals= form.elements.subgoal;

o, añadir una identificación para cada sub-objetivo de ayudar a recuperar más tarde:

field.id= 'id-'+goalText;

lo anterior no funciona, de nuevo, si se puede tener caracteres especiales en goalText.

Por otra parte, mantener su propia búsqueda en JavaScript en lugar de poner todo en el DOM:

var subgoalfields= {};
...
// on add
subgoalfields[goalText]= field;
...
// on remove
subgoalfields[goalText].parentNode.removeChild(subgoalfields[goalText]);
delete subgoalfields[goalText];