在下拉选项上,我想监听并获取用户选择的选项的值。
然后我想将此值传递给 PHP 变量,以便在 Blade View PHP 脚本的后面部分中使用。
我不想重新加载页面,因此从网上看,我发现ajax是唯一可能的方法。
我尝试按如下所示实现,但在提交时加载页面时遇到了障碍。
更好的是,是否可以有一个选择选项下拉,您无需提交即可获取所选值?
我选择的选项代码:
<form id="myForm">
<div class="button dropdown">
<select name="languageSelected" required="required" id="languageselector" onChange='showSelected(this.value)'>
<option value="">Pick A language</option>
@foreach($reviewForm_language as $lang)
<option value="{{$lang->id}}">{{$lang->name}}</option>
@endforeach
</select>
</div>
<input id="ajaxSubmit" type="submit" value="Select"/>
</form>
我的JS代码:
<script>
jQuery(document).ready(function(){
jQuery('#ajaxSubmit').click(function(e){
e.preventDefault();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
}
});
jQuery.ajax({
url: "{{ url('#') }}",
method: 'post',
data: {
id: jQuery('#languageSelected').val(),
},
success: function(result){
jQuery('.alert').show();
jQuery('.alert').html(result.success);
}});
});
});
</script>
重新加载时,我可以通过 GET 请求获取该值,如下所示;但是,我不想重新加载页面,但由于某些原因它确实会重新加载。
`<?php
$langId = request()->get('languageSelected');
?>`
有人吗?
最佳答案
试试这个 -
更改 type="button"而不是提交
输入 id="ajaxSubmit"type="button"value="选择"
2.不需要$.ajaxSetup
。从 $.ajaxSetup
复制 header 并移至 url 上方(在 jQuery.ajax({
) 内)
- 您正在正确地做其他事情。现在只需在 Controller 中检查是否使用 var_dump(
$request->all()
) 在 post 参数中获取id
关于javascript - Ajax 调用以获取从 HTML 选择选项中选择的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54593509/