0

データベースからのデータのリストがあります。jQuery を使用して、このデータを 2 つのドロップダウンに入力しています。

ただし、ユーザーが最初のチームを選択すると、2 番目のチーム リストのみが表示されます。それ以外の場合は表示されません。

ユーザーが最初のチームを選択すると、そのチーム ID は 2 番目のリストから削除されますが、ユーザーが最初のチームをその ID に変更すると、再度追加できます。

コードは次のとおりです。

<div class="span6">
    <select data-placeholder="Select Team 1" class="chzn-select team1" tabindex="6" name="team1">
        <option value=""></option>
        <?php 
            foreach($teams AS $t) {
                echo '<option value="'.$t->team_id.'">'.$t->team_name.'</option>';
            } 
        ?>
     </select>      
</div>
<div class="span6">
    <select data-placeholder="Select Team 2" class="chzn-select team2" tabindex="6" name="team2">
        <option value=""></option>
        <?php           
            foreach($teams AS $t) {
                echo '<option value="'.$t->team_id.'">'.$t->team_name.'</option>';
            } 
        ?>
    </select>
</div>

私が使っているjqueryはこちらです。

$(".chzn-select").chosen();
4

2 に答える 2

1

http://jsfiddle.net/zDpAj/でデモを確認することもできます。

    var allteam = $('#team2').html(); 
    $('select#team1').change(function() {     
    var team1 = $('#team1').val();     
    if(team1==="")         
       $('#team2').hide();     
    else     
    {
            $('#team2').show(); 
            $('#team2').html(allteam);
            $("#team2 option[value='"+team1+"']").remove(); 
    }
     });
于 2013-06-19T11:52:49.650 に答える
0

各オプションに ID を追加し、2 番目のドロップダウンからその要素を削除することをお勧めします。次のようにループを変更します。

<?php 
            foreach($teams AS $t) {
                echo '<option id="team-'.$t->team_id.'" value="'.$t->team_id.'">'.$t->team_name.'</option>';
            } 
        ?>

次に、最初のチームを選択するときに、これを使用して 2 番目のドロップダウンから要素を削除します。

var team1Id = $(".team1:selected").attr('id');
$(".team2 #"+team1Id).remove();
于 2013-06-19T11:48:40.037 に答える