Question

我正在制作一个表格，我希望“添加行”链接仅在多个输入非空时才可用。我已经改编了这个（Disable Submit button until Input fields filled in）但是在我的情况下，我的datepicker（即jQuery UI datepicker）输入即使在它为空时也具有值。我在某处读到，无论是否指定了值，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

Answer 1

DOH！在我一直在我的本地服务器上工作的版本中，还有另一个datepicker输入，它位于'hours'表之前。我的checkRow函数需要以下选择器：

function checkRow() {
if ($('.hours-table input.datepicker').val().length > 0 && ...

尽管出现空白，但Datepicker仍具有价值

1 个答案: