選択したリストの後にあるすべてのリストを削除したいという問題で立ち往生しています。ここでJSFiddleを作成しましたが、機能しません。たとえば、最初のドロップダウンからアイテムを選択した場合は次の2つを削除する必要があり、2番目のドロップダウンから選択した場合は3番目のドロップダウンを削除する必要があります。
HTML
<div id='levels'>
<select id="level" class="parent" name="data[level][]">
<option value="1">1</option>
<option value="2">2</option>
</select>
<select id="level" class="parent" name="data[level][]">
<option value="3">3</option>
<option value="4">4</option>
</select>
<select id="level" class="parent" name="data[level][]">
<option value="5">5</option>
<option value="6">6</option>
</select>
</div>
Javascript
$("#levels").on('change', function() {
$(this).nextAll().remove();
});
各リストに異なるクラス名またはdiv名を割り当てずにこれを実現したいと思います。
Cakephpコード
マスターファイル
<script type="text/javascript">
$(document).ready(function() {
$("select").on('change', function() {
$(this).nextAll('select').remove();
$("<div>").load('/dashboard/details/show_levels',function() {
$("#levels").append($(this).html());
});
})
<div id=levels>
<?php echo $form->input('level',array('options'=>$level,'type'=>'select','scroabble'=>true,'multiple'=>true, 'class'=>'parent')); ?>
</div>
});
show_levels
<?php
$abc=array('a','b','c','d');
echo $form->input('level',array('options'=>$abc,'type'=>'select','scroabble'=>true,'multiple'=>true, 'class'=>'parent')); ?>
アップデート:
次のソリューションは私のために働いた
交換済み
$(this).nextAll('select').remove();
と
$(this).parents().nextUntil().remove();
それがどのように機能したか、そして2つの違いは何であるかわからない。