laravel 5の従属ドロップダウンを試してみたいです。 （エレクトロニクス、自動車）のようないくつかのリストを持つメインドロップダウンで、その1つからイベントをクリックまたは変更します。 別の完全なドロップダウンを作成したいと思います。 エレクトロニクスをクリックした場合、エレクトロニクス用に自動的にドロップダウンが作成されます。laravelのドロップダウンリストを作成するexistnigドロップダウンリスト
enter image description here 最初のドロップダウンリストからエレクトロニクスをクリックすると、その時点で別のドロップダウンリストが自動的に生成されます。 より、最初のドロップダウンリストからAutomobilesをクリックした場合よりも、電子機器用に最後に自動的に作成されたドロップダウンを置き換える必要があります。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dependent Drop-down Demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<h1>Dependent Drop-down Demo</h1>
<div class="container">
{!! Form::open(['url'=>'Demo'] ) !!}
<div class="dropdown">
<select name="category" id="category" class=" form-control">
<option value=" "selected disabled>Select Category</option>
@foreach($categories as $category)
<option value='{{ $category->id }}' > {{$category->name}} </option>
@endforeach
</select>
<select hidden name="subcategory" id="subcategory" class=" form-control">
</select>
<select hidden name="semicategory" id="semicategory" class=" form-control">
</select>
</div>
{!! Form::close() !!}
</div>
<script>
$("#category").on('change', function(e){
alert("test");
console.log(e);
$("#semicategory").hide();
$("#subcategory").show();
var category_id = e.target.value;
var s = $('<select />');
//ajax
$.get('/index?category_id=' + category_id, function(data){
console.log(data);
$("#subcategory").empty();
$.each(data, function(index, subcatObj){
$("#subcategory").append('<option value ="'+ subcatObj.id +'">'+subcatObj.name+'</option>');
});
});
});
$("#subcategory").on('change', function(e){
alert("hello");
console.log(e);
$("#semicategory").show();
var subcategory_id = e.target.value;
//ajax
$.get('/index1?subcategory_id=' + subcategory_id, function(data){
console.log(data);
$("#semicategory").empty();
$.each(data, function(index, subcatObj1){
$("#semicategory").append('<option value ="'+ subcatObj1.id +'">'+subcatObj1.name+'</option>');
});
});
// $("#subcategory").hide();
});
</script>
</body>
</html>
いくつかのコードを追加して、最終結果として達成したいことを説明してください。 – TheFallen