【问题标题】:jQuery Datepicker onClosejQuery Datepicker onClose
【发布时间】:2017-03-14 22:28:23
【问题描述】:

我有一个按日期过滤数据表的代码。问题是代码可以正常工作,但前提是您使用键盘键入日期而不是像图像一样选择日期:

datePicker problem

如何在 datapicker 中设置 onClose 选项:

    $(document).ready(function(){
        $('#data .input-daterange').datepicker({
            todayBtn: "linked",
            keyboardNavigation: false,
            forceParse: false,
            autoclose: true,
            format: "dd-mm-yyyy",
            onClose: ????????????????
            },
        });

        /* Add event listeners to the two range filtering inputs */
        $('#min, #max').keyup( function() { oTable.draw(); } );
    });

要在使用此代码配置的 dataTables 中使用过滤器吗?

    /* Function for date filter */
    jQuery.fn.dataTableExt.afnFiltering.push(
        function( oSettings, aData, iDataIndex ) {
            var iMin = document.getElementById('min').value;
            var iMax = document.getElementById('max').value;

            var iMinimo_year = iMin.substring(6,10);
            var iMinimo_month = iMin.substring(3,5);
            var iMinimo_day = iMin.substring(0,2);
            var iMinimo = iMinimo_year.concat(iMinimo_month,iMinimo_day);

            var iMaximo_year = iMax.substring(6,10);
            var iMaximo_month = iMax.substring(3,5);
            var iMaximo_day = iMax.substring(0,2);
            var iMaximo = iMaximo_year.concat(iMaximo_month,iMaximo_day);

            var iCol = 5;
            var iDate_year = aData[iCol].substring(6,10);
            var iDate_month = aData[iCol].substring(3,5);
            var iDate_day = aData[iCol].substring(0,2);
            var iDate = iDate_year.concat(iDate_month,iDate_day);

            if ((iMinimo === "" && iMaximo === "") || (iMinimo <= iDate && iMaximo === "") || (iMinimo === "" && iMaximo >= iDate) || (iMinimo <= iDate && iMaximo >= iDate)) {
                return true;
            } else {
                return false;
            }
        }
    );

HTML部分是:

          `<div class="form-group col-md-offset-4" id="data">
                <label class="font-noraml">Seleccione rango de fechas de ingreso de solicitud a filtrar</label>
                <div class="input-daterange input-group" id="datepicker">
                    <input type="text" class="input-sm form-control" name="min" id="min" value="<?php echo date('');?>"/>
                    <span class="input-group-addon">a</span>
                    <input type="text" class="input-sm form-control" name="max" id="max" value="<?php echo date('d-m-Y');?>" />
                </div>
            </div>

`

【问题讨论】:

  • 你能把手动输入日期时执行的代码粘贴到这里吗?
  • 就是上面的代码,除了onClose那一行:

标签: javascript jquery datepicker datatables filtering


【解决方案1】:

我想你在找onSelect

选择日期选择器时调用。该函数接收选定的日期作为文本和 datepicker 实例作为参数。 this 指的是关联的输入字段。

类似的东西

$(document).ready(function(){
    $('#data .input-daterange').datepicker({
        todayBtn: "linked",
        keyboardNavigation: false,
        forceParse: false,
        autoclose: true,
        format: "dd-mm-yyyy",
        onSelect: function(dateVal) {
            alert(dateVal); //Method to call when user picks a date
        },
        onClose: function(dateVal) {
            alert(dateVal); //Method to call when user closes the date picker
        },
    });
});

示例:https://jsfiddle.net/peteniemann/d0u3t25h/

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2020-02-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-11-08
  • 2011-08-23
  • 2013-06-23
相关资源
最近更新 更多