I'm trying to create a form data reading routine HTML and, from the value of the input fields, generate a JSON file with NODE JS (create a .json file, it is not translate to json ). I also want to implement the reverse flow, reading these files on the screen.
What I did up until then was to create a Jquery class, instantiate its object by getting the form data with jquery and format it in json . I also have ready the file creation routine on node.
I need to learn how to pass the json object in jquery to Node , and can then generate the new .json separated file as a database.
I thought about REST / ajax solutions, but I could not implement them.
//CÓDIGO NODE:
var fs = require('fs');
var express = require('express');
var ajax = require('ajax-request');
request('url', function(err, res, body) {});
request({
url: 'http://localhost:3000/endpoint',
method: 'GET',
data: {'insira o código aqui'}
}, function(err, res, body) {
});
//NÃO SEI O QUE INSERIR NO DATA
let data = JSON.stringify(job1);
fs.writeFileSync('job1.json',data);
/*INSTANCIA CLASSE*/
var Job = /** @class */ (function () {
function Job() {
}
return Job;
}());
let c = new Job();
c.njob = $('#njob').val();
c.cliente = $('#cliente').val();
c.escritorio = $('#escritorio').val();
c.tcliente = $('#tcliente').val();
c.database = $('#database').val();
c.deadline = $('#dip').val();
c.socio = $('#socio').val();
c.diretor = $('#diretor').val();
c.gerente = $('#gerente').val();
c.encarregado = $('#encarregado').val();
let datac = JSON.stringify(c);
$.ajax
({
type: "POST",
dataType : 'json',
//async: false,
//contentType: 'application/json',
url: 'http://localhost:3000/endpoint',
data: {datac:'teste'},
success: function (data) {alert("Thanks!"); },
failure: function() {alert("Error!");}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="col-lg-6">
<h4 class="box-heading">Nº Engagement (Nº Job) </h4>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-search"></span>
</span>
<input type="text" placeholder="insira o número do job. Ex: 1452145" class="form-control" id="njob" />
<!--VERIFICAR CADASTRO.
CASO HAJA, OS DEMAIS CAMPOS DO CLIENTE RECEBEM INFORMAÇÃO E BOTÃO NEXT RECEBE FUNÇÃO UPDATE.
CASO NÃO HAJA, O BOTÃO NEXT RECEBE FUNÇÃO CADASTRAR-->
<span class="input-group-btn">
<button type="button" class="btn btn-default" onclick='mostraConteudoEng1()'>OK!</button>
</span>
</div>
<div class="mbl"></div>
<div id="engagement-1">
<div class="input-group">
<span class="input-group-addon">Cliente</span>
<input type="text" class="form-control" id="cliente" />
</div>
<div class="mbl"></div>
<div class="input-group">
<span class="input-group-addon">Escritório</span>
<input type="text" class="form-control" id="escritorio"/>
</div>
<div class="mbl"></div>
<div class="input-group">
<span class="input-group-addon">Tipo Cliente</span>
<input type="text" class="form-control" id="tcliente"/>
</div>
<div class="mbl"></div>
<div class="input-group">
<span class="input-group-addon">Database:</span>
<input type="text" class="form-control" id="database" />
</div>
<div class="mbl"></div>
<div class="form-group">
<div class="input-group date" data-provide="datepicker">
<span class="input-group-addon">Início do Período:</span>
<input class="form-control input-data"type="text" id="dip" >
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div>
</div>
<div class="mbl"></div>
<div class="col-lg">
<ul class="pager">
<li class="next">
<a onclick=''>Prosseguir →</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!--FECHA ROW CLIENTE-->