Javascript AJAX请求进行两次POST查询（Play框架）

我有这样的表单模板

@(list: List[Item])

@main("test form") {
<form id="testForm" action="@routes.Application.accept()" method="post">
    <table align="center">
        <thead>
            <tr>
                <td>name</td>
                <td>mark</td>
            </tr>
        </thead>
        <tbody>
            @for(item <- list) {
                <tr>
                <td>@item.name</td>
                <td><input type="text" title="@item.name" id="@item.id" value="@item.mark"></td>
                </tr>
            }
        </tbody>
    </table>
    <button onClick="sendJSON('@routes.Application.accept()')">Send</button>
</form>
}

public static Result getForm() {
    List<Item> items = new ArrayList<>();
    for (int i = 0; i < 5; i++) {
        Item item = new Item(i + 1, "person " + (i + 1), (i % 5) + 1);
        items.add(item);
    }
    return ok(form.render(items));
}

public static Result accept() {
    DynamicForm form = Form.form().bindFromRequest();
    String json = form.get("json");
    if (null == json) {
        json = "Nothing received!";
    }
    Logger.info(json);      
    return ok(result.render(json));
}

在logger中，我看到一个AJAX请求有两条记录。一个包含JSON数据，但另一个没有收到任何信息！。只发送一个POST查询的最佳方式是什么？为什么要做警报！还有失败！没有出现吗

---

谢谢你为我浪费时间。致以最良好的祝愿

我找到了对表单提交执行$.ajax POST请求的其他方法。我编写了ajax.js，将此代码放在其中

// this function makes JSON data and send to the server POST request
function sendPost(requestUrl) {
// make JSON
        jsonObj = [];
        $("input:text").each(function() {

            var id = $(this).attr("id");
            var title = $(this).attr("title");
            var mark = $(this).val();

            item = {}
            item ["id"] = id;
            item ["title"] = title;
            item ["mark"] = mark;

            jsonObj.push(item);
        });
        var jsonString = JSON.stringify(jsonObj);
        alert(jsonString);
// send to server
        $.ajax({
            url : requestUrl,
            type : 'POST',
            data : { marks : jsonString },
            success : function(res) {
                $('html').fadeOut(function() {
                    $(this).html(res).fadeIn();
                });
            },
            error : function(jqXHR, textStatus, errorThrown) {
                console.log(jqXHR.statusText + " (" + jqXHR.status + ") " + textStatus + ": " + errorThrown);
                alert("Load error!");
            }
        });
}

// And this one - select form with id='testForm' 
// and runs sendPost function on the submit event.
// to prevent regular form POST request - e.preventDefault is used.
$('#testForm').submit(function(e) {
    var requestUrl = $(this).attr('action');
    sendPost(requestUrl);
    e.preventDefault();
});

---

在模板中我替换了标签。。。要

您不需要指定数据：“json=”+json.stringify”，它会阻止json格式。只需发送数据：JSON.StringifyJSONOBJ如果我想将JSON字符串作为POST请求参数传递呢？哦，好的，我的错。我不明白你为什么要这么做，但你可以^^

// this function makes JSON data and send to the server POST request
function sendPost(requestUrl) {
// make JSON
        jsonObj = [];
        $("input:text").each(function() {

            var id = $(this).attr("id");
            var title = $(this).attr("title");
            var mark = $(this).val();

            item = {}
            item ["id"] = id;
            item ["title"] = title;
            item ["mark"] = mark;

            jsonObj.push(item);
        });
        var jsonString = JSON.stringify(jsonObj);
        alert(jsonString);
// send to server
        $.ajax({
            url : requestUrl,
            type : 'POST',
            data : { marks : jsonString },
            success : function(res) {
                $('html').fadeOut(function() {
                    $(this).html(res).fadeIn();
                });
            },
            error : function(jqXHR, textStatus, errorThrown) {
                console.log(jqXHR.statusText + " (" + jqXHR.status + ") " + textStatus + ": " + errorThrown);
                alert("Load error!");
            }
        });
}

// And this one - select form with id='testForm' 
// and runs sendPost function on the submit event.
// to prevent regular form POST request - e.preventDefault is used.
$('#testForm').submit(function(e) {
    var requestUrl = $(this).attr('action');
    sendPost(requestUrl);
    e.preventDefault();
});