HI how to post a form and return data it will be a array as like this
{
"notes":'some notes',
"validUntil": '12/12/2015',
"status": 1,
"menuItemName": "HR Section",
"menuItemDesc": "gggg"
}
My code is this
$('#add-menu-list .btn[data-attr=submit-btn]').on('click', function(){ var formValidate = $('#add-menu-list').parsley().validate(); validateFront(); // console.log(formValidate); var menuName = $('input[data-api-attr=menuItemName]').val(); var validUntil = $('input[data-api-attr=validUntil]').val(); var menuStatus = $('input[data-api-attr=status]').val(); var menuNote = $('textarea[data-api-attr=notes]').val(); var menuDesc = $('textarea[data-api-attr=menuItemDesc]').val(); var dataString = { menuItemName: menuName, validUntil : validUntil, status : menuStatus, notes : menuNote, menuItemDesc : menuDesc }; if(formValidate == true){ alert('success'); console.log(menuName + validUntil + menuStatus + menuNote + menuDesc); var url = "xyz.html"; // the script where you handle the form input. $.ajax({ type: "POST", // url: url, dataType: "json", data: $(dataString).serialize(), // serializes the form's elements. success: function(data) { alert(data); // show response } }); }else{ alert('Validation fail '); } });
Since "data" is a server response i guess that your server return a json object. In this case you have to somehow inform the jquery's ajax that you expect a json response from server or you have to translate the "data" to a json object by your self.
It is best to follow the first option so you don t have to deal with the translation your self you can easily do that by giving an extra parameter tou your ajax reuest : dataType: 'json',
this will do the trick!
Now that you have a proper response object from your request you can either stringify it with var string_resp=JSON.stringify(data);
and then alert it alert(string_resp)
or you can access its elements like that : alert(data.status)
which will alert your object's status field etc.
so your code will be :
$.ajax({
type: "POST",
url: url,
dataType: 'json',
data: $(menuName).serialize(), // serializes the form's elements.
success: function(data)
{
alert(data); // will alert an object
alert(data.status); // will alert object's status field in this case 1
alert(JSON.stringify(data)) // will alert the object as a string
}
});
you are sending only one value in serialize, serialize() should be on form element not on field element, like :
$('#add-menu-list .btn[data-attr=submit-btn]').on('click', function(){
...
$.ajax({
...
data:$("#form").serialize();
...
success: function(data)
{
alert(data.notes); // show response
....
}
var myObj = { "notes":'some notes', "validUntil": '12/12/2015', "status": 1, "menuItemName": "HR Section", "menuItemDesc": "gggg" }; myObj.toString = function() { var str = ''; for (var property in myObj) { if (myObj.hasOwnProperty(property) && (property != "toString") ) { str += (property + ': ' + myObj[property] + "\\n"); // do stuff } } return str; } alert(myObj);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.