如何根据第一个选择值显示其他选择的选项值？ Laravel9-PHP
[英]How can I show option values of other select based on first select value? Laravel9-Php
问题描述
How can I show option values of other select based on first select value?
如何根据第一个选择值显示其他选择的选项值？
<div class="mb-3">
<label for="defaultSelect" class="form-label">Marka Seç</label>
<select id="defaultSelect" class="form-select" name="marka_id">
@foreach($datamarka as $rs)
<option value="{{$rs->id}}">{{$rs->name}}</option>
@endforeach
</select>
</div>
<div class="mb-3">
<label for="defaultSelect" class="form-label">Model Seç</label>
<select id="defaultSelect" class="form-select" name="marka_id">
<option value="">try</option>
</select>
</div>
My controller我的控制器
public function create() {
$data=MModel::all();
$datamarka=Marka::all();
return view('admin.seri.create',['data'=>$data,'datamarka'=>$datamarka,]);
}
2 个解决方案
解决方案1
1 2022-06-18 12:01:48
You can use JavaScript or JQuery event of onselect and get the value or text of the selected dropdown option and use the $.get() or $.post() or $.Ajax() function of JQuery to retrieve value that you want based on the current data provided from the dropdown option.您可以使用 onselect 的 JavaScript 或 JQuery 事件并获取所选下拉选项的值或文本，并使用 JQuery 的 $.get() 或 $.post() 或 $.Ajax() 函数来检索您想要基于的值从下拉选项提供的当前数据。
When the Ajax function retrieves the data from the Controller, You can add it to the dropdown of your choice that you want.当 Ajax 函数从 Controller 检索数据时，您可以将其添加到您想要的下拉列表中。
if it was not clear for you, just let me know to put an example code for you as well.如果您不清楚，请告诉我也为您提供示例代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Get Selected Dropdown value using JQuery OnChange</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<form action="{{ route('admin.save') }}" class="gender">
@csrf
<label>Gender:</label>
<select name='gender' id="select">
<option value='male' >Male</option>
<option value='female' >Female</option>
</select>
<input type='text' id='text'>
</form>
</body>
</html>
<script>
$( "select" ).change(function() {
var val= $(this).val();
$("#text").val(val);
data = { _token: get the token data using jquery selectors
value1 : $(this).val(),
value2 : $('#text').val()
}
$.post($('form.gender').attr('action'), { data }, function
(response, status){
$('select').append(response.data);
}
});
</script>
解决方案2
0 2022-06-18 16:05:48
I wrote this code using the example, it worked for me我使用示例编写了这段代码，它对我有用
function update() { var select = document.getElementById('defaultSelect'); var option = select.options[select.selectedIndex]; //console.log(option.innerHTML)//seçilen marka var model = document.getElementById('defaultSelect1'); var option1 = model.options; for(let i=0;i<option1.length;i++){ if(option.innerHTML!=option1[i].id){ if(option1[i].value!='null'){ console.log(option1[i]) //model.remove(i); option1[i].classList.add('hidden'); } } if(option.innerHTML==option1[i].id){ if(option1[i].value!='null'){ console.log(option1[i]) //model.remove(i); option1[i].classList.remove('hidden'); } } } if(option.value!='null'){ document.getElementById('modeldiv').className='mb-3'; document.getElementById('seridiv').className='mb-3 row'; } }
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.