13

我有一个带有输入字段的表单，可以像这样访问

var algorithm = document.forms["algoForm"]["algorithm"].value;
var input = document.forms["algoForm"]["input"].value;

之前的电话是

document.forms["algoForm"].submit();

形式是

<form name="algoForm" method="post" action="run.do">

一切运行良好
现在我想将其转换为 ajax 调用，以便我可以在同一页面上使用从 java 代码返回的数据。所以我用了类似的东西

        var algorithm = document.forms["algoForm"]["algorithm"].value;
        var input = document.forms["algoForm"]["input"].value;
        var data = 'algorithm = ' + algorithm + '&input = ' + input;


    $.ajax(
            {
                url: "run.do",
                type: "POST",
                data: data,
                success: onSuccess(tableData) 
                { //line 75
                    alert(tableData);
                }

            }
        );

但是上面的代码没有运行。请帮我让它运行

4

5 回答 5

14

让我们使用 jQueryserialize来获取数据，form然后使用 jQuery 的ajax函数将数据发送到服务器：

var data = $("form[name=algoForm]").serialize();
$.ajax({
    url: "run.do",
    type: "POST",
    data: data,
    success: function(tableData){
        alert(tableData);
    }
});
于 2012-06-18T12:36:35.320 回答
5

data需要一个文字对象，所以你需要：

var data = {
    'algorithm': algorithm,
    'input': input
};
于 2012-06-18T12:15:29.340 回答
3

而不是检索所有参数值然后单独发送它们（这也可以在服务器端完成，使用下面的代码），使用这个：

var $form = $("#divId").closest('form');
    data = $form.serializeArray();

    jqxhr = $.post("SERVLET_URL', data )
        .success(function() {
            if(jqxhr.responseText != ""){
                //on response
            }
        });
    }

divId是包含此表单的 div 的 id。

此代码会将所有表单参数发送到您的 servlet。现在，您可以在 servlet 中使用 request.getParameter 来获取 servlet 上的所有单个字段值。

您可以轻松地将上面的 jquery post 转换为 jquery ajax。

希望这可以帮助 ：）

于 2012-06-18T12:33:13.350 回答
1

不知道怎么回事，这个跑的不错

    var algorithm = document.forms["algoForm"]["algorithm"].value;
    var input = document.forms["algoForm"]["input"].value;

    $.post('run.do', {  
            algorithm  : algorithm,
            input      : input
        }, function(data) {                  
            alert(data);
        }
    );
于 2012-06-18T13:36:27.360 回答
1 

// patching FORM - the style of data handling on server can remain untouched
$("#my-form").on("submit", function(evt) {
	var data = {};
	var $form = $(evt.target);
	var arr = $form.serializeArray(); // an array of all form items
	for (var i=0; i<arr.length; i++) { // transforming the array to object
		data[arr[i].name] = arr[i].value;
	}
	data.return_type = "json"; // optional identifier - you can handle it on server and respond with JSON instead of HTML output
	$.ajax({
		url: $form.attr('action') || document.URL, // server script from form action attribute or document URL (if action is empty or not specified)
		type: $form.attr('method') || 'get', // method by form method or GET if not specified
		dataType: 'json', // we expect JSON in response
		data: data // object with all form items
	}).done(function(respond) {
		console.log("data handled on server - response:", respond);
		// your code (after saving)

	}).fail(function(){
		alert("Server connection failed!");
	});
	
	return false; // suppress default submit action
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

于 2017-09-09T10:23:23.593 回答