⚠ In case you've missed it, we have migrated to our new website, with a brand new forum. For more details about the migration you can read our blog post for website migration. This is an archived forum. ⚠

  •     

profile picture

Datepicker doesn't load when adding date with callback function on insert



Walkman
  • profile picture
  • Member

Posted 02 May 2012 - 11:50 AM

When I try to fill the date box with the current time with a callback function like this:


// in controller:

$this->grocery_crud->callback_add_field('date',array($this,'_date_fill_now'));


protected function _date_fill_now()
{
return '<input name="date" type="text" value="'. current_time() . '" maxlength="19" class="datetime-input">';
}


The datepicker js files will not be loaded, so the datepicker doesn't pop up when I click on the date field.
How can I load them the right way ?

alhuzn
  • profile picture
  • Member

Posted 03 May 2012 - 16:49 PM

try adding this lines



$crud->set_js('assets/grocery_crud/js/jquery-1.7.1.min.js');
$crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery.ui.datetime.js');
$crud->set_css('assets/grocery_crud/css/jquery_plugins/jquery.ui.datetime.css');

Luan
  • profile picture
  • Member

Posted 04 May 2012 - 03:32 AM

Think i tryed to do it sometime ago, dont remenber if i was sucefull, but you can check the font code of the page.





<input name='orderDate' type='text' value='06/01/2003 00:00:00' maxlength='19' class='datetime-input' />
<button class='datetime-input-clear'>Clear</button>

Walkman
  • profile picture
  • Member

Posted 04 May 2012 - 05:20 AM

[quote name='alhuzn' timestamp='1336063798' post='1611']
try adding this lines



$crud->set_js('assets/grocery_crud/js/jquery-1.7.1.min.js');
$crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery.ui.datetime.js');
$crud->set_css('assets/grocery_crud/css/jquery_plugins/jquery.ui.datetime.css');

[/quote]

Thanks ! However I need to add a couple more to work:


$this->grocery_crud->set_js('assets/grocery_crud/js/jquery-1.7.1.min.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery-ui-1.8.10.custom.min.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery.ui.datetime.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datepicker.config.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datetime.config.js');

$this->grocery_crud->set_css('assets/grocery_crud/css/ui/simple/jquery-ui-1.8.10.custom.css');
$this->grocery_crud->set_css('assets/grocery_crud/css/jquery_plugins/jquery.ui.datetime.css');

alhuzn
  • profile picture
  • Member

Posted 04 May 2012 - 06:26 AM

[quote name='Walkman' timestamp='1336108832' post='1613']
Thanks ! However I need to add a couple more to work:


$this->grocery_crud->set_js('assets/grocery_crud/js/jquery-1.7.1.min.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery-ui-1.8.10.custom.min.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery.ui.datetime.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datepicker.config.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datetime.config.js');

$this->grocery_crud->set_css('assets/grocery_crud/css/ui/simple/jquery-ui-1.8.10.custom.css');
$this->grocery_crud->set_css('assets/grocery_crud/css/jquery_plugins/jquery.ui.datetime.css');

[/quote]

That's what i meant, i was in hurry :D

but you can do with an even more simple line, try this :


$this->grocery_crud->change_field_type('date', 'datetime');


and your textbox(es) becoming a date picker, without adding more JS and CSS

Walkman
  • profile picture
  • Member

Posted 04 May 2012 - 06:32 AM

[quote name='alhuzn' timestamp='1336112762' post='1614']
That's what i meant, i was in hurry :D

but you can do with an even more simple line, try this :


$this->grocery_crud->change_field_type('date', 'datetime');


and your textbox(es) becoming a date picker, without adding more JS and CSS
[/quote]

I tried this before, but unfortunately it does'nt work :(
These files won't get added with this method:

$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/jquery.ui.datetime.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datepicker.config.js');
$this->grocery_crud->set_js('assets/grocery_crud/js/jquery_plugins/config/jquery.datetime.config.js');
$this->grocery_crud->set_css('assets/grocery_crud/css/jquery_plugins/jquery.ui.datetime.css');

Amit Shah
  • profile picture
  • Member

Posted 17 August 2013 - 12:33 PM

well if i am not mistakened, what you are having wrong is the field declaration

//Instead of 
return '<input name="date" type="text" value="'. current_time() . '" maxlength="19" class="datetime-input">';

//U should return the following.. 

return '<input type="text" class="datepicker-input hasDatepicker" maxlength="10" value="'. current_time() . '" name="date" id="field-date">


that should solve your issue. What was missing is the class and the id. Both once set should get you date picker.


Vitor Fonseca
  • profile picture
  • Member

Posted 17 March 2017 - 13:09 PM

datepicker won't work only if ALL date fields in add/edit view have callback_field.

If you have 2 date fields and only one of them has callback then it will work

 

callback example:

    function add_default_date($name){
        $value = date("d/m/Y");
        $return = '<input id="field-'.$name.'" name="'.$name.'" type="text" value="'.$value.'" maxlength="10" class="datepicker-input form-control"><a class="datepicker-input-clear" tabindex="-1">Limpar</a>(dd/mm/yyyy)';
        return $return;
    }