0

いくつかの入力が空でない場合にのみ「行の追加」リンクを使用できるようにするテーブルに取り組んでいます。私はこれを適応させました(入力フィールドが入力されるまで送信ボタンを無効にします)が、私の場合、私の日付ピッカー(jQuery UIの日付ピッカー)入力は空の場合でも値を持ちます。値が指定されているかどうかに関係なく、datepicker が自動的に値を POST していることをどこかで読みました。これは私の機能の目的を無効にします。

ここに私のマークアップがあります:

<tbody>
    <tr>
        <td class="date"><input class="datepicker" name="date-01" value="" /></td>
        <td class="hours"><input class="hours" name="hours-01" value="" /></td>
        <td class="rate"><input  class="rate" name="rate-01" value="60.00" /></td>
        <td class="date-total"><input class="date-total" name="date-total-01" value="" /></td>
        <td class="add-delete-row">
            <a href="#" class="delete-row" title="Delete row">Delete</a>
            <a href="#" class="add-row" title="Add a row">Add Row</a>
        </td>
    </tr>
</tbody>

...そして関連するjs:

// 1. Datepicker options/format:
$('.datepicker').datepicker( {
    changeMonth: true,
    changeYear: true,
    dateFormat: "yy-mm-dd",
}); // END Datepicker

    checkRow();
    $('.hours-table').on('blur', 'input', checkRow); // same results using either keyup or change; apparently empty datepicker input has a value
    });

function checkRow() {
    //if (  $('input.datepicker').not(':empty') &&
    if (    $('input.datepicker').val().length > 0 &&
            $('input.hours').val().length > 0 &&
            $('input.rate').val().length > 0 &&
            $('input.date-total').val().length > 0  ) {
        $('.add-row').show();
        alert ($('input.datepicker').val());
    }
    else {
        $('.add-row').hide();
    }
}

私はjsfiddle(jsfiddle http://jsfiddle.net/sheckyvansheck/4HPfe/27/)をセットアップしましたが、datepickerを機能させることができず、もちろん価値がありません。

どんな提案でも大歓迎です。

乾杯、svs

4

1 に答える 1

0

ドー!私がローカル サーバーで作業しているバージョンでは、「時間」テーブルの前に別の日付ピッカー入力があります。したがって、私の checkRow 関数には次のセレクターが必要でした。

function checkRow() {
if ($('.hours-table input.datepicker').val().length > 0 && ...
于 2013-09-30T18:45:21.260 に答える