I keep encountering this error
Error creating user: FirebaseError: Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field diabetesComplication)
After some investigation, I realized that the issue stems from the approach of collecting checkbox inputs and storing them in an array. I understand now that I need to use JSON.stringify() before saving them in firestore.
However, I am struggling to pinpoint the exact cause of the problem. It's perplexing because I've previously succeeded in storing arrays in firestore using a similar process.
Below is the code snippet:
JavaScript:
$('#registerForm').on('submit', async function (e) {
e.preventDefault();
var data = {
email: $('#email').val(),
firstName: $('#fname').val(),
lastName: $('#lname').val(),
sex: $('#sex').val(),
birthDate: new Date($('#bday').val()),
diabetesType: parseInt($('#dtype').val()),
weight: parseInt($('#weight').val()),
height: parseInt($('#height').val())
};
var allergyList = [];
var cou = i.counter;
for (c = 0; c <= cou; c++) {
var allergyField = document.getElementById("allergy" + c).value;
allergyList.push(allergyField);
AllergyString = JSON.stringify(allergyList);
}
var arrayComplications = [];
var checkboxes = document.querySelectorAll('input[type=checkbox]:checked');
for (var i = 0; i < checkboxes.length; i++) {
JSON.stringify(arrayComplications.push(checkboxes[i].value));
}
var passwords = {
password : $('#password').val(),
cPassword : $('#cpassword').val()
};
if( data.email != '' && passwords.password != '' && passwords.cPassword != '' ){
if( passwords.password == passwords.cPassword ) {
// Code to create user omitted for brevity
}
}
});
HTML:
<div class="col-md-6 pl-1">
<div class="form-group">
<label>Diabetes Complication</label>
<br>
<input type="checkbox" name="type" value="No Complications" /><b>No Complications</b>
<br>
<input type="checkbox" name="type" value="Retinopathy" /><b>Retinopathy</b>
<br>
<input type="checkbox" name="type" value="Neuropathy" /><b>Neuropathy</b>
<br>
<input type="checkbox" name="type" value="Nephropathy" /><b>Nephropathy</b>
<br>
<input type="checkbox" name="type" value="Cardiovascular"/><b>Cardiovascular</b>
</div>
</div>
The section of code where I encounter issues with includes:
var arrayComplications = [];
var checkboxes = document.querySelectorAll('input[type=checkbox]:checked');
for (var i = 0; i < checkboxes.length; i++) {
JSON.stringify(arrayComplications.push(checkboxes[i].value));
}
I am struggling to extract the values of the checkboxes, save them into an array, serialize it, and store it in firestore.