我如何将数据从 asp.net mvc 上的事件模糊绑定到 DisplayFor

How I do bind data to DisplayFor from event blur on asp.net mvc

我正在使用事件模糊处理失去对文本框的关注。但是我只绑定数据到textboxfor不能绑定数据到labelfor或displayfor。我该怎么办?

我的java脚本:

$('#PGId').blur(function () {
        var errormsg = "";
        var id = $('#PGId').val();
        $.ajax({
            type: "GET",
            url: '@Url.Action("GetDetailPG", "TimeSheetHeader")',
            data: { pgId: id },
            dataType: "json",
            success: function (data) {
                $("#FirstName").val(data.FisrtName)
                $("#LastName").val(data.LastName)
                $("#Shiff").val(data.ShiffId)
            },
            error: function (jqXHR, exception) {
                $('#error').html("Primitive Functions not allowed.")
            }
        });
    })

我的剃须刀观点:

<div class="col-md-3 form-group">
                @Html.LabelFor(model => model.PGId) <em>( * )</em>
                @Html.TextBoxFor(model => model.PGId, new { @class = "form-control input-sm", @name = "normal" })
                @Html.DisplayFor(model => model.FirstName) @Html.DisplayFor(model => model.LastName)
</div>
<div class="col-md-3 form-group">
                @Html.LabelFor(model => model.Shiff)
                <div>
                    <label class="radio-inline">
                        @Html.RadioButtonFor(model => model.Shiff, "M") Morning
                    </label>
                    <label class="radio-inline">
                        @Html.RadioButtonFor(model => model.Shiff, "N") Night
                    </label>
                </div>
                <span style="color:red" class="help-block">@Html.ValidationMessageFor(model => model.Shiff)</span>
</div>

@Html.DisplayFor() 不会生成具有 id 属性的元素,也不会生成具有 value 属性的控件,因此您不能使用 $("#FirstName").val(data.FirstName)。而是创建一个包含所需 id 的容器元素,并在 ajax 调用中更新其内容(不确定 ShiffId 是什么 - 你没有显示任何 html )

@Html.TextBoxFor(m => m.PGId, new { @class = "form-control input-sm" })
<div id="firstname">@Html.DisplayFor(m => m.FirstName)</div>
<div id="lastname">@Html.DisplayFor(m => m.LastName)</div>

然后在脚本中

success: function (data) {
  $("#firstname").text(data.FirstName)
  $("#lastname").text(data.LastName)
},

另请注意,您应该使用文本框的 change 事件(而不是 blur),以避免在用户只是通过控件切换时对服务器进行不必要的调用。

旁注:您为什么要覆盖 属性 PGId 文本框的 name 属性?

编辑

根据 OP 编辑​​显示 ShiffId 的 html,要更新单选按钮,请向单选按钮添加 class 名称(注意:已添加 class 属性为了更容易选择和添加 id 属性,所以没有重复)

@Html.RadioButtonFor(model => model.Shiff, "M", new { id = "shiff-m", @class = "shiff" })
@Html.RadioButtonFor(model => model.Shiff, "N", new { id = "shiff-n", @class = "shiff" })

并将 $("#Shiff").val(data.ShiffId) 替换为(假设 data.Shiff 将是 "M" 或 "N")

$('.shiff[value="' + data.Shiff + '"]').prop('checked', true);