Question

我有一个使用Ajax Jquery更新的工作局部视图。

如果我做了一个小的必要更改，则局部视图不再显示返回的视图模型

这是有效的代码。

这是cshtml文件中的代码：

<input type="button" id="EmulatorSubmit" value="Receive UDP Messages" />
<p>
    <h4>Message Received</h4>
    <div id="receivePaneEmulator">
         @Html.Partial("_HttpResponse", Model)
    </div>
</p>

这是我的jQuery：

$('#EmulatorSubmit').click(function (event) {
     if ($(this).val() == "Receive UDP Messages") {
         udpReceiveTimer = setInterval(getUDPMessages, 100);
         $('#EmulatorSubmit').attr('value', 'Stop Receiving UDP Messages');
     } else {
          clearInterval(udpReceiveTimer);
          $('#EmulatorSubmit').attr('value', 'Receive UDP Messages');
          cancelGetUDPMessages();
     }
});

function getUDPMessages() {
     $.ajax({
         url: "@Url.Action("ReceiveUDPMessage", "TestandDevelopment")",
         type: "POST",
         data: $('#UDPSensorForm :input').serialize(),
         datatype: "text",
         success: function (data) {
             $('#receivePaneEmulator').html(data);
         }
     });
};

请注意，此行不执行任何操作：data：$（＆＃39; #UDPSensorForm：input＆＃39;）。serialize（），因为#UDPSensorForm不存在，因为此时我还没有创建它。这很好，不是问题的一部分。

这是我的偏爱：

@model Haptic_Theatre_Vibings_Control.Models.HttpViewModel
@Html.TextAreaFor(m => m.HttpResponse, new { @class = "form-control" , rows = "5" })

这是我的控制器操作：

public ActionResult ReceiveUDPMessage(HttpViewModel httpViewModel)
{
   httpViewModel.HttpResponse = "Hello";
   return PartialView("_HttpResponse", httpViewModel);
}

以上工作正常。我点击了EmulatorSubmit按钮，我得到了＃34; Hello＆＃34;显示在Partial中。

但是，我实际上想从视图中将一些数据发送到Action。所以我添加了一个带有UDPSensorForm ID的Div，它在jQuery中用来收集数据：

修改后的cshtml：

<div id="UDPSensorForm">
    <h4>Port Nunber</h4>
         @Html.TextBoxFor(m => m.HttpPortNumber, new { @class = "form-control input-sm" })
    <p></p>
    <input type="button" id="EmulatorSubmit" value="Receive UDP Messages" />
    <p>
        <h4>Message Received</h4>
        <div id="receivePaneEmulator">
             @Html.Partial("_HttpResponse", Model)
        </div>
    </p>
<    input type="button" id="EmulatorSubmit_Record" value="Record UDP Messages" />
    <p>
        <h4>Activity Note</h4>
        <div id="activityNote">
             @Html.TextAreaFor(m => m.ActivityNote, new { @class = "form-control", rows = "5" })
         </div>
    </p>
</div>

EmulatorSubmit和EmulatorSubmit_Record共享HttpPortNumber中的数据，这就是为什么我没有制作2个表单（它们共享很多其他数据。为了清晰起见，我已经删除了代码）

我为新按钮EmulatorSubmit_Record添加了Jquery和Actions。

EmulatorSubmit的JQuery，Partial和Controller Action没有改变。

现在，当我点击EmulatorSubmit时，我可以看到Action中的模型，它已经拾取了HttpPortNumber。

我可以看到部分视图刷新。

但部分视图不再显示＆＃34; Hello＆＃34;

为什么添加此Div会阻止部分视图正确接收视图模型？

编辑：如果我将部分视图移到div之外，那么＆＃34;你好＆＃34;被展示。尽管我的布局很好： - （

在序列化Div

0 个答案: