[jira] Created: (TOMAHAWK-1394) s:tableSuggestAjax - s:outputText 'forValue' attribute works only with html SELECT tags

["Berinde Razvan (JIRA)" <de...@myfaces.apache.org>]

s:tableSuggestAjax - s:outputText  'forValue' attribute works only with html SELECT tags
----------------------------------------------------------------------------------------

                 Key: TOMAHAWK-1394
                 URL: https://issues.apache.org/jira/browse/TOMAHAWK-1394
             Project: MyFaces Tomahawk
          Issue Type: Improvement
          Components: AJAX Form Components
    Affects Versions: 1.1.8
         Environment: Tomahawk 1.1.8, Tomahawk Sandbox 1.1.9 SNAPSHOT
            Reporter: Berinde Razvan


I've used the tableSuggestAjax tag. 
I wanted to place an inputHidden tag in order to input the id from my Accounts and not their names in order to search the database faster.

In the Sandbox Tag Library Documentation for the s:outputText tag I found the following explanation for the forValue attribute:  "Specify the id of the dom element where the value should be put in. This value is also included in the suggested table, but only in a hidden span element following the span for the label in one row."

The forValue attribute only works with html SELECT tags. Another problem is the fact that you cannot have both "for" and "forValue" attributes in the same outputText tag, but this is not critical.

You can see my code, the source of the problem and a fix for the problem.


Code Snippet: 

             <t:inputHidden id="accountId" value="#{Bean.suggestedAccountId}" />
             <s:tableSuggestAjax
                     var="account"
                     id="accountName"
                     startRequest="2"
                     value="#{Bean.suggestedAccountName}"
                     betweenKeyUp="500"
                     charset="utf-8"
                     suggestedItemsMethod="#{Bean.suggestValues}"
                     maxSuggestedItems="10">
                     <t:column>
                        <f:facet name="header">
                           <s:outputText value="Account" />
                        </f:facet>
                        <s:outputText
                           for="accountName"
                           label="#{account.name}"  />
                     </t:column>
                     <t:column>
                        <f:facet name="header">
                           <s:outputText value="Description" />
                        </f:facet>
                        <s:outputText 
                             label="#{account.description}"
                             forValue="accountId" 
                             value ="#{account.id}" />
                     </t:column>
                  </s:tableSuggestAjax>

I wanted to set the account ID in the inputHidden field;

It won't work this way because of the org\apache\myfaces\custom\dojoextensions\resource\widget\TableSuggest.js.

In this JavaScript the following code only works with select tags and not input tags.

Mainly the second if "else if (column.forValue) " won't work only with select tags.

dojo.lang.forEach(tgt.suggestData, function(column) {
                if (column.forText) {
					if (column.forText === this.textInputNode.id) {
						this.setAllValues(column.label, column.label);
                                                if (this.textInputNode.onchange) {
                                                       this.textInputNode.onchange();
                                                }
                                       }
					else {
						var element = dojo.byId(column.forText);
						if (element) {
							if (element.tagName === "INPUT") {
								element.value = column.label;
                                                                if (element.onchange)
                                                                {
                                                                      element.onchange();
                                                                }
                                                        }
							else {
								element.innerHTML = column.label;
							}
						}
					}
				}
				else if (column.forValue) {
					var element = dojo.byId(column.forValue);
					for (i = 0; i < element.options.length; i++)
                                       {
						if (element.options[i].value == column.value) {
							element.options[i].selected = true;
						}
					}
				}
			}, this);


I have created a fix for this situation that will also work with input tags.

Here is the fix: 

dojo.lang.forEach(tgt.suggestData, function(column) {
                if (column.forText) {
					if (column.forText === this.textInputNode.id) {
						this.setAllValues(column.label, column.label);
                                                if (this.textInputNode.onchange) {
                                                       this.textInputNode.onchange();
                                                }
                                       }
					else {
						var element = dojo.byId(column.forText);
						if (element) {
							if (element.tagName === "INPUT") {
								element.value = column.label;
                                                                if (element.onchange)
                                                                {
                                                                      element.onchange();
                                                                }
                                                        }
							else {
								element.innerHTML = column.label;
							}
						}
					}
				}
				else if (column.forValue) {
					var element = dojo.byId(column.forValue);
					if (element.tagName === "SELECT") {
                                               for (i = 0; i < element.options.length; i++)
                                               {
						        if (element.options[i].value == column.value) {
							        element.options[i].selected = true;
						        }
					       }
                                       }
                                       else if (element.tagName === "INPUT") {
					      element.value = column.value;
                                             if (element.onchange)
                                             {
                                                     element.onchange();
                                             }
                                      }
				      else {
						element.innerHTML = column.value;
				      }
				}
			}, this);


The code is tested and works. Can you please include it in one of your releases.




-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.