1 <?xml version="1.0" encoding="UTF-8"?>
2 <!-- EN-Revision: 20176 -->
4 <sect2 id="zend.dojo.form.elements">
5 <title>Elementos de Formularios Dijit-Specific</title>
7 <para> Cada formulario dijit para el que se provee un ayudante tiene un
8 elemento correspondiente <classname>Zend_Form</classname> . Todos ellos
9 tienen los siguientes métodos disponibles para manipular los parámetros
15 <methodname>setDijitParam($key, $value)</methodname> :
16 establecer un único parámetro dijit. Si el parámetro dijit ya
17 existe, se borrará y se reemplazará por el nuevo. </para>
22 <methodname>setDijitParams(array $params)</methodname> :
23 establecer varios parámetros dijit a la vez. Cualquiera de los
24 parámetros pasados que concuerden con los ya presentes se
25 sobreescribirán. </para>
30 <methodname>hasDijitParam($key)</methodname> : si un determinado
31 parámetro dijit está definido y presente, devolverá <constant>TRUE</constant>, de lo
32 contrario devolverá <constant>FALSE</constant>. </para>
37 <methodname>getDijitParam($key)</methodname> : recupera el
38 parámetro dijit. Si no está disponible, se devuelve un valor
39 <constant>NULL</constant>. </para>
44 <methodname>getDijitParams()</methodname> : recupera todos los
45 parámetros dijit. </para>
50 <methodname>removeDijitParam($key)</methodname> : elimina el
51 parámetro dijit dado. </para>
56 <methodname>clearDijitParams()</methodname> : borra todos los
57 parámetros dijit actualmente definidos. </para>
61 <para> Los parámetros Dijit se almacenan en la propiedad pública
62 <property>dijitParams</property> . Así, puede habilitar dijit
63 para un elemento de un formulario existente simplemente estableciendo
64 esta propiedad en el elemento; sencillamante no tendrá los accessors
65 anteriores a fin de facilitar la manipulación de parámetros. </para>
67 <para>Además, los elementos específicos de dijit implementan una lista
68 diferente de decoradores, correspondientes a lo siguiente:</para>
70 <programlisting language="php"><![CDATA[
71 $element->addDecorator('DijitElement')
72 ->addDecorator('Errors')
73 ->addDecorator('HtmlTag', array('tag' => 'dd'))
74 ->addDecorator('Label', array('tag' => 'dt'));
77 <para>En efecto, el decorador DijitElement es utilizado en lugar del
78 decorador standard ViewHelper.</para>
80 <para>Finalmente, el elemento base Dijit asegura que el path del ayudante de
81 vista de Dojo se establezca en la vista.</para>
83 <para> Una variante de DijitElement, DijitMulti, ofrece la funcionalidad del
84 elemento abstracto del formulario <methodname>Multi</methodname> ,
85 permitiendo al desarrollador especificar 'multiOptions' -- típicamente
86 opciones "select" u opciones de "radio". </para>
88 <para>Los siguientes elementos dijit están incluídos en la distribución
89 standard de Zend Framework.</para>
91 <sect3 id="zend.dojo.form.elements.button">
94 <para> Si bien no derivan del elemento standard Button <link
95 linkend="zend.form.standardElements.button"/> , implementan la
96 misma funcionalidad, y pueden ser utilizados como una sustitución de
97 drop-in, como se expone en la siguiente funcionalidad: </para>
102 <methodname>getLabel()</methodname> utilizará el nombre del
103 elemento como el rótulo del botón si no se ha provisto el
104 nombre. Además, traducirá el nombre si un adaptador de
105 traducción encuentra concordancia con un mensaje disponible.
111 <methodname>isChecked()</methodname> determina si el valor
112 enviado coincide con la etiqueta; si así fuera, devuelve
113 <constant>TRUE</constant>. Esto es útil para determinar qué botón se utilizó
114 cuando se envió un formulario. </para>
118 <para> Además, sólo los decoradores
119 <classname>DijitElement</classname> y
120 <classname>DtDdWrapper</classname> se utilizan para elementos
123 <example id="zend.dojo.form.elements.button.example">
124 <title>Ejemplo de Uso del Elemento Button dijit</title>
126 <programlisting language="php"><![CDATA[
131 'label' => 'Button Label',
138 <sect3 id="zend.dojo.form.elements.checkBox">
139 <title>CheckBox</title>
141 <para> Si bien no derivan del elemento standard Checkbox <link
142 linkend="zend.form.standardElements.checkbox"/> , aplican la
143 misma funcionalidad. Esto significa exponer los siguientes métodos: </para>
148 <methodname>setCheckedValue($value)</methodname> :
149 establecer el valor a usar cuando el elemento está marcado
155 <methodname>getCheckedValue()</methodname> : obtener el
156 valor del item a usar cuando está comprobado (checked).
162 <methodname>setUncheckedValue($value)</methodname> :
163 establecer el valor del item a utilizar cuando está
164 desactivado (unchecked). </para>
169 <methodname>getUncheckedValue()</methodname> : obtener el
170 valor del item a utilizar cuando está desactivado
176 <methodname>setChecked($flag)</methodname> : marcar el
177 elemento como activado (checked) o desactivado (unchecked).
183 <methodname>isChecked()</methodname> : determina si el
184 elemento está activo (checked) actualmente. </para>
188 <example id="zend.dojo.form.elements.checkBox.example">
189 <title>Ejemplo de Uso de Elementos CheckBox dijit</title>
191 <programlisting language="php"><![CDATA[
196 'label' => 'A check box',
197 'checkedValue' => 'foo',
198 'uncheckedValue' => 'bar',
206 <sect3 id="zend.dojo.form.elements.comboBox">
207 <title>ComboBox y FilteringSelect</title>
209 <para> Como se señaló en la documentación del ayudante de vista de
210 ComboBox dijit <link linkend="zend.dojo.view.dijit.form"/> , los
211 ComboBoxes son un híbrido entre "select" y "text input", permitiendo
212 el autocompletado y la capacidad para especificar una alternativa a
213 las opciones provistas. FilteringSelects es lo mismo, pero no
214 permite entradas arbitrarias. </para>
217 <title>ComboBoxes que Devuelven los Valores de los Labels</title>
219 <para> Los ComboBoxes devuelven los valores de los rótulos (labels),
220 y no los valores de opción, que pueden llevar a una
221 desvinculación de las expectativas. Por esta razón, los
222 ComboBoxes no auto-registran un validador
223 <classname>InArray</classname> (aunque los
224 FilteringSelects si lo hacen). </para>
227 <para> Los elementos de forms de ComboBox y FilteringSelect proporcionan
228 accessors y mutators para examinar y establecer las opciones
229 seleccionadas, así como para especificar un datastore dojo.data (si
230 se usa). Se extienden desde DijitMulti, que le permite especificar
231 opciones de selección vía los métodos
232 <methodname>setMultiOptions()</methodname> y
233 <methodname>setMultiOption()</methodname> . Además, están
234 disponibles los siguientes métodos: </para>
239 <methodname>getStoreInfo()</methodname> : Obtener del
240 datastore toda la información establecida actualmente.
241 Devuelve un array vacío si no hay datos actualmente
242 establecidos. </para>
247 <methodname>setStoreId($identifier)</methodname> : establece
248 la variable del identificador (generalmente referenciado por
249 el atributo 'jsId' en Dojo). Este debe ser un nombre de
250 variable válido para javascript. </para>
255 <methodname>getStoreId()</methodname> : recupera el nombre
256 de la variable del identificador del datastore. </para>
261 <methodname>setStoreType($dojoType)</methodname> : establece
262 la clase del datastore a usar; por ejemplo,
263 "dojo.data.ItemFileReadStore". </para>
268 <methodname>getStoreType()</methodname> : obtiene la clase
269 del datastore a usar. </para>
274 <methodname>setStoreParams(array $params)</methodname> :
275 establece cualquiera de los parámetros utilizados para
276 configurar el objeto datastore. Como ejemplo, el datastore
277 dojo.data.ItemFileReadStore esperaría un parámetro 'url'
278 apuntando a un lugar que devolvería el objeto dojo.data.
284 <methodname>getStoreParams()</methodname> : obtiene
285 cualquiera de los parámetros del datastore actualmente
286 establecido; si no hay ninguno, se devuelve un array vacío.
292 <methodname>setAutocomplete($flag)</methodname> : indica si
293 será usado o no el elemento seleccionado una vez que el
294 usuario deje el elemento. </para>
299 <methodname>getAutocomplete()</methodname> : obtener el
300 valor del flag de autocomplete. </para>
304 <para> Por defecto, si no hay ningún dojo.data registrado con el
305 elemento, este elemento registra un validador
306 <classname>InArray</classname> que valida contra las claves
307 del array de las opciones registradas. Puede desactivar este
308 comportamiento ya sea llamando a
309 <methodname>setRegisterInArrayValidator(false)</methodname> , o
310 pasando un valor <constant>FALSE</constant> a la clave de configuración
311 <property>registerInArrayValidator</property> . </para>
313 <example id="zend.dojo.form.elements.comboBox.selectExample">
314 <title>Elemento de ComboBox dijit Usado como select input</title>
316 <programlisting language="php"><![CDATA[
321 'label' => 'ComboBox (select)',
323 'autocomplete' => false,
324 'multiOptions' => array(
328 'orange' => 'Orange',
337 <example id="zend.dojo.form.elements.comboBox.datastoreExample">
338 <title>Elemento de ComboBox dijit Usado con datastore</title>
340 <programlisting language="php"><![CDATA[
345 'label' => 'ComboBox (datastore)',
346 'storeId' => 'stateStore',
347 'storeType' => 'dojo.data.ItemFileReadStore',
348 'storeParams' => array(
349 'url' => '/js/states.txt',
351 'dijitParams' => array(
352 'searchAttr' => 'name',
359 <para> Los ejemplos anteriores también podrían utilizar
360 <methodname>FilteringSelect</methodname> en vez de
361 <classname>ComboBox</classname> . </para>
364 <sect3 id="zend.dojo.form.elements.currencyTextBox">
365 <title>CurrencyTextBox</title>
367 <para>El CurrencyTextBox principalmente brinda apoyo a la entrada de
368 moneda. La moneda puede ser localizada, y puede manejar tanto a
369 valores fraccionarios como no fraccionarios.</para>
371 <para> Internamente, CurrencyTextBox deriva de <link
372 linkend="zend.dojo.form.elements.numberTextBox"
373 >NumberTextBox</link> , <link
374 linkend="zend.dojo.form.elements.validationTextBox"
375 >ValidationTextBox</link> , y <link
376 linkend="zend.dojo.form.elements.textBox">TextBox</link> ; todos
377 los métodos disponibles a esas clases están disponibles. Además,
378 pueden utilizarse los siguientes métodos restrictivos: </para>
383 <methodname>setCurrency($currency)</methodname> : establecer
384 el tipo de moneda a usar; y debe seguir la especificación
385 <ulink url="http://en.wikipedia.org/wiki/ISO_4217"
392 <methodname>getCurrency()</methodname> : recupera el tipo de
393 moneda actual. </para>
398 <methodname>setSymbol($symbol)</methodname> : establece el
399 símbolo de 3 letras <ulink
400 url="http://en.wikipedia.org/wiki/ISO_4217"
401 >ISO-4217</ulink> de la moneda a usar. </para>
406 <methodname>getSymbol()</methodname> : recupera el símbolo
407 de la moneda actual. </para>
412 <methodname>setFractional($flag)</methodname> : establece si
413 la moneda debería permitir o no valores fraccionarios.
419 <methodname>getFractional()</methodname> : recupera el
420 status del flag fraccional. </para>
424 <example id="zend.dojo.form.elements.currencyTextBox.example">
425 <title>Ejemplo de Uso del Elemento CurrencyTextBox dijit</title>
427 <programlisting language="php"><![CDATA[
432 'label' => 'Currency:',
435 'invalidMessage' => 'Invalid amount. ' .
436 'Include dollar sign, commas, and cents.',
437 'fractional' => false,
444 <sect3 id="zend.dojo.form.elements.dateTextBox">
445 <title>DateTextBox</title>
447 <para>DateTextBox establece un calendario desplegable (drop-down) para
448 seleccionar una fecha, así como validación y formateo de fechas del
449 lado del clente.</para>
451 <para> Internamente, DateTextBox deriva de <link
452 linkend="zend.dojo.form.elements.validationTextBox"
453 >ValidationTextBox</link> y <link
454 linkend="zend.dojo.form.elements.textBox">TextBox</link> ; todos
455 los métodos disponibles a esas clases están disponibles. Además, los
456 siguientes métodos pueden utilizarse para establecer restricciones
457 individuales: </para>
462 <methodname>setAmPm($flag)</methodname> y
463 <methodname>getAmPm()</methodname> : Cuándo usar o no
464 los strings AM/PM en los fortmatos de horas. </para>
469 <methodname>setStrict($flag)</methodname> y
470 <methodname>getStrict()</methodname> : Cuándo usar o no
471 el matching para una expresión regular estricta al validar
472 la entrada. Si es falso, que es el valor por defecto, será
473 indulgente sobre espacios en blanco y algunas abreviaturas.
479 <methodname>setLocale($locale)</methodname> y
480 <methodname>getLocale()</methodname> : Establece y
481 recupera la localidad a utilizar con este elemento
487 <methodname>setDatePattern($pattern)</methodname> y
488 <methodname>getDatePattern()</methodname> : provee y
490 url="http://www.unicode.org/reports/tr35/#Date_Format_Patterns"
491 > patrón de formato de fechas unicode</ulink> para el
492 formateo de fechas. </para>
497 <methodname>setFormatLength($formatLength)</methodname> y
498 <methodname>getFormatLength()</methodname> : proporciona
499 y recupera la longitud del tipo de formato a usar; debe ser
500 uno de los siguientes: "long", "short", "medium" o "full".
506 <methodname>setSelector($selector)</methodname> y
507 <methodname>getSelector()</methodname> : proporciona y
508 recupera el estilo del selector; debe ser "date" o "time".
513 <example id="zend.dojo.form.elements.dateTextBox.example">
514 <title>Ejemplo de Uso del Elemento DateTextBox dijit</title>
516 <programlisting language="php"><![CDATA[
523 'invalidMessage' => 'Invalid date specified.',
524 'formatLength' => 'long',
531 <sect3 id="zend.dojo.form.elements.editor">
532 <title>Editor</title>
534 <para> Editor proporciona un editor WYSIWYG que puede ser utilizado
535 tanto para crear como para editar contenidos <acronym>HTML</acronym>
536 ricos. dijit.Editor es pluggable y podrá ampliarse con plugins
537 personalizados si lo desea; para más detalles vea en <ulink
538 url="http://dojotoolkit.org/book/dojo-book-0-9/part-2-dijit/advanced-editing-and-display/editor-rich-text"
539 > la documentación de dijit.Editor</ulink> . </para>
541 <para>El elemento form de Editor proporciona un número de accessors y
542 mutators para manipular diversos parámetros dijit, tal como
548 <emphasis>captureEvents</emphasis> son eventos que se
549 conectan al área de edición en si. Los siguientes accessors
550 y mutators están disponibles para manipular la captura de
556 <methodname>addCaptureEvent($event)</methodname>
561 <methodname>addCaptureEvents(array
562 $events)</methodname>
567 <methodname>setCaptureEvents(array
568 $events)</methodname>
573 <methodname>getCaptureEvents()</methodname>
578 <methodname>hasCaptureEvent($event)</methodname>
583 <methodname>removeCaptureEvent($event)</methodname>
588 <methodname>clearCaptureEvents()</methodname>
596 <emphasis>events</emphasis> son eventos DOM estándar, como
597 onClick, onKeyup, etc. Los siguientes accessors y mutators
598 están disponibles para manipular eventos: </para>
603 <methodname>addEvent($event)</methodname>
608 <methodname>addEvents(array $events)</methodname>
613 <methodname>setEvents(array $events)</methodname>
618 <methodname>getEvents()</methodname>
623 <methodname>hasEvent($event)</methodname>
628 <methodname>removeEvent($event)</methodname>
633 <methodname>clearEvents()</methodname>
641 <emphasis>plugins</emphasis> añaden funcionalidad al Editor
642 -- herramientas adicionales para la barra de herramientas,
643 estilos adicionales a permitir, etc. Los siguientes
644 accessors y mutators están disponibles para manipular
650 <methodname>addPlugin($plugin)</methodname>
655 <methodname>addPlugins(array $plugins)</methodname>
660 <methodname>setPlugins(array $plugins)</methodname>
665 <methodname>getPlugins()</methodname>
670 <methodname>hasPlugin($plugin)</methodname>
675 <methodname>removePlugin($plugin)</methodname>
680 <methodname>clearPlugins()</methodname>
688 <emphasis>editActionInterval</emphasis> se utiliza para
689 agrupar eventos para deshacer operaciones. Por defecto, este
690 valor es de 3 segundos. El método
691 <methodname>setEditActionInterval($interval)</methodname>
692 puede ser usado para establecer el valor, mientras que
693 <methodname>getEditActionInterval()</methodname> lo
699 <emphasis>focusOnLoad</emphasis> se utiliza para determinar
700 si este editor en particular recibirá atención cuando la
701 página se haya cargado. Por defecto, esto es falso. El
702 método <methodname>setFocusOnLoad($flag)</methodname> puede
703 usarse para establecer el valor, mientras que
704 <methodname>getFocusOnLoad()</methodname> lo recuperará.
710 <emphasis>height</emphasis> especifica la altura del editor;
711 por defecto, es de 300px. El método
712 <methodname>setHeight($height)</methodname> puede ser
713 utilizado para establecer el valor, mientras que
714 <methodname>getHeight()</methodname> lo recupera.
720 <emphasis>inheritWidth</emphasis> se utiliza para determinar
721 si el editor utilizará el ancho del contenedor padre o
722 simplemente toma por defecto el 100% del ancho. Por defecto,
723 esto es falso (es decir, llenará el ancho de la ventana). El
724 método <methodname>setInheritWidth($flag)</methodname> puede
725 ser utilizado para establecer el valor, mientras que
726 <methodname>getInheritWidth()</methodname> lo
732 <emphasis>minHeight</emphasis> indica la altura mínima del
733 editor; por defecto, es de 1em. El método
734 <methodname>setMinHeight($height)</methodname> puede ser
735 utilizado para establecer el valor, mientras que
736 <methodname>getMinHeight()</methodname> lo recuperará.
742 <emphasis>styleSheets</emphasis> indica qué otras hojas de
743 estilo <acronym>CSS</acronym> deberían ser utilizadas para
744 incidir sobre la pantalla del Editor. Por defecto, ninguna
745 está registrada, y hereda la página de estilos. Los
746 siguientes accessors y mutators están disponibles para
747 manipular al editor de hojas de estilo (stylesheets): </para>
752 <methodname>addStyleSheet($styleSheet)</methodname>
757 <methodname>addStyleSheets(array
758 $styleSheets)</methodname>
763 <methodname>setStyleSheets(array
764 $styleSheets)</methodname>
769 <methodname>getStyleSheets()</methodname>
774 <methodname>hasStyleSheet($styleSheet)</methodname>
779 <methodname>removeStyleSheet($styleSheet)</methodname>
784 <methodname>clearStyleSheets()</methodname>
791 <example id="zend.dojo.form.elements.editor.example">
792 <title>Ejemplo de Uso del Elemento Editor dijit</title>
794 <programlisting language="php"><![CDATA[
795 $form->addElement('editor', 'content', array(
796 'plugins' => array('undo', '|', 'bold', 'italic'),
797 'editActionInterval' => 2,
798 'focusOnLoad' => true,
800 'inheritWidth' => true,
801 'styleSheets' => array('/js/custom/editor.css'),
808 <title>Editor Dijit uses div by default</title>
810 <para> The Editor dijit uses an <acronym>HTML</acronym>
811 <acronym>DIV</acronym> by default. The
812 <classname>dijit._editor.RichText</classname> documentation
813 indicates that having it built on an <acronym>HTML</acronym>
814 <acronym>TEXTAREA</acronym> can potentially have security
815 implications. </para>
817 <para> That said, there may be times when you want an Editor widget
818 that can gracefully degrade to a <acronym>TEXTAREA</acronym> .
819 In such situations, you can do so by setting the
820 <varname>degrade</varname> property to
821 <constant>TRUE</constant> : </para>
823 <programlisting language="php"><![CDATA[
825 $editor = new Zend_Dojo_Form_Element_Editor('foo', array(
829 // Construction via the form:
830 $form->addElement('editor', 'content', array(
834 // Or after instantiation:
835 $editor->degrade = true;
840 <sect3 id="zend.dojo.form.elements.horizontalSlider">
841 <title>HorizontalSlider</title>
843 <para> HorizontalSlider proporciona un widget deslizador de UI para
844 seleccionar un valor numérico dentro de un rango. Internamente,
845 establece el valor de un elemento oculto que es enviado por el
848 <para> HorizontalSlider proviene del elemento abstracto <link
849 linkend="zend.dojo.form.elements.slider">Slider dijit</link> .
850 Además, tiene una variedad de métodos de ajuste y configuración de
851 reglas deslizantes y etiquetas para esas reglas. </para>
856 <methodname>setTopDecorationDijit($dijit)</methodname> y
857 <methodname>setBottomDecorationDijit($dijit)</methodname>
858 : establecen el nombre de la dijit a utilizar bien para la
859 parte superior o inferior de la barra deslizante. Esto no
860 debería incluir el prefijo "dijit.form.", sino sólo el
861 último nombre -- "HorizontalRule" o "HorizontalRuleLabels".
867 <methodname>setTopDecorationContainer($container)</methodname>
869 <methodname>setBottomDecorationContainer($container)</methodname>
870 : especifican el nombre a utilizar para el elemento
871 contenedor de las reglas; por ejemplo 'Toprule',
872 'topContainer', etc. </para>
877 <methodname>setTopDecorationLabels(array
878 $labels)</methodname> y
879 <methodname>setBottomDecorationLabels(array
880 $labels)</methodname> : establecen las etiquetas a usar
881 por uno de los tipos RuleLabels dijit. Debe ser un array
882 indexado; especificar un único espacio vacío para saltar a
883 la posición de una determinada etiqueta (como ser al
884 comienzo o al final). </para>
889 <methodname>setTopDecorationParams(array
890 $params)</methodname> y
891 <methodname>setBottomDecorationParams(array
892 $params)</methodname> : parámetros dijit para utilizar
893 al configurar la Regla o RuleLabels dijit. </para>
898 <methodname>setTopDecorationAttribs(array
899 $attribs)</methodname> y
900 <methodname>setBottomDecorationAttribs(array
901 $attribs)</methodname> : atributos
902 <acronym>HTML</acronym> para especificar una Regla dada
903 o el elemento contenedor de <acronym>HTML</acronym>
909 <methodname>getTopDecoration()</methodname> y
910 <methodname>getBottomDecoration()</methodname> :
911 recuperar todos los metadatos para una determinada Regla o
912 definición de RuleLabels, tal como han sido provistos por
913 los mutators anteriores. </para>
917 <example id="zend.dojo.form.elements.horizontalSlider.example">
918 <title>Ejemplo de Uso del Elemento HorizontalSlider dijit</title>
920 <para> Lo siguiente creará un deslizador horizontal de selección con
921 valores enteros que van desde -10 a 10. La parte superior tendrá
922 etiquetas en las marcas del 20%, 40%, 60%, y 80%. La parte
923 inferior será una regla con marcas en el 0, 50%, y 100%. Cada
924 vez que se cambie el valor, el elemento oculto almacenará el
925 valor actualizado. </para>
927 <programlisting language="php"><![CDATA[
932 'label' => 'HorizontalSlider',
936 'discreteValues' => 11,
937 'intermediateChanges' => true,
938 'showButtons' => true,
939 'topDecorationDijit' => 'HorizontalRuleLabels',
940 'topDecorationContainer' => 'topContainer',
941 'topDecorationLabels' => array(
949 'topDecorationParams' => array(
950 'container' => array(
951 'style' => 'height:1.2em; font-size=75%;color:gray;',
954 'style' => 'height:1em; font-size=75%;color:gray;',
957 'bottomDecorationDijit' => 'HorizontalRule',
958 'bottomDecorationContainer' => 'bottomContainer',
959 'bottomDecorationLabels' => array(
964 'bottomDecorationParams' => array(
966 'style' => 'height:1em; font-size=75%;color:gray;',
975 <sect3 id="zend.dojo.form.elements.numberSpinner">
976 <title>NumberSpinner</title>
978 <para>Un número spinner es un elemento de texto para introducir valores
979 numéricos; también incluye elementos de incremento y decremento del
980 valor por una cantidad fija.</para>
982 <para>Se encuentran disponibles los siguientes métodos:</para>
987 <methodname>setDefaultTimeout($timeout)</methodname> y
988 <methodname>getDefaultTimeout()</methodname> : establece
989 y recupera el tiempo de espera predeterminado en
990 milisegundos, entre cuando el botón se mantiene presionado y
991 cambia el valor. </para>
996 <methodname>setTimeoutChangeRate($rate)</methodname> y
997 <methodname>getTimeoutChangeRate()</methodname> :
998 establece y recupera la tasa en milisegundos, en la que se
999 harán cambios cuando un botón se mantiene presionado.
1005 <methodname>setLargeDelta($delta)</methodname> y
1006 <methodname>getLargeDelta()</methodname> : establece y
1007 recupera la cantidad en la que el valor numérico debería
1008 cambiar cuando un botón se mantiene presionado. </para>
1013 <methodname>setSmallDelta($delta)</methodname> y
1014 <methodname>getSmallDelta()</methodname> : establece y
1015 recupera el delta con la que el número debería cambiar
1016 cuando se pulsa un botón una vez. </para>
1021 <methodname>setIntermediateChanges($flag)</methodname> y
1022 <methodname>getIntermediateChanges()</methodname> :
1023 establece y recupera el flag que indica si debe o no ser
1024 mostrado cada cambio de valor cuando un botón se mantiene
1030 <methodname>setRangeMessage($message)</methodname> y
1031 <methodname>getRangeMessage()</methodname> : establece y
1032 recupera el mensaje indicando el rango de valores
1033 disponibles. </para>
1038 <methodname>setMin($value)</methodname> y
1039 <methodname>getMin()</methodname> : establece y recupera
1040 el valor mínimo posible. </para>
1045 <methodname>setMax($value)</methodname> y
1046 <methodname>getMax()</methodname> : establece y recupera
1047 el valor máximo posible. </para>
1051 <example id="zend.dojo.form.elements.numberSpinner.example">
1052 <title>Ejemplo de Uso del Elemento NumberSpinner dijit</title>
1054 <programlisting language="php"><![CDATA[
1060 'label' => 'NumberSpinner',
1063 'defaultTimeout' => 500,
1064 'timeoutChangeRate' => 100,
1071 ]]></programlisting>
1075 <sect3 id="zend.dojo.form.elements.numberTextBox">
1076 <title>NumberTextBox</title>
1078 <para>Un cuadro de texto numérico es un elemento de texto de
1079 introducción de valores numéricos; a diferencia de NumberSpinner, se
1080 introducen manualmente. Se pueden proporcionar validaciones y
1081 restricciones para garantizar que el número permanece en un rango o
1082 formato particular.</para>
1084 <para> Internmente, NumberTextBox proviene de <link
1085 linkend="zend.dojo.form.elements.validationTextBox"
1086 >ValidationTextBox</link> y <link
1087 linkend="zend.dojo.form.elements.textBox">TextBox</link> ; todos
1088 los métodos disponibles a esas clases están disponibles. Además, los
1089 siguientes métodos pueden utilizarse para establecer restricciones
1090 individuales: </para>
1095 <methodname>setLocale($locale)</methodname> y
1096 <methodname>getLocale()</methodname> : especifica y
1097 recupera un "locale" determinado o alternativo para usar con
1103 <methodname>setPattern($pattern)</methodname> y
1104 <methodname>getPattern()</methodname> : establece y
1106 url="http://www.unicode.org/reports/tr35/#Number_Format_Patterns"
1107 > patrón de formato numérico </ulink> a usar en el
1108 formateo de números. </para>
1113 <methodname>setType($type)</methodname> y
1114 <methodname>getType()</methodname> : establece y
1115 recupera el tipo de formato numérico a utilizar (deberán ser
1116 uno de 'decimal', 'percent', o 'currency'). </para>
1121 <methodname>setPlaces($places)</methodname> y
1122 <methodname>getPlaces()</methodname> : establece y
1123 recupera el número de decimales que soportará. </para>
1128 <methodname>setStrict($flag)</methodname> y
1129 <methodname>getStrict()</methodname> : establece y
1130 recupera el valor estricto del flag, que indica cuánta
1131 indulgencia es permitida en relación con espacios en blanco
1132 y con caracteres no numéricos. </para>
1136 <example id="zend.dojo.form.elements.numberTextBox.example">
1137 <title>Ejemplo de Uso del Elemento NumberTextBox dijit</title>
1139 <programlisting language="php"><![CDATA[
1144 'label' => 'NumberTextBox',
1146 'invalidMessage' => 'Invalid elevation.',
1148 'constraints' => array(
1154 ]]></programlisting>
1158 <sect3 id="zend.dojo.form.elements.passwordTextBox">
1159 <title>PasswordTextBox</title>
1161 <para>PasswordTextBox es simplemente un ValidationTextBox que está
1162 ligado a una contraseña; su único objetivo es permitir la entrada de
1163 texto de contraseñas de dijit que también proporciona validación del
1164 lado del cliente.</para>
1166 <para> Internmente, PasswordTextBox proviene de <link
1167 linkend="zend.dojo.form.elements.validationTextBox"
1168 >ValidationTextBox</link> y <link
1169 linkend="zend.dojo.form.elements.textBox">TextBox</link> ; todos
1170 los métodos disponibles a esas clases están disponibles. </para>
1172 <example id="zend.dojo.form.elements.passwordTextBox.example">
1173 <title>Ejemplo de Uso del Elemento PasswordTextBox dijit</title>
1175 <programlisting language="php"><![CDATA[
1180 'label' => 'Password',
1183 'lowercase' => true,
1184 'regExp' => '^[a-z0-9]{6,}$',
1185 'invalidMessage' => 'Invalid password; ' .
1186 'must be at least 6 alphanumeric characters',
1189 ]]></programlisting>
1193 <sect3 id="zend.dojo.form.elements.radioButton">
1194 <title>RadioButton</title>
1196 <para>RadioButton envuelve a elementos standard de entrada tipo radio
1197 para brindar un look-and-feel consistente con otros dojo
1200 <para> RadioButton se extiende desde DijitMulti, que le permite
1201 especificar la selección de opciones vía los métodos
1202 <methodname>setMultiOptions()</methodname> y
1203 <methodname>setMultiOption()</methodname> . </para>
1205 <para> Por defecto, este elemento registra un validador
1206 <methodname>InArray</methodname> que valida contra las calves
1207 del array de las opciones registradas. Puede desactivar este
1208 comportamiento ya sea llamando a
1209 <methodname>setRegisterInArrayValidator(false)</methodname> , o
1210 pasando un valor falso a la clave de configuración
1211 <methodname>registerInArrayValidator</methodname> . </para>
1213 <example id="zend.dojo.form.elements.radioButton.example">
1214 <title>Ejemplo de Uso del Elemento RadioButton dijit</title>
1216 <programlisting language="php"><![CDATA[
1221 'label' => 'RadioButton',
1222 'multiOptions' => array(
1230 ]]></programlisting>
1234 <sect3 id="zend.dojo.form.elements.simpletextarea">
1235 <title>SimpleTextarea</title>
1237 <para> SimpleTextarea actúa principalmente como un textarea estándar de
1238 <acronym>HTML</acronym> . Sin embargo, no permite establecer
1239 filas ni columnas. En su lugar, el ancho de textarea debe
1240 especificarse utilizando medidas <acronym>CSS</acronym> estándar. A
1241 diferencia de Textarea, esta no aumentará automáticamente. </para>
1243 <example id="zend.dojo.form.elements.simpletextarea.example">
1244 <title>Ejemplo de Uso del Elemento SimpleTextarea dijit</title>
1246 <programlisting language="php"><![CDATA[
1251 'label' => 'SimpleTextarea',
1253 'style' => 'width: 80em; height: 25em;',
1256 ]]></programlisting>
1260 <sect3 id="zend.dojo.form.elements.slider">
1261 <title>Elemento abstracto Slider</title>
1263 <para> Slider es un elemento abstracto que proviene de ambos <link
1264 linkend="zend.dojo.form.elements.horizontalSlider">
1265 HorizontalSlider</link> y <link
1266 linkend="zend.dojo.form.elements.verticalSlider"
1267 >VerticalSlider</link> . Expone una serie de métodos comunes
1268 para configurar sus deslizadores, incluyendo a: </para>
1273 <methodname>setClickSelect($flag)</methodname> y
1274 <methodname>getClickSelect()</methodname> : establece y
1275 recupera el flag que indica cuando al presionar el botón
1276 deslizante cambia o no el valor. </para>
1281 <methodname>setIntermediateChanges($flag)</methodname> y
1282 <methodname>getIntermediateChanges()</methodname> :
1283 establece y recupera el flag que indica si dijit enviará o
1284 no una notificación sobre cada evento de cambio del
1290 <methodname>setShowButtons($flag)</methodname> y
1291 <methodname>getShowButtons()</methodname> : establece y
1292 recupera el flag que indica si los botones de uno u otro
1293 extremo se mostrarán o no; si es así, el usuario puede hacer
1294 clic sobre éstos para cambiar el valor de la barra
1300 <methodname>setDiscreteValues($value)</methodname> y
1301 <methodname>getDiscreteValues()</methodname> : establece
1302 y recupera el número de valores discretos representados por
1303 el deslizador. </para>
1308 <methodname>setMaximum($value)</methodname> y
1309 <methodname>getMaximum()</methodname> : establece y
1310 recupera el valor máximo del deslizador. </para>
1315 <methodname>setMinimum($value)</methodname> y
1316 <methodname>getMinimum()</methodname> : establece y
1317 recupera el valor mínimo del deslizador. </para>
1322 <methodname>setPageIncrement($value)</methodname> y
1323 <methodname>getPageIncrement()</methodname> : establece
1324 la cantidad en que cambiará el deslizador por eventos del
1329 <para>Ejemplos de uso provistos con cada clase extendida concretamente.
1333 <sect3 id="zend.dojo.form.elements.submitButton">
1334 <title>SubmitButton</title>
1336 <para> Si bien no hay Dijit llamado SubmitButton, incluimos uno aquí
1337 para proporcionar un botón dijit capaz de enviar un formulario sin
1338 que se exijan ligaduras con javascript. Funciona exactamente igual
1339 que el <link linkend="zend.dojo.form.elements.button">Button
1340 dijit</link> . </para>
1342 <example id="zend.dojo.form.elements.submitButton.example">
1343 <title>Ejemplo de Uso del Elemento SubmitButton dijit</title>
1345 <programlisting language="php"><![CDATA[
1350 'required' => false,
1352 'label' => 'Submit Button!',
1355 ]]></programlisting>
1359 <sect3 id="zend.dojo.form.elements.textBox">
1360 <title>TextBox</title>
1362 <para>Textbox se incluyó principalmente para proporcionar una entrada de
1363 texto con apariencia coherente y con el look-and-feel de los demás
1364 dijits. Sin embargo, también incluye algunas pequeñas capacidades de
1365 filtrado y validación, representadas en los métodos
1371 <methodname>setLowercase($flag)</methodname> y
1372 <methodname>getLowercase()</methodname> : establece y
1373 recupera el flag que indica si la entrada debe o no ser
1374 presentada en minúsculas. </para>
1379 <methodname>setPropercase($flag)</methodname> y
1380 <methodname>getPropercase()</methodname> : establece y
1381 recupera el flag que indica si la entrada debe ser o no ser
1382 presentada como Proper Case. </para>
1387 <methodname>setUppercase($flag)</methodname> y
1388 <methodname>getUppercase()</methodname> : establece y
1389 recupera el flag que indica si la entrada debe ser
1390 presentada como mayúsculas (UPPERCASE). </para>
1395 <methodname>setTrim($flag)</methodname> y
1396 <methodname>getTrim()</methodname> : establece y
1397 recupera el flag que indica si los espacios al comienzo o al
1398 final deben ser eliminados o no. </para>
1403 <methodname>setMaxLength($length)</methodname> y
1404 <methodname>getMaxLength()</methodname> : establece y
1405 recupera la longitud máxima del input. </para>
1409 <example id="zend.dojo.form.elements.textBox.example">
1410 <title>Ejemplo de Uso del Elemento TextBox dijit</title>
1412 <programlisting language="php"><![CDATA[
1417 'value' => 'some text',
1418 'label' => 'TextBox',
1420 'propercase' => true,
1423 ]]></programlisting>
1427 <sect3 id="zend.dojo.form.elements.textarea">
1428 <title>Textarea</title>
1430 <para> Textarea actúa principalmente como un textarea estándar de
1431 <acronym>HTML</acronym> . Sin embargo, no permite establecer
1432 filas y columnas. En su lugar, el ancho de la textarea debe
1433 especificarse utilizando medidas <acronym>CSS</acronym> estándar;
1434 las filas debe omitirse totalmente. Luego, la textarea crecerá
1435 verticalmente tanto como texto se añada a ella. </para>
1437 <example id="zend.dojo.form.elements.textarea.example">
1438 <title>Ejemplo de Uso del Elemento Textarea dijit</title>
1440 <programlisting language="php"><![CDATA[
1445 'label' => 'Textarea',
1447 'style' => 'width: 200px;',
1450 ]]></programlisting>
1454 <sect3 id="zend.dojo.form.elements.timeTextBox">
1455 <title>TimeTextBox</title>
1457 <para>TimeTextBox es una entrada de texto que proporciona una lista
1458 desplegable (drop-down) para seleccionar un tiempo (fecha y hora).
1459 La lista desplegable, puede ser configurada para mostrar una cierta
1460 ventana de tiempo, con incrementos especificados.</para>
1462 <para> Internamente, TimeTextBox proviene de <link
1463 linkend="zend.dojo.form.elements.dateTextBox">DateTextBox</link>
1464 , <link linkend="zend.dojo.form.elements.validationTextBox"
1465 >ValidationTextBox</link> y <link
1466 linkend="zend.dojo.form.elements.textBox">TextBox</link> ; todos
1467 los métodos disponibles a esas clases están disponibles. Además, los
1468 siguientes métodos pueden utilizarse para establecer restricciones
1469 individuales: </para>
1474 <methodname>setTimePattern($pattern)</methodname> y
1475 <methodname>getTimePattern()</methodname> : establece y
1477 url="http://www.unicode.org/reports/tr35/#Date_Format_Patterns"
1478 >patrón de formato de fecha y hora unicode</ulink> para
1479 el formato correspondiente. </para>
1484 <methodname>setClickableIncrement($format)</methodname> y
1485 <methodname>getClickableIncrement()</methodname> :
1486 establece y recupera el string <ulink
1487 url="http://en.wikipedia.org/wiki/ISO_8601"
1488 >ISO-8601</ulink> representando la cantidad de tiempo a
1489 incrementar cada vez que se recolecta un elemento clickable.
1495 <methodname>setVisibleIncrement($format)</methodname> y
1496 <methodname>getVisibleIncrement()</methodname> :
1497 establece y recupera el incremento visible en el selector de
1498 tiempo; debe seguir los formatos ISO-8601. </para>
1503 <methodname>setVisibleRange($format)</methodname> y
1504 <methodname>getVisibleRange()</methodname> : establece y
1505 recupera el intervalo de tiempo visible en el selector de
1506 tiempo en cualquier momento; debe seguir los formatos
1511 <example id="zend.dojo.form.elements.timeTextBox.example">
1512 <title>Ejemplo de Uso del Elemento TimeTextBox dijit</title>
1514 <para>Lo siguiente creará un TimeTextBox que muestra 2 horas a la
1515 vez, con incrementos de 10 minutos.</para>
1517 <programlisting language="php"><![CDATA[
1522 'label' => 'TimeTextBox',
1524 'visibleRange' => 'T04:00:00',
1525 'visibleIncrement' => 'T00:10:00',
1526 'clickableIncrement' => 'T00:10:00',
1529 ]]></programlisting>
1533 <sect3 id="zend.dojo.form.elements.validationTextBox">
1534 <title>ValidationTextBox</title>
1536 <para> ValidationTextBox ofrece la posibilidad de añadir validaciones y
1537 limitaciones a una entrada de texto. Internamente, proviene de <link
1538 linkend="zend.dojo.form.elements.textBox">TextBox</link> , y
1539 añade los siguientes accessors y mutators para manejar parámetros
1545 <methodname>setInvalidMessage($message)</methodname> y
1546 <methodname>getInvalidMessage()</methodname> : establece
1547 y recupera el mensaje de tooltip para mostrar cuando el
1548 valor no se validó. </para>
1553 <methodname>setPromptMessage($message)</methodname> y
1554 <methodname>getPromptMessage()</methodname> : establece
1555 y recupera el mensaje de tooltip a mostrar para el uso del
1561 <methodname>setRegExp($regexp)</methodname> y
1562 <methodname>getRegExp()</methodname> : establece y
1563 recupera la expresión regular a utilizar para validar el
1564 elemento. La expresión regular no necesita límites (a
1565 diferencia de la familia de funciones preg*, de
1566 <acronym>PHP</acronym> ). </para>
1571 <methodname>setConstraint($key, $value)</methodname> y
1572 <methodname>getConstraint($key)</methodname> : establece
1573 y recupera restricciones adicionales para utilizar al
1574 validar el elemento; se utiliza principalmente con
1575 subclases. Las restricciones son almacenados en la clave
1576 'constraints' de los parámetros dijit. </para>
1581 <methodname>setConstraints(array $constraints)</methodname>
1582 y <methodname>getConstraints()</methodname> : establece y
1583 recupera las restricciones para utilizar al validar el
1584 elemento; se utiliza principalmente con subclases. </para>
1589 <methodname>hasConstraint($key)</methodname> : prueba si una
1590 restricción dada existe. </para>
1595 <methodname>removeConstraint($key)</methodname> y
1596 <methodname>clearConstraints()</methodname> : elimina
1597 una restricción individual o todas las restricciones para el
1602 <example id="zend.dojo.form.elements.validationTextBox.example">
1603 <title>Ejemplo de Uso del Elemento ValidationTextBox dijit</title>
1605 <para>Lo siguiente creará un ValidationTextBox que requiere un solo
1606 string compuesto exclusivamente por caracteres de palabra (es
1607 decir, sin espacios, la mayor parte de la puntuación es
1610 <programlisting language="php"><![CDATA[
1612 'ValidationTextBox',
1615 'label' => 'ValidationTextBox',
1617 'regExp' => '[\w]+',
1618 'invalidMessage' => 'Invalid non-space text.',
1621 ]]></programlisting>
1625 <sect3 id="zend.dojo.form.elements.verticalSlider">
1626 <title>VerticalSlider</title>
1628 <para> VerticalSlider es el hermano de <link
1629 linkend="zend.dojo.form.elements.horizontalSlider"
1630 >HorizontalSlider</link> , y opera en todos los sentidos como
1631 ese elemento. La única diferencia real es que los métodos 'top*' y
1632 'bottom*' son sustituidos por 'left*' y 'right*', y en lugar de
1633 utilizar HorizontalRule y HorizontalRuleLabels, debe usarse
1634 VerticalRule y VerticalRuleLabels. </para>
1636 <example id="zend.dojo.form.elements.verticalSlider.example">
1637 <title>Ejemplo de Uso del Elemento VerticalSlider dijit</title>
1639 <para>Lo siguiente creará una selección deslizante vertical con
1640 valores enteros desde -10 a 10. La izquierda tendrá etiquetas en
1641 las marcas correspondientes al 20%, 40%, 60%, y 80%. El derecho
1642 tiene reglas en un 0, 50%, y 100%. Cada vez que se cambie el
1643 valor, se actualizará el elemento oculto que almacena el
1646 <programlisting language="php"><![CDATA[
1651 'label' => 'VerticalSlider',
1653 'style' => 'height: 200px; width: 3em;',
1656 'discreteValues' => 11,
1657 'intermediateChanges' => true,
1658 'showButtons' => true,
1659 'leftDecorationDijit' => 'VerticalRuleLabels',
1660 'leftDecorationContainer' => 'leftContainer',
1661 'leftDecorationLabels' => array(
1669 'rightDecorationDijit' => 'VerticalRule',
1670 'rightDecorationContainer' => 'rightContainer',
1671 'rightDecorationLabels' => array(
1678 ]]></programlisting>