Question

假设我有一个相当通用的jQuery Prompt，要求我重命名一个元素，然后告诉我输入的内容：

$(function () {
$("#rename").click(function () {
    jPrompt('Please Enter a New Name:', 'Enter new name...', 'Rename Prompt', function (r) {
        if (r) {
            alert('You entered ' + r);
        }
    });
});
});

但我希望重命名的元素存储在服务器上的数据库中，这意味着我需要运行服务器端脚本来重命名该元素。我认为这意味着我需要使用提交，就像在表单上一样。我找到了一些关于.submit（）jQuery函数here的信息，但我并不完全理解它是如何工作的。如果有人能告诉我如何提交，然后运行服务器端脚本，真的很感激。

Answer 1

$(function () {
    $("#rename").click(function (e) {
        e.preventDefault();
        jPrompt('Please Enter a New Name:', 'Enter new name...', 'Rename Prompt', function (r) {
            if (r) {
                $('input[name="NewName"]').val(r.Name);
                $.post('@Url.Action("Edit", "TheController")', $('#hiddenform').serialize(), function(response) {
                    // response = ActionResult
                });
            }
        });
    });
});

使用Url.Action获取正确的URI
使用“防止默认设置阻止默认操作”
从MVC3操作中返回某种JSON以指示成功/失败。
在某处放置一个隐藏的<form>并填写要发布的信息

Answer 2

您将希望使用AJAX将请求从JavaScript发送到服务器端脚本。查看jQuery API documentation on AJAX以获取更多信息。

以下jPrompt回调将向服务器端脚本发出HTTP POST请求，并将id和newName个参数与请求一起传递。在PHP中，您可以使用$_POST['id']和$_POST['newName']检索这些内容。

function (r) {
    if (r) {
        $.post("rename.php", {
            data: {
                id: somethingToIdentifyTheElement,
                newName: r
            },
            success: function(response) {
                // Successfully renamed the element!
                // If your server-side script returned something interesting,
                // you can find it in the response argument
            }
        });
    }
}

Answer 3

如果有人能告诉我如何提交，然后运行服务器端脚本，真的很感激。

为此你需要使用$.ajax()函数，以便调用serverside函数。

$.ajax({
  url: 'YourController\yourAction',
  type:'post'
  success: function(data) {
    $('.result').html(data);
    alert('Load was performed.');
  }
});

使用jQuery提示提交

3 个答案: