Crear dinámicamente un formulario HTML con Javascript

No tengo idea de cómo proceder, he estado buscando en mi rostro pero no hay nada definitivo que pueda mostrarme cómo crear formas dinámicamente con él.

¡Gracias por adelantado!

Fuente

2010-07-21 Odyss3us

Básicamente, exactamente como creas otros elementos con JavaScript, usando 'createElement' o jQuery. ¿Puedes usar jQuery? –

Sí, puedo usar jQuery, aunque no demasiado familliar. – Odyss3us

Creo que la publicación de una solución completa sería demasiado, pero echa un vistazo a jQuery para esto. Te daré una pista, jQuery de .append() podría ser muy útil para usted :)

Fuente

2010-07-21 07:44:06

uso document.write o si desea más flexibilidad de uso jquery

Fuente

2010-07-21 07:43:42 zaynyatyi

sólo tiene que utilizar la API de DOM estándar (document.createElement(), see these docs for an example) para crear todos los elementos de la forma.

Fuente

2010-07-21 07:44:21

Mi recomendación sería obtener la biblioteca underscore.js y usar su función template para crear sus formularios. (Si el guión bajo es demasiado grande para usted, la función de plantilla también puede sostenerse por sí misma).

Fuente

2010-07-21 07:44:43

Sí, puede crear cualquier cantidad de HTML que incluye formas de JavaScript que se ejecuta,

Tal vez: `

<html> 
    <body> 
    <h1>My Form</h1> 
    <div id="formcontent"> 
    </div> 
    </body> 
</html>

Nuestra javascript podría ser:

var e1 = document.CreateElement("input"); 
el.type = "text"; 
el.name = "myformvar"; 

var cont = document.GetElementById("formcontent") 
cont.appendChild(e1);

Fuente

2010-07-21 07:46:46 IanNorton

TRATA ESTO ..

myWin = open("", "displayWindow", "width=800,height=500,status=yes,toolbar=yes,menubar=yes"); 

       myWin.document.open(); 
       myWin.document.write("<html><head><title>V E N U S </title>"); 
       myWin.document.write("<style type='text/css'>.hdr{.......}</style>"); 
        myWin.document.write("</head><body onload='window.print()'>"); 
          myWin.document.write("<div class='hdr'>"); 

           myWin.document.write("what ever you want"); 
           . 
           . 


         myWin.document.write("</div>");    
        myWin.document.write("</body></html>"); 
       myWin.document.close();

es que va a crear un formulario con DIV dentro de él ...

Fuente

2011-03-18 19:12:37 MuniR

Usted podría intentar algo como esto:

La parte HTML:

<html> 
<head></head> 
<body> 

<body> 
</html>

El javascript:

<script> 
//create a form 
var f = document.createElement("form"); 
f.setAttribute('method',"post"); 
f.setAttribute('action',"submit.php"); 

//create input element 
var i = document.createElement("input"); 
i.type = "text"; 
i.name = "user_name"; 
i.id = "user_name1"; 

//create a checkbox 
var c = document.createElement("input"); 
c.type = "checkbox"; 
c.id = "checkbox1"; 
c.name = "check1"; 

//create a button 
var s = document.createElement("input"); 
s.type = "submit"; 
s.value = "Submit"; 

// add all elements to the form 
f.appendChild(i); 
f.appendChild(c); 
f.appendChild(s); 

// add the form inside the body 
$("body").append(f); //using jQuery or 
document.getElementsByTagName('body')[0].appendChild(f); //pure javascript 

</script>

Este forma en que puede crear tantos elementos como desee de forma dinámica.

Fuente

2013-03-14 12:37:03 user1451533

Esta solución funcionó muy bien. ¡Gracias! –

En caso de que el DOM no esté cargado en el momento de la ejecución de la secuencia de comandos, es posible que aparezca un error: en mi caso obtuve "No se puede leer la propiedad 'appendChild' de undefined". Así que es mejor incluir el código de JavaScript dentro del bloque window-onload. por ejemplo, – Dilruk

Mi idea es que puede usar el dform jquery plugin de github para crear formularios directamente dando la entrada como datos json.

Fuente

2013-08-26 10:36:20

Crear dinámicamente un formulario HTML con Javascript

Respuesta

Cuestiones relacionadas