[英]Submit form on change of dropdown list in Semantic UI?
我想在选择元素时提交表单-跳过按下提交按钮。
我尝试使用onchange="this.form.submit()"
,但在这里不起作用。
这是代码:
<form action="" method="get">
<div class="ui floating dropdown labeled search icon button dd">
<input type="hidden" name="nutr_code">
<span class="text">Select nutrient</span>
<div class="menu">
<div class="item" data-value="ca">Calcium</div>
<div class="item" data-value="fe">Iron</div>
<div class="item" data-value="mg">Magnesium</div>
<div class="item" data-value="zn">Zinc</div>
</div>
</div>
<br><br>
<input type="submit" value="Show results">
</form>
因为您使用的是GET方法,所以您可以通过自己构建网址来使用javascript进行重定向。
$('.ui.dropdown').dropdown({
'onChange': function (value, text, $choice) {
location.href = 'http://example.com/?nutr_code=' + value;
}});
第二种选择是使用回调中的值更改输入字段“ nutr_code”,如上所示
$('input[name="nutr_code"]').val(value);
并从js提交<FORM/>
。
$('form').submit();
编辑:第二个选项的示例。
$('.ui.dropdown').dropdown({
'onChange': function (value, text, $choice) {
// Uncomment if semantic is not updating the input before submit.
//$('input[name="nutr_code"]').val(value);
$('form').submit();
}});
您需要在表单标签中定义操作或添加一些方法来提交按钮
<input type="submit" value="Show results" onclick="someFunction()">
如果遵循这种方式,则也需要定义someFunction()。 谢谢
你可以使用jQuery
$(document).ready(function(){
$("input[name='nutr_code']").on('input',function(e){
$("input[type='submit']").trigger( "click" );
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.