Cargar inputs al introducir un numero en un input
Hola Comunidad. Vengo con una nueva consulta: Deseo poder realizar una consulta y rellenar unos campos de texto a partir de introducir un numero de telefono sin necesidad de colocar la consulta por medio de una url. Los datos los traigo desde una API. Aquí el código del index y del template:
express = require('express');
const request = require('request');
const morgan = require('morgan');
const exphbs = require('express-handlebars');
const path = require('path');
const app = express();
const axios = require('axios');
//Settings
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.engine('.hbs', exphbs({
defaultLayout: 'main',
layoutsDir: path.join(app.get('views'), 'layouts'),
partialsDir: path.join(app.get('views'), 'partials'),
extname: '.hbs',
helpers: require('./lib/handlebars')
}));
app.set('view engine', '.hbs');
// Middlewares
app.use(morgan('dev'));
app.use(express.urlencoded({extended: false}));
app.use(express.json());
//Global Variables
app.use((req, res, next) => {
next();
});
//Routes
app.get('/api/freshdesk/phone/', async (req, res) => {
const phoneNumber = req.params.phoneNumber;
let options = {
url: 'https://ngapi.freedompop.mx/api/freshdesk/phone/' + phoneNumber ,
method: 'GET',
json: true,
headers: {
'Authorization': 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJhYjQwMzIwM2MzNDE0MjYyOWVmNjcyMTUwZGQ4OGUxNCIsInJvbGUiOiJCUUFBQVFBQUFBQUFBQUFBQUFBQUFBQUFBQUE9IiwibmFtZSI6IkZyZXNoZGVzayBBUEkiLCJleHAiOjE1NzExNjI1NzF9.6OYLPsPqWAOvUuuUEnRQZWNBR0npENbxnFd1t5JoeNM'
}
};
request(options, function(err, r) {
const phoneN = r.body;
console.log(phoneN);
res.render('layouts/test', {phoneN});
});
});
// Public
app.use(express.static(path.join(__dirname, 'public')));
//Starting Server
app.listen(app.get('port'), () => {
console.log('Server on port ', app.get('port'));
});
<div class="container p-4">
<div class="row">
<div class="col-md-4 mx-auto">
<div class="card ">
<div class="card-body">
<form action="/api/freshdesk/phone/{{phoneN}}" method="POST">
<div class="form-group">
<label>Phone Number</label>
<input type="number" value="" class="form-control" name="phoneNumber" id="phoneNumber" autofocus>
</div>
<div class="form-group">
<label>Email</label>
<input type="email" value="{{phoneN.email}}" class="form-control" name="email" id="email" autofocus>
</div>
<div class="form-group">
<label>Iccid</label>
<input type="text" value="{{phoneN.iccid}}" class="form-control" name="iccid" id="iccid" autofocus>
</div>
<div class="form-group">
<label>Account Id</label>
<input type="text" value="{{phoneN.accountId}}" class="form-control" name="accountId" id="accountId" autofocus>
</div>
<div class="form-group">
<label>Device Name</label>
<input type="text" value="{{phoneN.deviceName}}" class="form-control" name="deviceName" id="deviceName" autofocus>
</div>
<div class="form-group">
<label>Network</label>
<input type="text" value="{{phoneN.network}}" class="form-control" name="network" id="network" autofocus>
</div>
<div class="form-group">
<label>Plan Name</label>
<input type="text" value="{{phoneN.planName}}" class="form-control" name="planName" id="planName" autofocus>
</div>
<div class="form-group">
<button class="btn btn-success btn-block">Guardar </button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>