如何根据单选按钮选择将输入字段更改为Datepicker?

时间:2019-09-13 16:05:08

标签: asp.net-mvc

我有一个输入字段,它接受用户输入的字符串。它根据单选按钮查找字符串。 Pic of Form

基本上,如果选择了DOB或DOJ单选按钮,我希望该输入字段变成日期选择器。

这是我当前的视图

<div class="row">
    <div class="col-md-4">
        <form asp-action="Find">

            @Html.TextBoxFor(m => m.input)<br />
            @Html.RadioButtonFor(m => m.radio, "ID")<aspan>ID</aspan><br />
            @Html.RadioButtonFor(m => m.radio, "FirstName")<aspan>First Name</aspan><br />
            @Html.RadioButtonFor(m => m.radio, "LastName")<aspan>Last Name</aspan><br />

            @Html.RadioButtonFor(m => m.radio, "DOB")<aspan>DOB</aspan><br />

            @Html.RadioButtonFor(m => m.radio, "DOJ")<aspan>DOJ</aspan><br />
            @Html.RadioButtonFor(m => m.radio, "Phone")<aspan>Phone</aspan><br />
            @Html.RadioButtonFor(m => m.radio, "Email")<aspan>Email</aspan><br />
            <div class="form-group">
                <input type="submit" value="Find" class="btn btn-default" />
            </div>
        </form>
    </div>
</div>
<div>

1 个答案:

答案 0 :(得分:0)

首先,您不应以这种方式使用@ Html.RadioButtonFor。它将生成具有相同ID的所有输入。那样不好,因为规范ID应该是唯一的。

执行此操作(为每个输入提供不同的 id

lib.dynamicContent = COA
lib.dynamicContent {
    5 = LOAD_REGISTER
    5 {
        colPos.cObject = TEXT
        colPos.cObject {
            field = colPos
            ifEmpty.cObject = TEXT
            ifEmpty.cObject {
                value.current = 1
                ifEmpty = 0
            }
        }
        pageUid.cObject = TEXT
        pageUid.cObject {
            field = pageUid
            ifEmpty.data = TSFE:id
        }
        contentFromPid.cObject = TEXT
        contentFromPid.cObject {
            data = DB:pages:{register:pageUid}:content_from_pid
            data.insertData = 1
        }
    }
    20 = CONTENT
    20 {
        table = tt_content
        slide = -1
        slide.if.isTrue.field = slide
        select {
            includeRecordsWithoutDefaultTranslation = 1
            orderBy = sorting
            where = {#colPos}={register:colPos}
            where.insertData = 1
            pidInList.data = register:pageUid
            pidInList.override.data = register:contentFromPid
        }
    }
    90 = RESTORE_REGISTER
}

第二,您需要使用JavaScript来实现目标。 我要使用JQuery,但也可以不使用它。使用更改方法,以便您在用户每次更改时获得单选按钮的选定值。然后,您可以使用 .prop()更改输入类型。

<f:cObject>