Question

我是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。但是我看不出我的代码有什么问题。

Answer 1

您需要阻止默认提交表单，因此仅完成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) { 
        }
    });

}

json消息问题（数据/ processData）

1 个答案: