仅以html格式显示特定搜索条件

Question

我想要一个包含条件字段的表单。这些标准可以是“affaire”或“suite”类型。对于这个选择，我使用下拉列表（见下面的截图）。基于这种类型，我想只显示特定的标准字段。

对于“affaire”类型，我有以下标准：

• Statut affaire
• Libelléaffaire
• Numérod'affaire
• Titre de l'affaire
• Note de l'affaire

对于“套房”类型，我有以下标准：

• Statut suite
• Libellé套房
• Numérodesuite
• Titre de la suite
• Note de la suite

此时，我只在我的表单中显示“affaire”条件字段。像这样：

@using (Html.BeginForm("SearchAffaires", "Search", FormMethod.Post)) { 

    @Html.LabelFor(m => Model.SearchType)
    @Html.DropDownListFor(m => Model.SearchType, Model.Type)

    @Html.LabelFor(m => Model.SearchCriteriaAffaire.IdAffaire)
    @Html.TextBoxFor(m => Model.SearchCriteriaAffaire.IdAffaire)


    @Html.LabelFor(m => Model.SearchCriteriaAffaire.IdStatus)
    @Html.DropDownListFor(m => Model.SearchCriteriaAffaire.IdStatus, Model.Status)

    @Html.LabelFor(m => Model.SearchCriteriaAffaire.Title)
    @Html.TextBoxFor(m => Model.SearchCriteriaAffaire.Title)

    <input type="submit" id="buttonSubmit" value="Submit" />
    <input type="button" id="buttonClear" value="Clear" />

}

第一个DropDownListFor（... Model.Type）用于区分“affaire”或“suite”类型的搜索。我希望能够隐藏“affaire”条件字段，并根据此下拉列表的值显示“套件”条件字段。实现这一目标的最佳方法是什么？

感谢。

Answer 1

我可能只是使用客户端事件处理程序并切换元素的可见性..

$('#searchType').change(function() {
    var value = $('#searchType option:selected').val();
    if (value === 'affaire') {
        $('.affaireCriteria').show();
        $('.suiteCriteria').hide();
    }
    else {
        $('.affaireCriteria').hide();
        $('.suiteCriteria').show();
    }
});

只是示例代码..你可以做更多的事情来使它更优雅。