对于这个措辞不好的头衔感到抱歉。我真正想知道的是一个如下形式:
<form id="searchform" action="/calbase" method="get" accept-charset="utf-8">
<select name="search_type">
<option value="asset_number">Asset #</option>
<option value="calibrated_by">Calibrated by</option>
<option value="department">Department</option>
<option value="description">Description</option>
<option value="expiring_soon">Expiring soon</option>
<option value="flagged">Flagged</option>
<option value="manufacturer">Manufacturer</option>
<option value="model">Model</option>
<option value="serial #">Serial #</option>
<option value="test">Test</option>
</select>
<input class="searchfield" id="searchbox" name="q" type="text" placeholder="Search">
<button class="searchbutton" type="submit">
<i class="fa fa-search"></i>
</button>
</form>
我有search_type的select小部件和search_content(q)的searchfield。对于某些search_type,比如部门和测试,我希望search_content使用下拉选择窗口小部件,用户可以选择要搜索的部门(从列表中)。并且即将到期,search_content应该是不可编辑的。
有没有简单的方法来实现这个目标?
答案 0 :(得分:0)
不确定我是否理解正确,但我认为最好使用JavaScript。
如果您的部门列出&#34;不是很长,只需渲染用户可以看到的所有selects
,然后直观地隐藏它们(在他们的DOM display: none
上使用id
)。
当用户选择search_type
列表中的相应字段时,请显示相关的select
元素并隐藏input[type="text"]
元素。