0

Web サイトの行ごとに 2 つの入力と 1 つのドロップダウンを取得しました。
きちんと説明することです。

入力を取得しました：「開始」と「終了」で店舗の営業時間を設定し、その日が「完全に閉まっている」か「24時間営業」かを選択するドロップダウン。そして、これはその週の毎日です。

ドロップダウンの選択によっては、入力フィールドを無効にしたい。したがって、「クローズド」を選択すると、「開始」と「終了」の 2 つのフィールドが無効になりますが、すべての日ではなく、その日だけ無効になります。

私の試み
は、選択に基づいてすべての「開始」/「終了」入力を無効にして有効にすることができました。

JS: 

<script>
$(document).ready(function() {
    var $dropdown = $('.dropdown_time'),
    $time = $('.timepicker');
    $dropdown.change(function() {
    if ($dropdown.val() != '1') {
        $time.removeAttr('disabled');
    } else {
        $time.attr('disabled', 'disabled').val('');
    }
    }).trigger('change'); // added trigger to calculate initial state
});
</script>

HTML (「2 日」に短縮: 

<div class="row">
    <label for="store_tuesday" class="right inline">Dienstag:</label>
    <input type="text" class="timepicker" placeholder="Von">
    <input type="text" class="timepicker" placeholder="Bis">
    <select name="store_opening_tuesday" id='customDropdown' class='medium dropdown_time'>
        <option value="1">Ruhetag</option>
        <option value="2">24 Std.</option>
        <option value="3" selected="selected">-</option>
    </select>   
</div>
<div class="row">
    <label for="store_wednesday" class="right inline">Mittwoch:</label>
    <input type="text" class="timepicker" placeholder="Von">
    <input type="text" class="timepicker" placeholder="Bis">
    <select name="store_opening_wednesday" id='customDropdown' class='medium dropdown_time'>
        <option value="1">Ruhetag</option>
        <option value="2">24 Std.</option>
        <option value="3" selected="selected">-</option>
    </select>   
</div>

目標:
行ごとのドロップダウンは、他の行ではなく、「彼」の行の入力を無効/有効にするだけです。これは可能ですか？

4

1 に答える 1

0

各行を個別に構成する必要があります。コードを使用すると、次のようになります。

<script>
    $(document).ready(function() {
        $('.row').each(function(){
            var $dropdown = $(this).find('.dropdown_time'),
            $time = $(this).find('.timepicker');
            $dropdown.change(function() {
                if ($dropdown.val() != '1') {
                    $time.removeAttr('disabled');
                } else {
                    $time.attr('disabled', 'disabled').val('');
                }
            }).trigger('change'); // added trigger to calculate initial state
        });
    });
</script>
于 2013-03-24T15:06:21.213 に答える