У меня есть онлайн-форма, которую кандидаты должны заполнить. Некоторые из вариантов - проверить, подаются ли они как многосторонние или двусторонние, и я не уверен, как это сделать в ASP.NET MVC?

Я знаю, что мне нужно закодировать его таким образом, чтобы, когда один из них был проверен, другой не был отмечен (т.е. установил для другого значение false, когда один из них проверен)

Я попытался сделать это, используя идентификатор в файле create.cshtml, а затем включил некоторый код в контроллер, но не работал, потому что я не уверен, как включить атрибуты (?).

Не могли бы вы мне помочь? Я уверен, что это просто я новичок, и это не так уж и сложно.

Ниже со страниц бритвы

 <div class="form-group">
            @Html.LabelFor(model => model.Multilateral, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <div ID="chkMu" oncecheckedchanged="chkMu_CheckedChanged" class="checkbox">
                    @Html.EditorFor(model => model.Multilateral)
                    @Html.ValidationMessageFor(model => model.Multilateral, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Bilateral, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <div ID="chkBi" oncecheckedchanged="chkBi_CheckedChanged" class="checkbox">
                    @Html.EditorFor(model => model.Bilateral)
                    @Html.ValidationMessageFor(model => model.Bilateral, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>

Ниже от контроллера

protected void chkBi_CheckedChanged(object sender, EventArgs e, object chkMu)
{
    chkMu.Checked = false;
}

protected void chkMu_CheckedChanged(object sender, EventArgs e, object ckhBi)
{
    chkBi.Checked = false;
}

Я также нашел в Интернете код, который предлагал написать его на javascript и использовать jQuery, но я до сих пор не знаю, как его реализовать. Ниже приведен код

$('div .checkbox').click(function () {
    var checkedState = $(this).prop("checked")
    $(this)
        .parent('div')
        .children('.checkbox:checked')
        .prop("checked", false);

    $(this).prop("checked", checkedState);
});

Очень признателен за любую помощь!

0
user13614973 10 Фев 2021 в 17:56

1 ответ

Лучший ответ

Вот рабочая демонстрация с jquery:

Посмотреть:

<form asp-action="Create" asp-controller="Lead">
    <div class="form-group">
        @Html.LabelFor(model => model.Multilateral, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            <div oncecheckedchanged="chkMu_CheckedChanged" >
                <input type="checkbox" id="chkMu" name="chkMu"/>
                @Html.EditorFor(model => model.Multilateral)
                @Html.ValidationMessageFor(model => model.Multilateral, "", new { @class = "text-danger" })
            </div>
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Bilateral, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            <div oncecheckedchanged="chkBi_CheckedChanged">
                <input type="checkbox" id="chkBi" name="chkBi"/>
                @Html.EditorFor(model => model.Bilateral)
                @Html.ValidationMessageFor(model => model.Bilateral, "", new { @class = "text-danger" })
            </div>
        </div>
    </div>
    <input type="submit" />
</form>

Jquery:

@section scripts{

    <script>
        $("input[type='checkbox']").click(function () {
            if (this.checked&&this.id == "chkMu")
            {
                $('#chkBi').prop('checked', false);
            } else if (this.checked && this.id == "chkBi")
            {
                $('#chkMu').prop('checked', false);
            }
        })
    </script>
}

Результат: введите описание изображения здесь

1
Yiyi You 11 Фев 2021 в 09:31