Pickadate.js将'从''设置为'限制

时间:2018-06-08 12:34:04

标签: javascript jquery date pickadate

大家好,我正在使用pickadate.js为我的项目设置日期,但我遇到了一个问题。我正在添加用于动态选择项目中日期的输入。我为它们设置了from to限制,对于第一组输入,它们工作正常,但对于我动态添加的元素from to日期不起作用。这是我的代码:

HTML:

<h3>Extend <a href="http://http://amsul.github.io/pickadate.js">pickadate v3</a> to get “from” and “to” date functionality.</h3>
<h4>From:</h4>
<fieldset>
  <input type="text" id="input_from" class="input_from">
</fieldset>
<h4>To:</h4>
<fieldset>
  <input type="text" id="input_to" class="input_to">
</fieldset>
<h4>From:</h4>
<fieldset>
  <input type="text" id="input_from" class="input_from">
</fieldset>
<h4>To:</h4>
<fieldset>
  <input type="text" id="input_to" class="input_to">
</fieldset>

和JS:

$('.input_from').pickadate({
    format: 'dd.mm.yyyy',
});

$('.input_to').pickadate({
    format: 'dd.mm.yyyy',
});

var from_$input = $('.input_from').pickadate(),
    from_picker = from_$input.pickadate('picker')

var to_$input = $('.input_to').pickadate(),
    to_picker = to_$input.pickadate('picker')


// Check if there’s a “from” or “to” date to start with.
if ( from_picker.get('value') ) {
  to_picker.set('min', from_picker.get('select'))
}
if ( to_picker.get('value') ) {
  from_picker.set('max', to_picker.get('select'))
}

// When something is selected, update the “from” and “to” limits.
from_picker.on('set', function(event) {
  if ( event.select ) {
    to_picker.set('min', from_picker.get('select'))    
  }
  else if ( 'clear' in event ) {
    to_picker.set('min', false)
  }
})

to_picker.on('set', function(event) {
  if ( event.select ) {
    from_picker.set('max', to_picker.get('select'))
  }
  else if ( 'clear' in event ) {
    from_picker.set('max', false)
  }
})

我尝试使用each()定位我的输入,但它没有帮助。这是codepen,你可以看到发生了什么。基本上我不知道如何定位被点击的this集输入的限制。尝试使用前两个输入和  您将看到限制正常工作,但它们未应用于第二组输入。
https://codepen.io/Karadjordje/pen/KeNRxZ?editors=1010

0 个答案:

没有答案