Announcement Announcement Module
Collapse
No announcement yet.
Id Attribute in roo default tagx not accessible by dojo.byId Page Title Module
Move Remove Collapse
X
Conversation Detail Module
Collapse
  • Filter
  • Time
  • Show
Clear All
new posts

  • Id Attribute in roo default tagx not accessible by dojo.byId

    Hi ,

    The Id attribute provided in the default tag libray of roo , isnot accessible by dojo.byId function. But if i use the traditional tags like form:input tags then its working. But i completely lose my roo generated code. Is there are any way around ? I donot want to lose any of my roo code , i just want to get the element so that i can play around with ajax. Attaching the 2 codes of the pizzashop example , one which is working where i had to modify my code and the other where it is not working.

    Code:
    <?xml version="1.0" encoding="UTF-8" standalone="no"?>
    <div xmlns:util="urn:jsptagdir:/WEB-INF/tags/util" 
    xmlns:c="http://java.sun.com/jsp/jstl/core" 
    xmlns:form="http://www.springframework.org/tags/form" 
    xmlns:jsp="http://java.sun.com/JSP/Page" 
    xmlns:spring="http://www.springframework.org/tags" version="2.0">
        <jsp:directive.page contentType="text/html;charset=UTF-8"/>
        <jsp:output omit-xml-declaration="yes"/>
    <util:panel title="Pizza Order" id="panel">
    	
        <form:form id="toppingfm" method="POST" modelAttribute="topping" path="/toppings">
        <div>
           Topping Name: <form:input  path="name"  id="toppingName"/> <span id="availabilityNode"></span>
            <script type="text/javascript">
                Spring.addDecoration(
                        new Spring.ElementDecoration({
                            elementId : 'toppingName',
                            widgetType : 'dijit.form.ValidationTextBox',
                            widgetAttrs : {
                                invalidMessage: 'Name Invalid',
                                required: true}}));
            </script>
    		<br/>
    		</div>
    		<div class="submit">
    		<input id="proceed" type="submit" value="Save"  />
       		</div>
        </form:form>
     </util:panel>  	
    	        <script language="javascript">
    			dojo.addOnLoad(function(){
    				console.log("JS LOADED !!!'");
    				var availabilityNode = dojo.byId("availabilityNode");
    				var toppingNode = dojo.byId("toppingName");
    				dojo.connect(toppingNode,"onkeyup",function(){
    					var value = dojo.trim(toppingNode.value);
    					if(value != "") {
    					
    						dojo.xhrGet({
    						
    							url: "toppings/availability",
    							timeout: 2000,
    						
    							content: {
    								toppingParam : value 
    							},  handleAs : "text",
    							
    							load: function(result) {
    								if(result=='available') {
    									availabilityNode.innerHTML = "Topping Available!";
    								}
    								else {
    									availabilityNode.innerHTML = "Topping Unavailible";
    								}
    							}
    						});
    					}
    					else {
    						availabilityNode.innerHTML = "";
    					}
    				});
    			});
    		</script>
    
    </div>
    The Code Below is not working.

    Code:
    <?xml version="1.0" encoding="UTF-8" standalone="no"?>
    <div xmlns:c="http://java.sun.com/jsp/jstl/core" 
    xmlns:field="urn:jsptagdir:/WEB-INF/tags/form/fields" 
    xmlns:form="urn:jsptagdir:/WEB-INF/tags/form" 
    xmlns:jsp="http://java.sun.com/JSP/Page" 
    xmlns:spring="http://www.springframework.org/tags" version="2.0">
        <jsp:directive.page contentType="text/html;charset=UTF-8"/>
        <jsp:output omit-xml-declaration="yes"/>
        <script type="text/javascript">
    		dojo.require("dijit.Dialog");
        </script>
        <form:create id="fc_com_springsource_roo_pizzashop_domain_Base" modelAttribute="base" path="/bases" render="${empty dependencies}" z="vTeD+suDS2oKeu1rMNd36HdOHyQ=">
            <div id="baseName"><field:input field="name" id="c_com_springsource_roo_pizzashop_domain_Base_name" min="2" required="true" z="0y/fXoOb3k2Pgj0n5bH8ZHJgp20="/><span id="availabilityNode"></span></div>
        </form:create>
        <form:dependency dependencies="${dependencies}" id="d_com_springsource_roo_pizzashop_domain_Base" render="${not empty dependencies}" z="lvbM2d/hzq6OEpM/SnLW+i/SYFg="/>
    <script language="javascript">
    		
    			dojo.addOnLoad(function(){
    				console.log("JS LOADED !!!'");
    				 var thisdialog = new dijit.Dialog({ title:"Test", content: "JS Called !!!"});
    				 console.log(thisdialog.value);
    				
    				var availabilityNode = dojo.byId("availabilityNode");
    				var baseNode = dojo.byId("c_com_springsource_roo_pizzashop_domain_Base_name");
    				
    				dojo.connect(baseNode,"onkeyup",function(){
    					
    					var value = dojo.trim(baseNode.value);
    				
    					if(value != "") {
    						
    						dojo.xhrGet({
    					
    							url: "bases/availability",
    							timeout: 2000,
    						
    							content: {
    								baseParam : value 
    							},  handleAs : "text",
    						
    							load: function(result) {
    								if(result=='available') {
    									availabilityNode.innerHTML = "Base Available!";
    								}
    								else {
    									availabilityNode.innerHTML = "Base Unavailible";
    								}
    							}
    						});
    					}
    					else {
    						availabilityNode.innerHTML = "";
    					}
    				});
    			});
    		</script>
    
    </div>
    firebug shows me a null object error at this line

    var value = dojo.trim(baseNode.value);

    Please Help !!!

  • #2
    Hi

    from input.tagx
    <input id="_${sec_field}_id" name="${sec_field}" type="${fn:escapeXml(type)}" />
    and
    <c:set var="sec_field">
    <spring:escapeBody javaScriptEscape="true" >${field}</spring:escapeBody>
    </c:set>

    so id for name field input tag should be "_name_id"

    Comment


    • #3
      Hey that was really quick , Thanks ! It works like a charm now !

      Comment


      • #4
        Hi,
        I've this input.tagx:
        Code:
        ...
          <!-- gvNIX added attributes not included into Roo by default -->
          <jsp:directive.attribute name="value" type="java.lang.String" required="false" rtexprvalue="true" description="Force this string to be used as value at hidden input" />
          <jsp:directive.attribute name="size" type="java.lang.String" required="false" rtexprvalue="true" description="Size of the item to display" />
          
          <c:if test="${empty render or render}">
          
            <c:if test="${empty type}">
              <c:set value="text" var="type" />
            </c:if>
            
            <c:if test="${empty disabled}">
              <c:set value="false" var="disabled" />
            </c:if>
            
            <c:if test="${empty size}">
              <c:set value="15" var="size" />
            </c:if>
            
            <c:if test="${empty label}">
              <c:if test="${empty labelCode}">
                <c:set var="labelCode" value="${fn:substringAfter(id,'_')}" />
              </c:if>
              <spring:message code="label_${fn:toLowerCase(labelCode)}" var="label" htmlEscape="false" />
            </c:if>
            
            <c:if test="${empty validationMessage}">
              <c:choose>
                <c:when test="${empty validationMessageCode}">
                  <spring:message arguments="${fn:escapeXml(label)}" code="field_invalid" var="field_invalid" htmlEscape="false" />
                </c:when>
                <c:otherwise>
                  <spring:message arguments="${fn:escapeXml(label)}" code="${validationMessageCode}" var="field_invalid" htmlEscape="false" />
                </c:otherwise>
              </c:choose>
            </c:if>
            
            <c:if test="${empty required}">
              <c:set value="false" var="required" />
            </c:if>
            
            <c:set var="sec_field">
              <spring:escapeBody javaScriptEscape="true" >${field}</spring:escapeBody>
            </c:set>
            
            <!-- Set var properties required for form elements -->
            <c:set var="secParentId">
              <spring:escapeBody htmlEscape="true" javaScriptEscape="true">${parentId}</spring:escapeBody>
            </c:set>
            <c:set var="fieldPos" value="${pos.count - 1}" scope="request" />
            <!-- Field name with create or update sufix to avoid duplicated -->
            <c:choose>
              <c:when test="${empty item}">
                <c:set var="createOrUpdate" value="create" scope="request" />
              </c:when>
              <c:otherwise>
                <c:set var="createOrUpdate" value="update" scope="request" />
              </c:otherwise>
            </c:choose>
            <c:set var="fieldHiddenId" value="${secParentId}[${fieldPos}]_${sec_field}_id_${createOrUpdate}" scope="request" />
            <c:set var="fieldId" value="_${fieldHiddenId}" scope="request" />
            <c:set var="fieldMethod" value='${secParentId}_${fieldPos}_${fn:replace(sec_field, ".", "_")}_${createOrUpdate}' scope="request" />
            <c:set var="fieldName" value="list[${fieldPos}].${sec_field}" scope="request" />
            <c:set var="fieldStyle" value="gvNixTableData ${secParentId}_col_${sec_field}" scope="request" />
            <c:set var="pkField" value="${compositePkField}.${referenceField}" scope="request" />
        
            <c:choose>
        
              <!-- No item: Show a column header -->
              <c:when test="${item eq null and referenceName ne field and pkField ne field}">
                <!-- Create a header column when not hidden input type -->
                <c:if test="${type != 'hidden'}">
                  <th class="${fieldStyle}">
                    <c:out value="${label}" />
                    <c:set var="colCounter" value="${colCounter + 1}" scope="request" />
                  </th>
                </c:if>
              </c:when>
        
              <!-- When field is a reference, include it as hidden (detail pattern field relation with master pattern) -->      
              <c:when test="${referenceName eq field or pkField eq field}">
                <c:choose>
                  <c:when test="${empty item}">
                    <input type="hidden" id="${fieldId}" name="${fieldName}" value="${referenceValue}" />
                  </c:when>
                  <c:otherwise>
                    <input type="hidden" id="${fieldId}" name="${fieldName}" value="${referenceValue}" disabled="disabled" />
                  </c:otherwise>
                </c:choose>
              </c:when>
             
              <!-- Item is a hidden type: Create a hidden element with defined value without column -->
              <c:when test="${type eq 'hidden'}">
                <!-- Value if specified, else item field value -->
                <c:if test="${empty value and disableFormBinding}">
                  <c:set var="value" scope="request">
                    <spring:eval expression="item[field]" />
                  </c:set>
                </c:if>
                <input id="${fieldId}" name="${fieldName}" type="hidden" value="${value}" />     
              </c:when>
        
              <c:otherwise>
                <td class="${fieldStyle}">
                
                  <c:choose>
        
                    <!-- Item is a empty string: Create a column element without value for creation -->
                    <c:when test="${empty item}">
                      <!-- Visible field: used for user interaction with validations -->                    
                      <input id="${fieldId}" type="${type}" />
        				
                    </c:when>
                    <c:when test="${not empty item and disableFormBinding}">
                      <form:input id="${fieldId}" path="${field}" readonly="true" />
                    </c:when>
                    <!-- Item is not empty: Create a column element with value for update -->
                    <c:otherwise>
                      <!-- Visible field: used for user interaction with validations (initialy diabled) -->
                      <spring:eval expression="item[field]" scope="request" var="fieldValue" /> 
                      <input id="${fieldId}" type="${type}" value="${fieldValue}" disabled="disabled" size="${size}" />
                    </c:otherwise>
        
                  </c:choose>
                  
                  <!-- Hidden field: used only for form submit -->
                  <input id="${fieldHiddenId}" name="${fieldName}" type="hidden" />
                  
        
                  <!-- Roo input type validation definitions -->
                  <c:choose>
                    <c:when test="${required}">
                      <spring:message code="field_required" var="field_required" htmlEscape="false" />
                      <spring:message argumentSeparator="," arguments="${label},(${field_required})" code="field_simple_validation" var="field_validation" htmlEscape="false" />
                    </c:when>
                    <c:otherwise>
                      <spring:message argumentSeparator="," arguments="${label}, " code="field_simple_validation" var="field_validation" htmlEscape="false" />
                    </c:otherwise>
                  </c:choose>
                  <c:set var="sec_field">
        			<spring:escapeBody javaScriptEscape="true" >${field}</spring:escapeBody>
        		  </c:set>
                  <c:set var="sec_field_validation">
                    <spring:escapeBody javaScriptEscape="true">${field_validation}</spring:escapeBody>
                  </c:set>
                  <c:set var="sec_field_invalid">
                    <spring:escapeBody javaScriptEscape="true" htmlEscape="true">${field_invalid}</spring:escapeBody>
                  </c:set>
                  <c:set var="sec_field_required">
                    <spring:escapeBody javaScriptEscape="true">${field_required}</spring:escapeBody>
                  </c:set>
                  <c:set var="sec_validation_regex" value="" />
                  <c:if test="${!empty validationRegex}">
                    <c:set var="sec_validation_regex" value="regExp : '${validationRegex}', " />
                  </c:if>
        
                  <!-- On update or create button, activate and apply validation decorations to field -->
                  <script type="text/javascript"><![CDATA[
                  function ${fieldMethod}() {
                    // Get update or create button
                    var link = dojo.byId('${parentId}_${createOrUpdate}');
                    dojo.connect(link, "onclick", function(event) {
                      if (!gvNixEditMode) {
                        // Prevent an event's default behavior (e.g., a link from loading a new page)
                        event.preventDefault();
                        var decorate = true;
                        // On update, only apply validations if row selected; on create always apply
                        if ('${createOrUpdate}' == 'update') {
                          var checkbox = dojo.byId('gvnix_checkbox_${secParentId}_${fieldPos}');
                          decorate = checkbox.checked;
                        }
                        if (decorate) {
                          // Get field element to decorate
                          var field = dojo.byId('${fieldId}');
                          // Field keep disabled if required by input attribute
                          field.disabled = ${disabled};
                          Spring.addDecoration(new Spring.ElementDecoration({elementId : '${fieldId}', widgetType : 'dijit.form.ValidationTextBox', widgetAttrs : {promptMessage: '${sec_field_validation}', invalidMessage: '${sec_field_invalid}', required : ${required}, ${sec_validation_regex} missingMessage : '${sec_field_required}' }}));
                        }
                      }
                    });
                  }
                  dojo.addOnLoad(function() {
                    // On page load, invoke method to connect validation with link click
                    ${fieldMethod}();
                  });
                  ]]></script>
        
                </td>
              </c:otherwise>
              
            </c:choose>
        
          </c:if>
        </jsp:root>
        I set in this way:
        Code:
        ...
        <!-- Item is a empty string: Create a column element without value for creation -->
                    <c:when test="${empty item}">
                      <!-- Visible field: used for user interaction with validations                    
                      <input id="${fieldId}" type="${type}" />
                       -->
                      <input id="_${sec_field}_id" name="${sec_field}" type="${fn:escapeXml(type)}" />
        ...
         <!-- Roo input type validation definitions -->
                  <c:choose>
        ...
        <c:set var="sec_field">
        			<spring:escapeBody javaScriptEscape="true" >${field}</spring:escapeBody>
        		  </c:set>
        but do not work the add and deleting

        how should I set input.tagx?
        Last edited by eco.mondi; Aug 8th, 2013, 07:48 AM.

        Comment

        Working...
        X