I'm trying to force the CJuiDatepicker to hide after I select the date. Nothing works. How could I achieve it?
Here's my actual code:
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'model' => $model,
'attribute' => 'confirmStart',
'options' => array(
'format' => 'yyyy-mm-dd',
'showButtonPanel' => false,
'onSelect' => 'js:function() {
$("#Projects_confirmStart").datepicker("hide");
}
',
),
));
It is working fine in my test Yii app. Check your program with mozilla firebug. You may get error in console when you select the date. May be your datepicker functionality is effecting by some other plugins/scripts.
This work for me.
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'model' => $model,
'attribute' => 'fechaAdq',
'language' => 'es',
'i18nScriptFile' => 'jquery-ui-i18n.min.js',
'htmlOptions' => array(
'id' => 'FMAIDetalleAdq_fechaAdq',
'size' => '10', * *'onChange' => 'jQuery("#FMAIDetalleAdq_fechaAdq").datepicker("hide")' * *
) ,
'defaultOptions' => array(
'showOn' => 'focus',
'showOtherMonths' => true,
'selectOtherMonths' => true,
'changeMonth' => true,
'changeYear' => true,
'showButtonPanel' => true,
) ,
'options' => array(
'showAnim' => 'fold',
'format' => 'dd-mm-yyyy',
'language' => 'es',
) ,
) , true);
Related
$this->widget('zii.widgets.jui.CJuiDatePicker',array(
'name'=>'date_from',
'id' => 'date_from',
//'value'=> date('d/m/Y',strtotime($date_from)),
'options'=>array(
'dateFormat' =>'dd/mm/yy',
'altFormat' =>'dd/mm/yy',
'changeMonth' => true,
'changeYear' => true,
'showAnim'=>'slide',
'showButtonPanel'=>true,
),
'language' => 'en-GB',
'htmlOptions'=>array(
'class'=>'form-control'
),
));
This is the code for the date picker so I want the user to view the date in the following format: dd/mm/yy. I want it seperated with slashes.
This works in Yii 1.20 with JQuery 1.11.2 I added additional parameters just as reference.
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'model' => $model,
'attribute' => 'date_from',
'language' => 'en',
'options' => array(
'showAnim' => 'fold',
'dateFormat' => 'yy/mm/dd',
'showOtherMonths' => true,
'selectOtherMonths' => true,
'changeYear' => true,
'changeMonth' => true,
'yearRange' => "2000:2020",
'showWeek' => false,
'firstDay' => 1
),
'htmlOptions' => array(
'size' => '10',
'maxlength' => '10',
'class' => 'form-control'
)
));
I have created a Magento Admin Grid and am using Mass Action to set the start and stop dates.
Now my Mass Action runs as chosen in dropdown list select start or stop datepicker box will show after select first box.
Can I show two boxes at same time (dropdown list and datepicker) or select date before dropdown list?
My code:
$this->getMassactionBlock()->addItem('setstartdate', array(
'label' => $this->__('Set Start Date'),
'url' => $this->getUrl('*/*/massSetstartdate', array('' => '')),
'confirm' => $this->__('Are you sure?'),
'additional' => array(
'setstartdate' => array(
'name' => 'setstartdate',
'time' => true,
'input' => 'datetime',
'type' => 'datetime',
'class' => 'required-entry',
'label' => Mage::helper('setcustomdate')->__('Set start Date'),
// 'gmtoffset' => true,
'image' => '/skin/adminhtml/default/default/images/grid-cal.gif',
'format' => 'yyyy-MM-dd H:mm:ss'
)
)
));
$this->getMassactionBlock()->addItem('setstopdate', array(
'label' => $this->__('Set Stop Date'),
'url' => $this->getUrl('*/*/massSetstopdate', array('' => '')),
'confirm' => $this->__('Are you sure?'),
'additional' => array(
'setstopdate' => array(
'name' => 'setstopdate',
'time' => true,
'input' => 'datetime',
'type' => 'datetime',
'class' => 'required-entry',
'label' => Mage::helper('setcustomdate')->__('Set Stop Date'),
// 'gmtoffset' => true,
'image' => '/skin/adminhtml/default/default/images/grid-cal.gif',
'format' => 'yyyy-MM-dd H:mm:ss'
)
)
));
Edit 1 update prepareColumns
protected function _prepareColumns() {
$helper = Mage::helper('setupdate');
$this->addColumn('data_id', array(
'header' => $helper->__('Data No.'),
'index' => 'data_id'
));
$this->addColumn('startdate', array(
'header'=> $helper->__('Start'),// store
'index' => 'startdate',
'filter_index' => 't1.start_date',
'format' => 'F',
'type' => 'datetime',
));
$this->addColumn('stopdate', array(
'header'=> $helper->__('Stop'),// store
'index' => 'stopdate',
'filter_index' => 't1.stop_date',
'format' => 'F',
'type' => 'datetime',
));
return parent::_prepareColumns();
}
It is little confusing the working of CJuiDatePicker widget. when i accessing page with direct URL it working fine and calender displayed as required but the problem is that when i load the page into a dynamic portion with ajax call,Only text-fields are appearing but calender is not displaying after clicking on it.
$this->renderPartial('index', array('policyModel' => $policyModel, 'roomModel' => $roomModel, 'formModel' => $formModel,'response' => $response),false,true);
Widget Code
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'name' => 'start_date',
'options' => array(
'dateFormat' => 'yy-mm-dd',
'showAnim' => 'fadeIn',
'changeMonth' => true,
'changeYear' => true,
'yearRange' => '2000:2099',
'minDate' => '+1d',
'maxDate' => '10Y',
),
'htmlOptions' => array(
'readonly' => 'readonly',
'size' => 7,
),
));
Can any one please help me ,I am posting the question after so many hours of search.
You have to set a unique ID for the datepicker. I do so with the php-function uniqid()
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'id' => 'start_date'.uniqid(),
'name' => 'start_date',
'options' => array(
'dateFormat' => 'yy-mm-dd',
'showAnim' => 'fadeIn',
'changeMonth' => true,
'changeYear' => true,
'yearRange' => '2000:2099',
'minDate' => '+1d',
'maxDate' => '10Y',
),
'htmlOptions' => array(
'readonly' => 'readonly',
'size' => 7,
),
));
Good luck!
You need re-init datepicker after ajax update.After Ajax done, you'll need to add the following line:
$('#start_date').datepicker(); //with your options
[SOLVED]
What im trying to accomplish is to put a date picker in the gridview columns and on change update mysql table.
I've got the update functions i just need help to add the datepicker in the column
THE ANSWER:
'columns' =>array(
array(
'name'=>'due_date',
'value'=>'$data->datePicker()',
'filter'=>CHtml::activeDateField($model,'due_date',array('id'=>$id,'class'=>'form-control','data-id'=> $this->id)),
'type'=>'raw',
),
),
And then the datepicker function in my model
public function datePicker(){
return CHtml::activeDateField($this,'due_date',array('id'=>$id,'class'=>'form-control updateableDate','data-id'=> $this->id));
}
Any Questions feel free
You can use this code :-
<div id="orderdiv">
<?php
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
//'model' => $model,
'name'=>'test',
'attribute' => 'created',
'language' => 'en-AU',
'i18nScriptFile' => 'jquery.ui.datepicker-en.js',
'htmlOptions' => array(
'id' => 'created',
'size' => '10',
),
'defaultOptions' => array(
//'showOn' => 'focus',
'dateFormat' => 'dd/mm/yy',
'showOtherMonths' => true,
'selectOtherMonths' => true,
'changeMonth' => true,
'changeYear' => true,
'showButtonPanel' => true,
)
));
?>
</div>
let me know is it working or not.
Try this code :-
$this->widget('zii.widgets.grid.CGridView', array(
'id'=>'orders-grid',
'dataProvider'=>$model->search(),
'filter'=>$model,
'afterAjaxUpdate'=>"function(){jQuery('#due_date_search').datepicker({'dateFormat': 'yy-mm-dd'})}",
'columns'=>array(
array(
'name' => 'due_date',
'type' => 'raw',
'filter'=>$this->widget('zii.widgets.jui.CJuiDatepicker', array('model'=>$model, 'attribute'=>'due_date', 'htmlOptions' => array('id' => 'due_date_search'), 'options' => array('dateFormat' => 'yy-mm-dd')), true)
),
),
));
Problem : the application has 2 or more date picker. They are defined by id and name. And their date setting should not be same.
e.g exchange rate date should be today date only. And ETA complete date should not be today date.
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'name'=>'Request[exchange_date]',
'model'=>$model,
'value' => $model->exchange_date,
'i18nScriptFile' => 'jquery.ui.datepicker-ja.js', // (#2)
'htmlOptions' => array(
'id' => 'Request_exchange_date',
'size' => '10',
),
'defaultOptions' => array( // (#3)
'showOn' => 'focus',
'dateFormat' => 'dd-M-yy',
'showOtherMonths' => true,
'selectOtherMonths' => true,
'changeMonth' => true,
'changeYear' => true,
'showButtonPanel' => true,
'yearRange'=>'0:+1',
//'minDate'=> 0,
)
));
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'name'=>'Request[eta_date]',
'model'=>$model,
'value' => $model->eta_date,
'i18nScriptFile' => 'jquery.ui.datepicker-ja.js', // (#2)
'htmlOptions' => array(
'id' => 'Request_eta_date',
'size' => '10',
),
'defaultOptions' => array( // (#3)
'showOn' => 'focus',
'dateFormat' => 'dd-M-yy',
'showOtherMonths' => true,
'selectOtherMonths' => true,
'changeMonth' => true,
'changeYear' => true,
'showButtonPanel' => true,
'yearRange'=>'0:+1',
'minDate'=> 0,
)
));
Q : How can I be setup different setting for different date picker at single form?
I think you should set 'options' instead of 'defaultOptions' while using CJuiDatePicker. by using 'defaultOptions' you are forcing all other instances of date picker to behave the same.