Asp net mvc and javascript response

Asp net mvc and javascript response

本文关键字：javascript response and mvc net Asp      更新时间：2023-09-26

我有一个javascript，需要做两件事:1. 在数据库中发送要更新的数据2. 在显示模式下更新我的html表单。3.更新我的表的行以反映更新的数据。

我的javascript只做1和2:

$(".form-commands .save").live("click", function () {
    var f = $(".form-edit");
    var sf = f.serialize();
    $.post(this.href,
        sf,
        function (response) {
            f.html(response);
        });
    // I need to do something here to update the html table row...
    return false;
});

我认为一个解决方案是调用另一个操作，将只呈现表行元素。我该怎么做呢?

,

表的行是这样创建的:

<tr id="h62">
  <td>Ford</td>
  <td>Focus</td>
</tr>

其中62为该记录的"id"。

可以工作的代码，但是很难看:

$(".form-commands .save").live("click", function () {
    var f = $(".form-edit");
    var sf = f.serialize();
    var handle = $(".form-edit #Handle")[0].value;
    var itemLink = this.attributes["edititem"].value;
    var row = $("#grid #h" + handle);
    $.post(this.href,
        sf,
        function (response) {
            $("#form-edit").html(response);
            $.get(itemLink,
                sf,
                function (response) {
                    row.replaceWith(response);
                });
        });
    return false;
});

您需要这样做:

$(".form-commands .save").live("click", function (evt) {
    //Capture the jQuery event object and call preventDefault() to stop the default click action
    evt.preventDefault();
    var f = $(".form-edit");
    var sf = f.serialize();
    $.post(this.href,
        sf,
        function (response) {
            f.html(response);
        });
    //UPDATE THE ROWS
    $('#h62 td:eq(0)').text(newVehicleMakeName);
    $('#h62 td:eq(1)').text(newVehicleModelName);
});

我不确定从你的代码车辆数据是从哪里来的。如果你将它从控制器传递回来，那么你需要将这一行移到你的成功回调中。

同样，你通常不应该返回false，你应该捕获jQuery事件作为一个参数并调用preventDefault()。如果单击处理程序使用return false来阻止浏览器导航，那么解释器可能无法到达返回语句，浏览器将继续执行锚标记的默认行为。这是什么导致你的问题，而不是因为你使用点击和提交。使用event.preventDefault()的好处是，你可以把它添加到处理程序的第一行，从而保证锚的默认行为不会触发。

我只是重新加载页面或调用ajax例程(无论哪一种适用)来重新加载数据，没有直接的方法可以做到这一点。事实上，我不知道你使用的方法(f.html(响应))，我仍然怀疑这个解决方案:)

如果你真的只想更新那一行:

1)你需要知道知道更新行的id在你的javascript代码。在本例中，该值为"h62"(不带引号)。

2)给你的td类名，例如 
<tr id="h62">
    <td class="brand">Ford</td>
    <td class="model">Focus</td>
</tr>

3)使用jquery更新。假设你将行id保存在名为"rowId"的变量中:

$('#'+rowId).find('.brand').html(response.brand);
$('#'+rowId).find('.model').html(response.model);
相关文章：