Zendx Jquery Datepicker custom viewscript

[will barker]

Hi,

I had a jquery datepicker working with my options set like this:

$time_event_end = new ZendX_JQuery_Form_Element_DatePicker(
                    'time_event_end',
                    array('jQueryParams' => array( 'showOn' => "both" , 'buttonImage' => "/images/jquery/calendar.gif", 'dateFormat' => 'yy-mm-dd', 'buttonImageOnly' => 'true'))
                );

But i wanted to add a div around the whole element, dt label dd input, everything.

so i set my custom viewscript like this:

$time_event_end->setDecorators(array(array('ViewScript', array(
                    'viewScript' => '_element.phtml',
                    'id'      => 'time_event_end_div'
                ))));

and then made a element.phtml that looked like this:

<div id="<?= $this->id ?>">
        <dt>
    <?= $this->formLabel($this->element->getName(),
                         $this->element->getLabel()) ?>
     </dt>
     <dd>                       
    <?= $this->{$this->element->helper}(
        $this->element->getName(),
        $this->element->getValue(),
        $this->element->getAttribs()
    ) ?>
    </dd>
    <?= $this->formErrors($this->element->getMessages()) ?>
    <div class="hint"><?= $this->element->getDescription() ?></div>
</div>

now my datepicker dosn't have any options set because the onload function for it as changed from

 $("#time_event_end").datepicker({"showOn":"both","buttonImage":"\/images\/jquery\/calendar.gif","dateFormat":"yy-mm-dd","buttonImageOnly":"true"});


to

$("#time_event_end").datepicker({"helper":"datePicker","jQueryParams":{"showOn":"both","buttonImage":"\/images\/jquery\/calendar.gif","dateFormat":"yy-mm-dd","buttonImageOnly":"true"},"options":[]});

What have i done wrong? i don't think its in the .phtm file right? its the way ive used setDecorators?

Any and all help gratefully recieved!

Will

[Benjamin Eberlei-2]

datepicker needs the UiWidgetElement Decorator, NOT the ViewHelper decorator.

On Thursday 27 November 2008 07:03:25 aSecondWill wrote:

