Los formularios precargados son aquellos formularios que ya están llenos con los datos deseados. Estos son útiles cuando un usuario quiere actualizar algo como su perfil, etc.
Simplemente creamos una carpeta y agregamos un archivo, por ejemplo, index.js. Para ejecutar este archivo, debe ejecutar el siguiente comando.
node index.js
Nombre de archivo: SampleForm.ejs
<!DOCTYPE html> <html> <head> <title>Pre-Filled Form Demo</title> </head> <body> <h1>Update User</h1> <form action="saveData" method="POST"> <pre> Email : <input type="text" name="email" value='<%=user.email%>'> <br> Name : <input type="text" name="name" value='<%=user.name%>'> <br> Number : <input type="number" name="mobile" value='<%=user.mobile%>'> <br> Address : <input type="text" name="address" value='<%=user.address%>'> <br> <input type="submit" value="Submit Form"> </pre> </form> </body> </html>
Nombre de archivo: index.js
const express = require("express")
const path = require('path')
const app = express()
var PORT = process.env.port || 3000
// View Engine Setup
app.set("views", path.join(__dirname))
app.set("view engine", "ejs")
app.get("/", function(req, res){
// Sample date to be filled in form
var user = {
email: 'test@gmail.com',
name: 'Gourav',
mobile: 9999999999,
address: 'ABC Colony, House 23, India'
}
res.render("SampleForm",
{
user: user
}
);
})
app.listen(PORT, function(error){
if(error) throw error
console.log("Server created Successfully on PORT", PORT)
})
Pasos para ejecutar el programa:
- La estructura del proyecto se verá así:
- Asegúrese de haber instalado ‘view engine’ como he usado «ejs» y también instalé el módulo express usando los siguientes comandos:
npm install express npm install ejs
- Ejecute el archivo index.js usando el siguiente comando:
node index.js
- Ahora abra el navegador y escriba esta URL:
http://localhost:3000/
- Luego verá el formulario de usuario de actualización precompletado como se muestra a continuación:
Así es como puede crear sus propios formularios precargados.
Publicación traducida automáticamente
Artículo escrito por gouravhammad y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA