I have been messing around trying to save data from a web form and cannot get the standard validation to return. Thinking this is some sort of async problem that I am just not getting. Saving objects with the parse.com api is built off of backbone.js, so it is pretty similar to that. For some reason I can save my data to my database no problems, but when I try to introduce some sort of validation it gets messed up. Looking for some info on how to properly get a success validation back from the server. Right now it hits error every time, and seems to kill the server from saving data.
Below is the code that executes on submit. I have shown the three ways I have tried saving data.
$("#f1").submit(function(event) {
var NewRes = Parse.Object.extend("Customer");
var newRes = new NewRes();
newRes.set("FirstName", "Ricky");
newRes.set("LastName", "Bobby");
//works every time, but I have no return validating it
newRes.save();
//saving with callback options, doesn't save anything to the database and hits error message
newRes.save(null, {
wait: true,
success: function(newRes, response) {
alert("success" + response.message);
},
error: function(newRes, response) {
alert("errorcode: " + response.code + " Message: " + response.message);
}
});
//saving with promises, doesn't save anything and hits error message
newRes.save().then(function(response) {
alert("success");
}, function(error) {
alert("error");
});
});
Here are the results of the error message given below:
errorcode: 100 Message: XMLHttpRequest failed: {"statusText":"","status":0,"response":"","responseType":"","responseXML":null,"responseText":"","upload":{"ontimeout":null,"onprogress":null,"onloadstart":null,"onloadend":null,"onload":null,"onerror":null,"onabort":null},"withCredentials":false,"readyState":4,"timeout":0,"ontimeout":null,"onprogress":null,"onloadstart":null,"onloadend":null,"onload":null,"onerror":null,"onabort":null}
The reason none of this was working is because the form.submit() function was finishing before any of the parse.com asynchronous functions were complete. In order to prevent this I used the preventdefault method to stop the form from submitting. Then I used location.reload() to refresh the page after my parse.com requests have either finished successful or failed.
$("#f1").submit(function(event) {
event.preventDefault();
var NewRes = Parse.Object.extend("Customer");
var newRes = new NewRes();
newRes.set("FirstName", "Ricky");
newRes.set("LastName", "Bobby");
//saving with promises
newRes.save().then(function(response) {
alert("success");
location.reload(); //refreshes the form
}).catch(function(error) {
alert("error");
location.reload();
});
});