結合日期選擇器

所以我有這個問題，我有帶班日期時間輸入，我真的結合日期選擇它，用：結合日期選擇器

$(".date-time").datepicker();

一切工作正常，在卡爾蒂克過濾後網格視圖，因爲它假定日期選擇器得到解除綁定（因爲pjax重載）。我真的想再次綁定它，有：

$(document).on("pjax:success", function() { 
    $("#calendartasksearch-starttime").datepicker(); 
});

和我真的得到無限循環~~

我的網格視圖配置：

<?= GridView::widget([ 
    'dataProvider' => $dataProvider, 
    'filterModel' => $searchModel, 
    'pjax' => true,  
    'pjaxSettings' => 
     [ 
      'neverTimeout'=>true, 
      'options'=>['id'=>'pjax-data'], 
      'loadingCssClass' => false, 
     ], 
    'bootstrap' => true, 
    'condensed' => true, 
    'responsive' => true, 
    'showFooter' => true, 
    'hover' => true, 
    'showPageSummary' => true, 
    'resizableColumns' => false, 
    'columns' => $columns, 
    ]);

色譜柱的輸入濾波器：

[ 
'label' => 'Task Start', 
'headerOptions' => ['style' => 'text-align: center;'], 
'attribute' => 'startTime', 
'filter' => Html::activeInput('text', $searchModel, 'startTime', ['style' => 'text-align: center', 'class' => 'form-control date-time']),  
'value' => 'startTime', 
'contentOptions' => ['style' => 'text-align: center; vertical-align: middle;' ], 
],

編輯。

確定我設法擺脫無限循環使用：

$(document).one("pjax:success", function() { 
    $(".date-time").datepicker(); 
});

但我仍可以重新啓動插件

來源

2016-03-08 fsn

好吧，我解決它自己。

首先問題是你不能在ajax刷新後重新啓動兩個.datepicker，它只是進入無限循環[即使你有每個元素的分隔名+ id + class]。

，我解決了這一問題的方法是：

發起一個文件與窗口小部件和第二與activeInpute，象下面這樣：

  [ 
      'label' => 'Task Start', 
      'headerOptions' => ['style' => 'text-align: center;'], 
      'attribute' => 'startTime', 
      'filter' => DatePicker::widget(['model' => $searchModel, 'attribute' => 'startTime', 'dateFormat' => 'yyyy-MM-dd', 'options' => ['id' => 'date-time2','style' => 'text-align: center', 'class' => 'form-control']]), 
      'value' => 'startTime', 
      'contentOptions' => ['style' => 'text-align: center; vertical-align: middle;', 'class' => 'datepicker' ], 
     ], 
     [ 
      'label' => 'Task End', 
      'headerOptions' => ['style' => 'text-align: center;' ], 
      'attribute' => 'endTime', 
      'filter' => Html::activeInput('text', $searchModel, 'endTime', ['style' => 'text-align: center', 'id' => 'date-time', 'class' => 'form-control']), 
      'value' => 'endTime', 
      'contentOptions' => ['style' => 'text-align: center; vertical-align: middle;' ], 
     ],

在起始I initaite日期選取器在有效輸入與：

$(document).ready(function(){ 
    $("#date-time").datepicker({ 
     dateFormat:"yy-mm-dd", 
     orientation: "bottom auto" 
    }); 
});

AJAX刷新後我重新開始都datepickers有：

$(document).on("pjax:success", function(){ 
    $("#date-time, #date-time2").datepicker({ 
     dateFormat:"yy-mm-dd", 
     orientation: "bottom auto" 
     }); 
});

如果anoyone知道更好的方法來做到這一點，請詳細說明。

來源

2016-03-09 08:49:54 fsn

結合日期選擇器

回答

相關問題