I'm developing an application with Node and Mongoose. My problem is this: In the backend I have the model of an entity called Equipment. Schema has several parameters.
I have a form to create a Equipment (this form works normally). The creation form has several inputs that have the same name as the Mongo Schema parameters.
The problem is that now I'm creating a form to edit the equipment according to the id. It turns out that I use one of the inputs to popular another by querying another API. I believe that a conflict is happening because the name of the inputs are the same, but how will I leave them with another name to do the update?
The first input, after clicking on the magnifying glass, sends a get to an API and populates the second:
Intheformofcreationthisworks,intheother,itisnotpopulated.
Creationmode:
<fieldset><!--SelectBasic--><divclass="form-group">
<label class="col-md-4 control-label" for="sha1Curve"
>Curva</label
>
<div class="col-md-6 input-container">
<input
id="sha1Curve"
name="sha1Curve"
type="text"
placeholder="SHA-1"
class="form-control input-sm"
/>
</div>
<a href="javascript:void(0)" name="searchCurve" id="searchCurve"
><i class="fa fa-search fa-lg" style="vertical-align: -50%;"></i
></a>
</div>
<!-- Select Basic -->
<div
id="grainDiv"
name="grainDiv"
class="form-group"
style="display: none;"
>
<label class="col-md-4 control-label" for="grain">Grão</label>
<div class="col-md-6">
<select id="grain" name="grain" class="form-control"> </select>
</div>
</div>
Edit Mode:
<fieldset>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label" for="sha1Curve"
>Curva</label
>
<div class="col-md-6 input-container">
<input
id="sha1Curve"
name="sha1Curve"
type="text"
placeholder="SHA-1"
class="form-control input-sm"
/>
</div>
<a href="javascript:void(0)" name="searchCurve" id="searchCurve"
><i class="fa fa-search fa-lg" style="vertical-align: -50%;"></i
></a>
</div>
<!-- Select Basic -->
<div
id="grainDiv"
name="grainDiv"
class="form-group"
style="display: block;"
>
<label class="col-md-4 control-label" for="grain">Grão</label>
<div class="col-md-6">
<select id="grain" name="grain" class="form-control"> </select>
</div>
</div>
xml
The way I'm doing the Post:
$("#searchCurve").on("click", function() {
var xhr = new XMLHttpRequest();
var url = "URL";
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 0) {
alert(
"Não foi possível buscar as informações, tente novamente mais tarde."
);
}
};
xhr.onload = function() {
var status = xhr.status;
var data = xhr.responseText.split("<nome>");
var grain;
// Add equipment
var grainSelect = document.getElementById("grain");
for (var i = 1; i < data.length; i += 2) {
grain = data[i].split(",;");
console.log(grain[0]);
var option = document.createElement("option");
option.text = grain[0];
grainSelect.add(option, null);
showAddForm();
}
};
var sha1 = document.getElementById("sha1Curve").value;
console.log(sha1);
var postData = JSON.stringify({ idCurva: sha1.trim() });
console.log(postData);
xhr.send(postData);
});
Thank you