> Hi,
>
> I had a jquery datepicker working with my options set like this:
>
> $time_event_end = new ZendX_JQuery_Form_Element_DatePicker(
>                     'time_event_end',
>                     array('jQueryParams' => array( 'showOn' => "both" ,
> 'buttonImage' => "/images/jquery/calendar.gif", 'dateFormat' => 'yy-mm-dd',
> 'buttonImageOnly' => 'true'))
>                 );
>
> But i wanted to add a div around the whole element, dt label dd input,
> everything.
>
> so i set my custom viewscript like this:
>
> $time_event_end->setDecorators(array(array('ViewScript', array(
>    'viewScript' => '_element.phtml',
>    'id'      => 'time_event_end_div'
> ))));
>
> and then made a element.phtml that looked like this:
>
> <div id="<?= $this->id ?>">
> <dt>
>     <?= $this->formLabel($this->element->getName(),
>                          $this->element->getLabel()) ?>
>      </dt>
>      <dd>
>     <?= $this->{$this->element->helper}(
>         $this->element->getName(),
>         $this->element->getValue(),
>         $this->element->getAttribs()
>     ) ?>
>     </dd>
>     <?= $this->formErrors($this->element->getMessages()) ?>
>     <div class="hint"><?= $this->element->getDescription() ?></div>
> </div>
>
> now my datepicker dosn't have any options set because the onload function
> for it as changed from
>
>
> $("#time_event_end").datepicker({"showOn":"both","buttonImage":"\/images\/j
>query\/calendar.gif","dateFormat":"yy-mm-dd","buttonImageOnly":"true"});
>
>
> to
>
> $("#time_event_end").datepicker({"helper":"datePicker","jQueryParams":{"sho
>wOn":"both","buttonImage":"\/images\/jquery\/calendar.gif","dateFormat":"yy-
>mm-dd","buttonImageOnly":"true"},"options":[]});
>
> What have i done wrong? i don't think its in the .phtm file right? its the
> way ive used setDecorators?
>
> Any and all help gratefully recieved!
>
> Will

--
Benjamin Eberlei
http://www.beberlei.de

[will barker]

hmm, ok. thanks.

so can't i specify a phtml file to manage the layout with that?

beberlei wrote

datepicker needs the UiWidgetElement Decorator, NOT the ViewHelper decorator.

[Benjamin Eberlei-2]

i dont know about the layout and phtml file, this is not a topic of the
datepicker. what i said is, you have to change your setDecorators call to:

$time_event_end->setDecorators(array(array('UiWidgetElement', array(
                  'viewScript' => '_element.phtml',
                  'id'      => 'time_event_end_div'
              ))));

DatePicker does not work with ViewHelper but with UiWidgetElement helper.

On Thursday 27 November 2008 08:19:56 aSecondWill wrote:
> hmm, ok. thanks.
>
> so can't i specify a phtml file to manage the layout with that?
>
> beberlei wrote:
> > datepicker needs the UiWidgetElement Decorator, NOT the ViewHelper
> > decorator.

--
Benjamin Eberlei
http://www.beberlei.de

[will barker]

OK, Thanks Benjamin.  Ill try and find a different way to wrap it with a div.  I wanted to use the phtml because it is just a bit more obvious whats going on than passing arrays of arrays of decorators. Like you say, this isn't really a datepicker issue, its a form element layout issue.

beberlei wrote

i dont know about the layout and phtml file, this is not a topic of the
datepicker.

[will barker]

aSecondWill wrote

Ill try and find a different way to wrap it with a div.  

OK, seem to be a bit cleverer this morning.

informed by mats post : mats post i did this:

 $dateEventEnd->addDecorator(array('analias'=>'HtmlTag'), array('tag'=>'div','id'=>'date_event_end_div'));        

previously i was trying to do this sort of thing:

$dateEventEnd->setDecorators($inputDecorators);  

but that removes the datepicker decorators, and i wasn't quite sure how to add them back in manually.

We have a few teams working on the same site here, and would like to  find a way to keep markup of forms in the control of the design / front end team rather than having the backed team programing them, whilst still using the good bits of zend_form.  

[Benjamin Eberlei-2]

when you want to seperate design and programming with zend form you can remove
all markup decorators from the elements and just place them with <?= $form-
>element1; ?> i think (or was it <?= $form->getElement('element1'); ?>).

designers can then build the markup while the programmers just build forms
that dont have markup decorators (like htmltag, label, dd/dt).

On Friday 28 November 2008 00:37:46 aSecondWill wrote:

> aSecondWill wrote:
> > Ill try and find a different way to wrap it with a div.
>
> OK, seem to be a bit cleverer this morning.
>
> informed by mats post :
> http://www.nabble.com/addDecorator-and-dijit-element-td19860515.html  mats
> post  i did this:
>
>  $dateEventEnd->addDecorator(array('analias'=>'HtmlTag'),
> array('tag'=>'div','id'=>'date_event_end_div'));
>
> previously i was trying to do this sort of thing:
>
> $dateEventEnd->setDecorators($inputDecorators);
>
> but that removes the datepicker decorators, and i wasn't quite sure how to
> add them back in manually.
>
> We have a few teams working on the same site here, and would like to  find
> a way to keep markup of forms in the control of the design / front end team
> rather than having the backed team programing them, whilst still using the
> good bits of zend_form.

--
Benjamin Eberlei
http://www.beberlei.de

[Colin Guthrie-6]

Benjamin Eberlei wrote:
> when you want to seperate design and programming with zend form you can remove
> all markup decorators from the elements and just place them with <?= $form-
>> element1; ?> i think (or was it <?= $form->getElement('element1'); ?>).
>
> designers can then build the markup while the programmers just build forms
> that dont have markup decorators (like htmltag, label, dd/dt).

Of course the downside with that approach is that if you add a new
element to your form, you have to inform the design team and ensure they
add that element in.

IMO it's probably better to establish a solid structural decoration plan
of your forms and try not to vary that. The developers work with it from
a structural perspective and the designers work with it from a
CSS/styling perspective.

If you have to change it, then do the whole "let's actually talk/share
information" thing between the two teams.

I think that is a more efficient approach than the more verbose way of
essentially replicating knowledge of what the form contains on both
logic and view sides of the fence.

COL


--

Colin Guthrie
gmane(at)colin.guthr.ie
http://colin.guthr.ie/

Day Job:
   Tribalogic Limited [http://www.tribalogic.net/]
Open Source:
   Mandriva Linux Contributor [http://www.mandriva.com/]
   PulseAudio Hacker [http://www.pulseaudio.org/]
   Trac Hacker [http://trac.edgewall.org/]