svn commit: r986370 - in /ofbiz/trunk/framework: common/webcommon/WEB-INF/ common/webcommon/includes/ common/widget/ example/config/ example/widget/example/ images/webapp/images/
Locked
svn commit: r986370 - in /ofbiz/trunk/framework: common/webcommon/WEB-INF/ common/webcommon/includes/ common/widget/ example/config/ example/widget/example/ images/webapp/images/
 
|
Author: jleroux
Date: Tue Aug 17 16:18:24 2010 New Revision: 986370 URL: http://svn.apache.org/viewvc?rev=986370&view=rev Log: Miscellaneous improvement in Form Widgets examples. Notably introduces an, as much as possible generalized (so far), dependent drop-downs example. I have introduced 2 couples of dependent drop-downs. The 1st one, country/states, is a common one and does not need (ie it's better to not) to be generalized. It can be used as is. It needs some pieces which are all included, see comments and follow... The 2d, category/products, have been taken as example but is not a good candidate. What if you get much categ or/and products? Anyway it's a good OOTB example and I had it at hand, so I used it. I have tried to generalize (abstract the couple of dropdowns) and it's almost there. The only issue I crossed, is when you want to use a couple of dependent drop-downs in the same form. As it's not a common case, the setDependentDropdownValuesJs.ftl template-script can be used in most cases... Added: ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl (with props) ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl (with props) ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js (with props) Modified: ofbiz/trunk/framework/common/webcommon/WEB-INF/common-controller.xml ofbiz/trunk/framework/common/widget/CommonScreens.xml ofbiz/trunk/framework/example/config/ExampleUiLabels.xml ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml ofbiz/trunk/framework/example/widget/example/FormWidgetExampleScreens.xml Modified: ofbiz/trunk/framework/common/webcommon/WEB-INF/common-controller.xml URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/webcommon/WEB-INF/common-controller.xml?rev=986370&r1=986369&r2=986370&view=diff ============================================================================== --- ofbiz/trunk/framework/common/webcommon/WEB-INF/common-controller.xml (original) +++ ofbiz/trunk/framework/common/webcommon/WEB-INF/common-controller.xml Tue Aug 17 16:18:24 2010 @@ -195,6 +195,25 @@ under the License. <response name="success" type="view" value="main"/> </request-map> + <!--========================== AJAX events =====================--> + <!-- to dynamically get products related to a product category --> + <request-map uri="getAssociatedProductsList"> + <security https="true" auth="false"/> + <event type="service" invoke="getAssociatedProductsList"/> + <response name="success" type="request" value="json"/> + <response name="error" type="request" value="json"/> + </request-map> + + <!-- to dynamically get states related to a country --> + <request-map uri="getAssociatedStateList"> + <security https="true" auth="false"/> + <event type="service" invoke="getAssociatedStateList"/> + <response name="success" type="request" value="json"/> + <response name="error" type="request" value="json"/> + </request-map> + <!--========================== AJAX events =====================--> + + <!-- View Mappings --> <view-map name="error" page="/error/error.jsp"/> <view-map name="main" type="none"/> Added: ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl?rev=986370&view=auto ============================================================================== --- ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl (added) +++ ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl Tue Aug 17 16:18:24 2010 @@ -0,0 +1,10 @@ +<script type="text/javascript"> +Event.observe(window, 'load', function() { + if ($('${dependentForm}')) { + Event.observe($('${dependentForm}_countryGeoId'), 'change', function() { + getDependentDropdownValues('getAssociatedStateList', 'countryGeoId', '${dependentForm}_countryGeoId', '${dependentForm}_stateProvinceGeoId', 'stateList', 'geoId', 'geoName', '', ''); + }); + getDependentDropdownValues('getAssociatedStateList', 'countryGeoId', '${dependentForm}_countryGeoId', '${dependentForm}_stateProvinceGeoId', 'stateList', 'geoId', 'geoName', '${selectedStateProvinceGeoId}', ''); + } +}) +</script> Propchange: ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/trunk/framework/common/webcommon/includes/setCountryStatesEventJs.ftl ------------------------------------------------------------------------------ svn:mime-type = text/plain Added: ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl?rev=986370&view=auto ============================================================================== --- ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl (added) +++ ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl Tue Aug 17 16:18:24 2010 @@ -0,0 +1,10 @@ +<script type="text/javascript"> +Event.observe(window, 'load', function() { + if ($('${dependentForm}')) { + Event.observe($('${dependentForm}_${mainId}'), 'change', function() { + getDependentDropdownValues('${requestName}', '${mainId}', '${dependentForm}_${mainId}', '${dependentForm}_${dependentId}', '${responseName}', '${dependentId}', '${descName}', '', ''); + }); + getDependentDropdownValues('${requestName}', '${mainId}', '${dependentForm}_${mainId}', '${dependentForm}_${dependentId}', '${responseName}', '${dependentId}', '${descName}', '${selectedDependentOption}', ''); + } +}) +</script> \ No newline at end of file Propchange: ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/trunk/framework/common/webcommon/includes/setDependentDropdownValuesJs.ftl ------------------------------------------------------------------------------ svn:mime-type = text/plain Modified: ofbiz/trunk/framework/common/widget/CommonScreens.xml URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/widget/CommonScreens.xml?rev=986370&r1=986369&r2=986370&view=diff ============================================================================== --- ofbiz/trunk/framework/common/widget/CommonScreens.xml (original) +++ ofbiz/trunk/framework/common/widget/CommonScreens.xml Tue Aug 17 16:18:24 2010 @@ -123,6 +123,8 @@ under the License. <set field="initialLocale" type="String" value="${groovy:parameters?.userLogin?.lastLocale?.substring(0,2)}" default-value="${groovy:locale?.toString()?.substring(0,2)?:'en'}"/> <set field="layoutSettings.javaScripts[]" value="/images/calendarDateSelect/locale/${initialLocale}.js" global="true"/> <set field="layoutSettings.javaScripts[]" value="/images/GooglemapMarkers.js" global="true"/> + <set field="layoutSettings.javaScripts[]" value="/images/getDependentDropdownValues.js" global="true"/> + <set field="layoutSettings.commonHeaderImageLinkUrl" from-field="layoutSettings.commonHeaderImageLinkUrl" default-value="main" global="true"/> <set field="visualThemeId" from-field="userPreferences.VISUAL_THEME" global="true"/> <service service-name="getVisualThemeResources"> Modified: ofbiz/trunk/framework/example/config/ExampleUiLabels.xml URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/example/config/ExampleUiLabels.xml?rev=986370&r1=986369&r2=986370&view=diff ============================================================================== --- ofbiz/trunk/framework/example/config/ExampleUiLabels.xml (original) +++ ofbiz/trunk/framework/example/config/ExampleUiLabels.xml Tue Aug 17 16:18:24 2010 @@ -215,6 +215,10 @@ <value xml:lang="fr"> - voir la défintion avec la form de nom </value> <value xml:lang="it"> - vedi la definizione della form con il nome</value> <value xml:lang="zh"> - åè§è¡¨åå®ä¹ï¼å称为</value> + </property> + <property key="ExampleDependentDropDowns"> + <value xml:lang="en">Dependent drop-downs</value> + <value xml:lang="fr">liste déroulante dépendantes</value> </property> <property key="ExampleDropDown"> <value xml:lang="en">drop-down</value> @@ -324,6 +328,10 @@ <value xml:lang="it">Campi drop down</value> <value xml:lang="zh">ä¸ææ¡æ°æ®é¡¹</value> </property> + <property key="ExampleDependentDropDownTooltip"> + <value xml:lang="en">Needs some fields to be set, see in FormWidgetExampleScreens.xml (begins with dependentForm)</value> + <value xml:lang="fr">Nécessite de définir certains champs, voir dans FormWidgetExampleScreens.xml (commence avec dependentForm)</value> + </property> <property key="ExampleDropDownTooltip"> <value xml:lang="en">First of all you have to define a drop-down element inside of the field element that you want to render as a drop down field.</value> <value xml:lang="fr">Pour commencer vous définissez un élément liste déroulante (drop-down) à l'intérieur de l'élément champ (field) que vous voulez créer comme liste déroulante</value> @@ -446,9 +454,13 @@ <value xml:lang="en">Layered lookup field (only test purp.)</value> <value xml:lang="fr">Lookup de type layer (only test)</value> </property> + <property key="ExampleLookupFieldsTitle"> + <value xml:lang="en">Lookup Fields</value> + <value xml:lang="fr">Champs de recherche</value> + </property> <property key="ExampleLookupFields"> - <value xml:lang="en">Examples Lookup Fields (first of type popup using also autocomplete, second layered and showing use of set_values underneath, ie returning not only Id but also another value)</value> - <value xml:lang="fr">Exemples de champs de recherche (le premier de type popup utilisant aussi l'autocompletion, le second de type layer avec usage sous-jacent de set_values qui permet de traiter non seulement une référence mais aussi une autre valeur)</value> + <value xml:lang="en">Lookup Fields: First of type popup, second layered and showing use of set_values underneath, ie returning not only Id but also another value. Both using also autocomplete</value> + <value xml:lang="fr">Champs de recherche: le premier de type popup, le second de type layer avec usage sous-jacent de set_values qui permet de traiter non seulement une référence mais aussi une autre valeur. Les 2 utilisent aussi l'autocompletion</value> </property> <property key="ExampleMainPage"> <value xml:lang="en">Example Main Page</value> @@ -550,7 +562,8 @@ <value xml:lang="zh">è¿ä¸ªæ ·ä¾ææ¬æå³çæ们å¤äºæ©å±è¡¨åä¸ã</value> </property> <property key="ExampleToDo"> - <value xml:lang="en">TODO</value> + <value xml:lang="en">Explanation TODO</value> + <value xml:lang="fr">Explication à faire</value> <value xml:lang="it">DA FARE</value> <value xml:lang="zh">å¾ å®ç°</value> </property> Modified: ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml?rev=986370&r1=986369&r2=986370&view=diff ============================================================================== --- ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml (original) +++ ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml Tue Aug 17 16:18:24 2010 @@ -215,19 +215,43 @@ under the License. <!-- *** field7 *** --> <!-- ***************** --> <field name="field7" - title="${uiLabelMap.ExampleDropDownField7Title}" - tooltip="${uiLabelMap.ExampleToDo}"> + title="${uiLabelMap.ExampleDropDownField7Title}" + tooltip="${uiLabelMap.ExampleToDo}"> <drop-down> <entity-options entity-name="ExampleType" - key-field-name="exampleTypeId" - description="${description}"> + key-field-name="exampleTypeId" + description="${description}"> <entity-constraint name="exampleTypeId" - value="INSPIRED" - operator="greater"/> + value="INSPIRED" + operator="greater"/> <entity-order-by field-name="description"/> </entity-options> </drop-down> </field> + <!-- ****************************** --> + <!-- *** Dependent dropdowns *** --> + <!-- ****************************** --> + <field name="emptyField" title="${uiLabelMap.CommonEmptyHeader}"><display/></field> + <field name="dependendDropDownFields" title="${uiLabelMap.ExampleDependentDropDowns}"> + <display description="${uiLabelMap.ExampleDependentDropDownTooltip}"/> + </field> + <field name="stateProvinceGeoId" title="${uiLabelMap.CommonState}" widget-style="required"><drop-down allow-empty="false"/></field> + <field name="countryGeoId" title="${uiLabelMap.CommonCountry}" tooltip="${uiLabelMap.CommonRequired}" widget-style="required"> + <drop-down no-current-selected-key="USA"> + <entity-options entity-name="Geo" key-field-name="geoId" description="${geoName}"> + <entity-constraint name="geoTypeId" value="COUNTRY"/> + <entity-order-by field-name="geoName"/> + </entity-options> + </drop-down> + </field> + + <field name="separator" title="${uiLabelMap.CommonEmptyHeader}"><display/></field> + <field name="productCategoryId" tooltip="${uiLabelMap.CommonRequired}" widget-style="required"> + <drop-down> + <entity-options entity-name="ProductCategory" key-field-name="productCategoryId" description="${categoryName } ${description}"/> + </drop-down> + </field> + <field name="productId" widget-style="required"><drop-down allow-empty="false"></drop-down></field> </form> <!-- Simple form to print a FOP PDF file with the fonts available in OFBiz Project --> Modified: ofbiz/trunk/framework/example/widget/example/FormWidgetExampleScreens.xml URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/example/widget/example/FormWidgetExampleScreens.xml?rev=986370&r1=986369&r2=986370&view=diff ============================================================================== --- ofbiz/trunk/framework/example/widget/example/FormWidgetExampleScreens.xml (original) +++ ofbiz/trunk/framework/example/widget/example/FormWidgetExampleScreens.xml Tue Aug 17 16:18:24 2010 @@ -51,11 +51,39 @@ under the License. <label>${uiLabelMap.ExampleDefinitionName} "DropDownFieldsExampleForm" ${uiLabelMap.ExampleDefinitionFile}</label> <link target="http://svn.apache.org/repos/asf/ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml" url-mode="plain" target-window="svnPage" text="${uiLabelMap.ExampleDefinitionFileTooltip}" style="buttontext"/> </container> - <include-form name="DropDownFieldsExampleForm" location="component://example/widget/example/FormWidgetExampleForms.xml"/> + <section> + <actions> + <!-- fields for the form where dependent dropdowns are--> + <set field="dependentForm" value="DropDownFieldsExampleForm"/> + + <!-- fields for setCountryStatesEventJs --> + <set field="selectedStateProvinceGeoId" from-field="postalAddress.stateProvinceGeoId" default-value="_none_"/><!-- postalAddress.stateProvinceGeoId does not make much sense here, only to get the idea --> + + <!-- fields for setDependentDropdownValuesJs.ftl, it's a try on generalization but there are still issues. For instance: what if we have 2 couple of dependent dropdowns in the same form? --> + <set field="mainId" value="productCategoryId"/><!-- here mainId and its key are same --> + <set field="dependentId" value="productId"/> + <set field="requestName" value="getAssociatedProductsList"/> + <set field="responseName" value="products"/> + <set field="dependentKeyName" value="productId"/> + <set field="descName" value="internalName"/> + <set field="selectedDependentOption" from-field="parameters.productId" default-value="_none_"/> + </actions> + <widgets> + <platform-specific><html><html-template location="component://common/webcommon/includes/setCountryStatesEventJs.ftl"/></html></platform-specific> + <platform-specific><html><html-template location="component://common/webcommon/includes/setDependentDropdownValuesJs.ftl"/></html></platform-specific> + <include-form name="DropDownFieldsExampleForm" location="component://example/widget/example/FormWidgetExampleForms.xml"/> + </widgets> + </section> </container> <container style="screenlet-body"> - <container style="button-bar"><label style="h2">${uiLabelMap.ExampleLookupFields}</label></container> - <include-form name="ExampleLookupFields" location="component://example/widget/example/FormWidgetExampleForms.xml"/> + <container style="button-bar"><label style="h2">${uiLabelMap.ExampleLookupFieldsTitle}</label></container> + <container style="screenlet-body"> + <label style="h3">${uiLabelMap.ExampleSourceCode}</label> + <label>${uiLabelMap.ExampleDefinitionName} "ExampleLookupFields" ${uiLabelMap.ExampleDefinitionFile}</label> + <link target="http://svn.apache.org/repos/asf/ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml" url-mode="plain" target-window="svnPage" text="${uiLabelMap.ExampleDefinitionFileTooltip}" style="buttontext"/> + <label>${uiLabelMap.ExampleLookupFields}</label> + <include-form name="ExampleLookupFields" location="component://example/widget/example/FormWidgetExampleForms.xml"/> + </container> </container> <container style="screenlet-body"> <container style="button-bar"><label style="h2">${uiLabelMap.ExampleGroupFields}</label></container> @@ -63,6 +91,10 @@ under the License. <label style="h3">${uiLabelMap.ExampleSourceCode}</label> <label>${uiLabelMap.ExampleDefinitionName} "FieldGroupExampleForm" ${uiLabelMap.ExampleDefinitionFile}</label> <link target="http://svn.apache.org/repos/asf/ofbiz/trunk/framework/example/widget/example/FormWidgetExampleForms.xml" url-mode="plain" target-window="svnPage" text="${uiLabelMap.ExampleDefinitionFileTooltip}" style="buttontext"/> + <container style="button-bar"> + <link target="javascript:expandAll(true);" text="${uiLabelMap.CommonExpandAll}" style="buttontext expand-all" url-mode="plain"/> + <link target="javascript:expandAll(false);" text="${uiLabelMap.CommonCollapseAll}" style="buttontext collapse-all" url-mode="plain"/> + </container> <include-form name="FieldGroupExampleForm" location="component://example/widget/example/FormWidgetExampleForms.xml"/> </container> </container> Added: ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js?rev=986370&view=auto ============================================================================== --- ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js (added) +++ ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js Tue Aug 17 16:18:24 2010 @@ -0,0 +1,67 @@ +// *** getDependentDropdownValues allows to dynamically populate a dependent dropdown on change on its parent dropdown, doesn't require any fixed naming convention +// request = request calling the service which retrieve the info from the DB, ex: getAssociatedStateList +// paramKey = parameter value used in the called service +// paramField = parent dropdown field Id (mainId) +// targetField = dependend dropdown field Id (dependentId) +// responseName = result returned by the service (using a standard json response, ie chaining json request) +// keyName = keyName of the dependent dropdown +// descName = name of the dependent dropdown description +// selected = optional name of a selected option +// callback = optional javascript function called at end +function getDependentDropdownValues(request, paramKey, paramField, targetField, responseName, keyName, descName, selected, callback) { + // parameters + var params = new Array(); + params[paramKey] = $F(paramField); + + var optionList = []; + var requestToSend = request; + new Ajax.Request(requestToSend, { + asynchronous: false, + parameters: params, + onSuccess: function(transport) { + var data = transport.responseText.evalJSON(true); + list = data[responseName]; + list.each(function(value) { + if (typeof value == 'string') { + values = value.split(': '); + if (values[1].indexOf(selected) >=0) { + optionList.push("<option selected='selected' value = "+values[1]+" >"+values[0]+"</option>"); + } else { + optionList.push("<option value = "+values[1]+" >"+values[0]+"</option>"); + } + } else { + if (value[keyName] == selected) { + optionList.push("<option selected='selected' value = " + value[keyName] +" >"+ value[descName] + "</option>"); + } else { + optionList.push("<option value = " + value[keyName] + " >" + value[descName] + "</option>"); + } + } + }); + $(targetField).update(optionList); + if ((list.size() < 1) || ((list.size() == 1) && list[0].indexOf("_NA_") >=0)) { + if ($(targetField).visible()) { + Effect.Fade(targetField, {duration: 1.5}); + } + } else { + if (!$(targetField).visible()) { + Effect.Appear(targetField, {duration: 0.0}); + } + } + if (callback != null) + eval(callback); + } + }); +} + +// calls any service already mounted as an event +function getServiceResult(request, params) { + var data; + new Ajax.Request(request, { + asynchronous: false, + parameters: params, + onSuccess: function(transport) { + data = transport.responseText.evalJSON(true); + } + }); + return data; +} Propchange: ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/trunk/framework/images/webapp/images/getDependentDropdownValues.js ------------------------------------------------------------------------------ svn:mime-type = text/plain |
«
Return to OFBiz - Commits
|
1 view|%1 views
| Free forum by Nabble | Edit this page |