javascript - validacion - jQuery-Crear elemento de formulario oculto sobre la marcha

validar formulario jquery

Question

¿Cuál es la forma más sencilla de crear dinámicamente un campo de formulario de entrada oculto utilizando jQuery?

Answer 1

Igual que el de David, pero sin attr ()

$(''<input>'', {
    type: ''hidden'',
    id: ''foo'',
    name: ''foo'',
    value: ''bar''
}).appendTo(''form'');

Answer 2

Si quieres agregar más atributos haz como:

$(''<input>'').attr(''type'',''hidden'').attr(''name'',''foo[]'').attr(''value'',''bar'').appendTo(''form'');

O

$(''<input>'').attr({
    type: ''hidden'',
    id: ''foo'',
    name: ''foo[]'',
    value: ''bar''
}).appendTo(''form'');

Answer 3

Trabajando JSFIDDLE

Si tu forma es como

<form action="" method="get" id="hidden-element-test">
      First name: <input type="text" name="fname"><br>
      Last name: <input type="text" name="lname"><br>
      <input type="submit" value="Submit">
</form> 
    <br><br>   
    <button id="add-input">Add hidden input</button>
    <button id="add-textarea">Add hidden textarea</button>

Puedes agregar entrada oculta y área de texto para formar así

$(document).ready(function(){

    $("#add-input").on(''click'', function(){
        $(''#hidden-element-test'').prepend(''<input type="hidden" name="ipaddress" value="192.168.1.201" />'');
        alert(''Hideen Input Added.'');
    });

    $("#add-textarea").on(''click'', function(){
        $(''#hidden-element-test'').prepend(''<textarea name="instructions" style="display:none;">this is a test textarea</textarea>'');
        alert(''Hideen Textarea Added.'');
    });

});

Revisa el trabajo de JSFIDDLE aquí.

Answer 4

$(''#myformelement'').append(''<input type="hidden" name="myfieldname" value="myvalue" />'');

Answer 5

$(''<input>'').attr(''type'',''hidden'').appendTo(''form'');

Para contestar su segunda pregunta:

$(''<input>'').attr({
    type: ''hidden'',
    id: ''foo'',
    name: ''bar''
}).appendTo(''form'');

Answer 6

function addHidden(theForm, key, value) {
    // Create a hidden input element, and append it to the form:
    var input = document.createElement(''input'');
    input.type = ''hidden'';
    input.name = key;''name-as-seen-at-the-server'';
    input.value = value;
    theForm.appendChild(input);
}

// Form reference:
var theForm = document.forms[''detParameterForm''];

// Add data:
addHidden(theForm, ''key-one'', ''value'');