Como enviar um formulário completo em json com pouco código
The snippet can be accessed without any authentication.
Authored by
pedroaf0
Considerando um formulário html com muitos inputs, esse Snippet permite que você os envie para o back-end no formato json independente do numero e do tipo dos inputs ou selects podendo assim ser adicionado em qualquer formulário html.
considerando:
<div class="form-group">
<label for="Cidade">Cidade</label>
<input type="text" class="form-control" id="Cidade" placeholder="Cidade"><br>
<label for="Nacionalidade">Nacionalidade</label>
<input type="text" class="form-control" id="Nacionalidade" value="Brasileiro" placeholder="Nacionalidade"><br>
<label for="Naturalizado">Naturalizado</label>
<select class="form-control" id="Naturalizado">
<option>sim</option>
<option>não</option>
</select>
</div>resultará em:
{
"Cidade":"Ibiraiaras",
"Nacionalidade":"Brasileiro",
"Naturalizado":"sim"
} submit.js 686 B
function submit(){
var inputs = document.getElementsByTagName("input");
var selects = document.getElementsByTagName("select");
var json = "{"
for(var i = 0;i < inputs.length || i < selects.length ;i++){
if(i < inputs.length){json += "\""+inputs[i].id+"\":\""+inputs[i].value+"\"";json += ",";}
if(i < selects.length){json += "\""+selects[i].id+"\":\""+selects[i].value+"\"";json += ",";}
}
json = json.substr(0,json.length - 1);
json += "}";
json = JSON.parse(json);
console.log(json);
// agora voce pode enviar esse json com todos os inputs desse formulario para onde quiser
}
Please register or sign in to comment