Datefield / Date Picker Issues

I’m using a date field with the usual code :


   <div class="row">

        <?php echo $form->labelEx($model, 'entry_date'); ?>

        <?php echo $form->dateField($model, 'entry_date'); ?>

        <?php echo $form->error($model, 'entry_date'); ?>

    </div>

Unfortunately, the datePicker does not display as expected, depending on browsers.

NB : I’m under Widows Vista.

I’s almost OK under Chrome & Opera but the controls are not displayed at all under IE, Firefox or Safari.

Any clues welcome B)

I’d guess you have a superfluous comma in a javascript array declaration or something similar that’s breaking the javascript parser in certain browsers.

Make sure that you don’t have errors in your own javascript. I assume IE has it’s own developer tools to help check this?

I don’t have any JS file of my own here.

The page and the form are CRUD generated with almost no customization out of names, displayed fields and so on.

I don’t know much about IE tools but neither Firebug nor Opera shows any JS error…

Can you post the HTML source code of the page that’s being produced? You might want to paste it into pastebin.

Hi Keith, thanks for your interest and sorry for the delay, I’ve been out of home most of the day.

Here are the pastebin links :

HTML code -> http://pastebin.com/jRVLqNbL

CSS Code -> http://pastebin.com/6Zx24987

The css file is main.css. It’s the only file I’ve modified so far.

Either I’m being blind or there’s no javascript being included there. Are you using renderPartial() or something?

Nope, it’s just the classic CRUD action, here : the actionUpdate and the related views.

As long as the controls worked under my usual browsers, nothing attracted my attention about this point but I also wonder where the js includes are, BTW…

:blink:

[edit]I saw on StackOverflow that "JQuery comes pre-bundled and activated with JQuery and the JQuery library itself is considered a core script so there is no real need to put your own JQuery in."

Anyway, I really don’t know how the bundle works…

Can you post the code from your action and your full view?

Sure. Here they are, I removed the comments and the code for the other controls in the form in order to make the sample shorter :

The action :


    public function actionUpdate($id) {

        $model = $this->loadModel($id);

        if (isset($_POST['AccountingEntry'])) {

[... process submit and redirect ...]

                $this->redirect(array('admin'));

        }


        $this->render('update', array(

            'model' => $model,

            'accounts' => Account::model()->findAll(array('order' => 'name')),

            'thirdParties' => ThirdParty::model()->findAll(array('order' => 'name')),

        ));

    }



The view :


<?php

$this->breadcrumbs = array(

    'Ecritures' => array('index'),

    'Edition',

);


$this->menu = array(

    array('label' => 'Ecritures', 'url' => array('index')),

    array('label' => 'Gérer les écritures', 'url' => array('admin')),

    array('label' => 'Ajouter une ligne', 'url' => array('create')),

    array('label' => 'Consulter', 'url' => array('view', 'id' => $model->id)),

);

?>


<h1>Editer la ligne #<?php echo $model->id; ?></h1>


<?php

echo $this->renderPartial('_form', array(

    'model' => $model,

    'accounts' => $accounts,

    'thirdParties' => $thirdParties,

        )

);

?>

The form partial :


<div class="form">


    <?php

    $form = $this->beginWidget('CActiveForm', array(

        'id' => 'accounting-entry-form',

        'enableAjaxValidation' => false,

            ));

    ?>


    <?php echo $form->errorSummary($model); ?>


    <div class="row">

        <?php echo $form->labelEx($model, 'account_id'); ?>

        <?php echo $form->dropDownList($model, 'account_id', CHtml::listData($accounts, 'id', 'name')); ?>

        <?php echo $form->error($model, 'account_id'); ?>

    </div>


    <div class="row">

        <?php echo $form->labelEx($model, 'entry_date'); ?>

        <?php echo $form->dateField($model, 'entry_date'); ?>

        <?php echo $form->error($model, 'entry_date'); ?>

    </div>


[more rows...]


    <div class="row buttons">

        <?php echo CHtml::submitButton($model->isNewRecord ? 'Créer' : 'Enregistrer'); ?>

    </div>


    <?php $this->endWidget(); ?>


</div>

Ah, so you are referring to native HTML5 datepicker, just as described in this blog post

http://tjvantoll.com/2012/06/30/creating-a-native-html5-datepicker-with-a-fallback-to-jquery-ui/

I didn’t know that …

I have no experience in it, but I think it’s difficult to control the date format of it, because the implementation may differ from browser to browser. And not all browsers support it.

You’d be better consider using CJuiDatepicker.

OK, I didn’t know either about this native HTML date picker, just discovered the thing following your link !

You’re right, here lies the problem. I’ll take a look à the other JUIcy thing then. 8)

Thanks to both of you for the time and the insights !