Question

JQuery新手，我有以下功能。我正在尝试修改它，因此它做了两件事：当我点击其他单选按钮时不触发该功能（我想＆＃39; #UpdateType输入[type =＆＃34; radio＆＃34;]＆＃39;会做这个）并且还在加载和点击时运行该功能。 #UpdateType是我使用它的单选按钮的ID。有没有人有任何建议？

$(document).ready(updateTypeFunc);
$(document).ready(function () {
    $('#UpdateTypeRB input[type="radio"]').click(updateTypeFunc);
});
function updateTypeFunc()
{
    if ($(this).attr('id') == 'UpdateType' && $(this).val() == 'Current') {
        $('.current-employee').show();
    }
    else {
        $('.current-employee').hide();
    }
}

截至目前，当我点击任何单选按钮时，无论ID如何，它都会触发。

修改：HTML

<div class="col-md-10" id="UpdateTypeRB">
    <label class="radio-inline">
        <input class="btn btn-primary" data-val="true" data-val-required="Please select whether the employee is new or current." id="UpdateType" name="UpdateType" type="radio" value="New"> New
    </label>
    <br>
    <label class="radio-inline">
        <input checked="checked" class="btn btn-secondary" id="UpdateType" name="UpdateType" type="radio" value="Current"> Current
    </label>
    <br>
    <span class="field-validation-valid text-danger" data-valmsg-for="UpdateType" data-valmsg-replace="true"></span>
</div>

剃刀：

<div class="form-group">
    @Html.LabelFor(m => m.UpdateType, new { @class = "col-md-2 control-label" })
    <div class="col-md-10">
        <label class="radio-inline">
            @Html.RadioButtonFor(m => m.UpdateType, "New", new { @class = "btn btn-primary" }) New
        </label>
        <br />
        <label class="radio-inline">
            @Html.RadioButtonFor(m => m.UpdateType, "Current", new { @class = "btn btn-secondary" }) Current
        </label>
        <br />
        @Html.ValidationMessageFor(m => m.UpdateType, "", new { @class = "text-danger" })
    </div>
</div>

编辑2：感谢@KristianBarrett更新了JQuery。除了$（文件）之外的作品。我试图实现。

我总体上试图实现的是基于此单选按钮勾选隐藏/显示页面上的某些必需元素。它最初加载时没有选中，因此用户被迫选择一个。然后，我使用Foolproof根据这些复选框（＆＃39;当前＆＃39;勾选）执行RequiredIf，并希望在“当前＆＃39;之后”向用户显示它们。用JQuery勾选。问题是当验证在提交后抛出ErrorMessage时，仍然勾选当前复选框，但是在我再次手动单击它之前，这些字段是隐藏的。默认情况下隐藏字段。

Answer 1

要在加载时触发，请尝试：

        //Reading from a OpenXml Excel file (2007 format; *.xlsx)
        IExcelDataReader excelReader = ExcelReaderFactory.CreateOpenXmlReader(stream);

        // DataSet - Create column names from first row
        excelReader.IsFirstRowAsColumnNames = true;
        DataSet result = excelReader.AsDataSet();

        while (excelReader.Read())
        {    // Reading from row and get columns by index           
            var test = excelReader.GetString(1);

        }

Answer 2

您需要选择两个选项：

<div class="form-group">
@Html.LabelFor(m => m.UpdateType, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
    <label class="radio-inline">
        @Html.RadioButtonFor(m => m.UpdateType, "New", new { @class = "btn btn-primary new" }) New
    </label>
    <br />
    <label class="radio-inline">
        @Html.RadioButtonFor(m => m.UpdateType, "Current", new { @class = "btn btn-secondary current" }) Current
    </label>
    <br />
    @Html.ValidationMessageFor(m => m.UpdateType, "", new { @class = "text-danger" })
</div>

然后，您可以将@checked = true应用于您希望在页面加载时单击的单选按钮。喜欢这个

@Html.ValidationMessageFor(m => m.UpdateType, "", new { @class = "text-danger", @checked = true })

当您将值绑定到模型上的两个不同值时，服务器将解析所选的值，并在返回视图后正确设置它们。

之后你需要应用stweb给你的答案，但你需要查找已选中的答案。

所以你应该这样做：

$(document).ready(function () {
    $('input[type="radio"]').click(function () {
        clickFunc($(this));   
    }); 
    clickFunc($('input[type=radio]:checked'));
});

function clickFunc($element){
    var currentEmployee = $('.current-employee');
    if ($element.attr('class').indexOf('current') !== -1) {
        currentEmployee.show();
    }
    else {
        currentEmployee.hide();
    }
}

每次页面运行时都需要重新应用javascript。因此，您迭代复选框并找到已选中的复选框并单击它。

$('input[type=radio]:checked')

这将为您提供已选中的单选按钮。然后，您可以将其传递给$(document).ready()

上的clickFunc

编辑：

您正在做的另一件事是对某些特定ID进行硬编码。你应该更普遍地思考。就像选择所有单选按钮然后找到已选中的按钮一样。当您更改模型的ID时，这会使您的代码更不容易出错。您可以制作代码的次数越多，维护的次数就越少。

JQuery函数 - 针对特定单选按钮

2 个答案: