我是jQuery和Ajax的初学者。当我单击添加按钮时,所有字段均为空。然后,我在其中填写这些字段,当我单击“提交”按钮时,什么也没有发生。我不知道该怎么办。有人可以帮我吗?
点击添加按钮时:
$("#add").on("click", addSeries);
function addSeries() {
$.getJSON("http://localhost:8080/Serie/getAll", function(series) {
series.length + 1;
$("#txtSerieId").val(series.length + 1);
});
}
点击提交按钮时:
$("#submit").on("click", submit);
function submit() {
var serieJson = '{"serie_id":' + $("#txtSerieId").val() + ',';
serieJson += '"name" : "' + $("#txtName").val() + '",';
serieJson += '"language_id" : "' + $("#txtLanguage_id").val() + '",';
serieJson += '"genre_id" : "' + $("#txtGenre").val() + '",';
serieJson += '"network_id" : "' + $("#txtNetwork").val() + '"';
serieJson += '}';
$.ajax({
method: "POST",
url:"http://localhost:8080/Series/add",
data: serieJson,
dataType: "json",
processData:false,
headers: {
'Content-Type': "application/json"
},
success: function(data) {
getAllSeries();
}, error: function(err) {
}
});
}
有人告诉我问题出在这里=>数据:serieJson。但是我看不出我的代码有什么问题。
答案 0 :(得分:0)
您需要阻止默认提交表单,因此仅完成AJAX请求。为此使用Event.preventDefault()
。
此外,请勿尝试通过串联字符串来创建JSON。创建一个数组或对象,然后使用JSON.stringify()
。
function submit(e) {
e.preventDefault();
var serie = {
serie_id: $("#txtSerieId").val(),
name: $("#txtName").val(),
language_id: $("#txtLanguage_id").val(),
genre_id: $("#txtGenre").val(),
network_id: $("#txtNetwork").val()
};
var serieJson = JSON.stringify(serie);
$.ajax({
method: "POST",
url:"http://localhost:8080/Series/add",
data: serieJson,
dataType: "json",
processData:false,
headers: {
'Content-Type': "application/json"
},
success: function(data) {
getAllSeries();
}, error: function(err) {
}
});
}