回发后Javascript动作改变

Javascript action changes after postback

本文关键字：改变 Javascript      更新时间：2023-09-26

我有一个Javascript，当选中TrainingRequired复选框以显示两个提交按钮时触发。当未选中时，将显示一个提交按钮。问题是，当我选中复选框并尝试在一个必填字段中提交没有数据的表单时，通过回发返回错误消息。复选框保持选中状态，两个按钮不再显示。如何在回发错误消息后保持两个按钮可见?

HTML标记:

<tr>
    <td>
        <label for="trainingRequired">
            Training Required?*</label>
    </td>
    <td>
            @Html.CheckBox("trainingRequired", Page.TrainingRequired, new { id = "chkImmediate" })
    </td>
</tr>
<tr id="allowSelfTrainingBlock">
    <td>
        <label for="allowSelfTraining">
            Allow Self Training?</label>
    </td>
    <td>
                @Html.CheckBox("allowSelfTraining", Page.AllowSelfTraining)
    </td>
</tr>

RegularButton和RequiredButton块:

<div id="RegularButton">
<input name="btn" type="submit" id="notrequired" value="Save" />
<a href="@Page.ReturnUrl" id="notrequiredurl">Cancel</a>
</div>
<div id="RequiredButton">Create New Training Document?<br />
<input name="yesbtn" type ="submit" id="required" value="Yes" />
<input name="nobtn" type="submit" id="required2" value="No & Save" />
<a href="@Page.ReturnUrl" id="requiredurl">Cancel</a>
</div>

同一页面上的Javascript:

<script type="text/javascript">
function prepareButtons() {
    document.getElementById("RequiredButton").style.display = "none";
    document.getElementById("RegularButton").style.display = "block";
}
//**********PostBack*************
function postBack(val) {
    $('#xtravar').val(val);
    $('form').submit();
}
$("#chkImmediate").change(function() {
    if(this.checked) {
        document.getElementById('allowSelfTrainingBlock').style.visibility = 'visible';
        document.getElementById("RequiredButton").style.display = "block";
        document.getElementById("RegularButton").style.display = "none";
    }
    else {
        document.getElementById('allowSelfTrainingBlock').style.visibility = 'hidden';
        document.getElementById("RequiredButton").style.display = "none";
        document.getElementById("RegularButton").style.display = "block";
    }
});
window.onload = function () {
    prepareButtons();
}

在回发错误消息后，如果我取消选中并选中TrainingRequired复选框，我可以得到两个显示的按钮。但是我真的希望这两个按钮在回发后显示一个错误消息。谢谢。

由于页面将在回发后重新绘制，因此窗口。Onload将再次被调用。因此，您需要设置一个条件来检查是否发生了错误。因为你使用MVC，你可以在控制器中创建一个ViewBag道具，并在发生错误时设置它。如下所示

在控制器中,

public ActionResult Validate()
{
  if(Error)
  ViewBag.isError = true;
  return View();
}
在Js 

window.onload = function () {
    var error = '@ ViewBag.isError';
    if(error != 'true')
     prepareButtons();
}
相关文章：