Struts 2
  1. Struts 2
  2. WW-3231

s:radio cssStyle,cssClass attributes not respected when placed within s:form

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Minor Minor
    • Resolution: Fixed
    • Affects Version/s: 2.1.6
    • Fix Version/s: 2.3.7
    • Component/s: Plugin - Tags
    • Labels:
      None
    • Environment:

      Struts-2.1.6
      FF 3.0.11

      Description

      ///styles/main.css contents:
      radio.CustomClass

      { border: 1px solid black; background-color: InfoBackground; align:left; valign:middle }

      //test_for_lee.jsp contents
      <%@ taglib prefix="s" uri="/struts-tags" %>
      <%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
      <%@ page contentType="text/html;charset=UTF-8" language="java" %>

      <html>
      <head>
      <title>test for lee</title>
      <link href="<s:url value='/styles/main.css' encode='false' includeParams='none'/>" rel="stylesheet" type="text/css" media="all"/>
      </head>
      <body>

      <s:form action="shippingCostsAjax" method="post" id="shipzipform" name="shipzipform">
      <s:textfield name="shipzip" id="shipzip" size="8" label="Enter your ship-to zipcode to view shipping costs" labelposition="left" />

      <s:radio list="

      {'0','1','2'}

      " name="currentEmployee.level" cssClass="radio.CustomClass" cssStyle="

      { align:left;border-style:none; }

      "/>

      <sx:submit name="ajaxShippingSubmit" id="ajaxShippingSubmit" targets="shippingDiv" value="Get Shipping Costs" formId="shipzipform"
      align="left" ajaxAfterValidation="true" executeScripts="true"
      separateScripts="true" />

      </s:form>

      <s:radio list="

      {'0'}

      " name="lookup_id3" cssStyle="

      { align:left; }

      " value="0"/>
      <br>
      <s:radio list="

      {'1'}

      " name="lookup_id3" cssClass="radio.CustomClass" value="1" />
      </body>
      </html>

      when placed inside s:form s:radio cssClass and cssStyle attributes of s:radio within s:form are not respected and tag code is not rendered according to specified cssStyle or cssClass attributes of the s:radio tag

      when placed outside s:form s:radio cssClass and cssStyle attributes of s:radio ARE respected and DO render according to the supplied cssStyle or cssClass attributes of the s:radio tag

        Activity

        Hide
        Arthur Nogueira Neves added a comment -

        Hi,

        I can't simulate the problem, bellow follow the HTML result of your JSP:
        What's wrong it's happening?

        <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level0" value="0" class="radio.CustomClass" style="

        { align:left;border-style:none; }

        "/><label for="shipzipform_currentEmployee_level0">0</label>
        <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level1" value="1" class="radio.CustomClass" style="

        { align:left;border-style:none; }

        "/><label for="shipzipform_currentEmployee_level1">1</label>
        <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level2" value="2" class="radio.CustomClass" style="

        { align:left;border-style:none; }

        "/><label for="shipzipform_currentEmployee_level2">2</label>

        Show
        Arthur Nogueira Neves added a comment - Hi, I can't simulate the problem, bellow follow the HTML result of your JSP: What's wrong it's happening? <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level0" value="0" class="radio.CustomClass" style=" { align:left;border-style:none; } "/><label for="shipzipform_currentEmployee_level0">0</label> <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level1" value="1" class="radio.CustomClass" style=" { align:left;border-style:none; } "/><label for="shipzipform_currentEmployee_level1">1</label> <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level2" value="2" class="radio.CustomClass" style=" { align:left;border-style:none; } "/><label for="shipzipform_currentEmployee_level2">2</label>
        Hide
        Martin Gainty added a comment -

        straight html such as
        <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level0" value="0" class="radio.CustomClass" style="

        { align:left;border-style:none; }

        "/><label for="shipzipform_currentEmployee_level0">0</label>

        Struts tag s:radio when placed inside s:form does NOT render

        <%@ taglib prefix="s" uri="/struts-tags" %>
        <%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
        <%@ page contentType="text/html;charset=UTF-8" language="java" %>

        <html>
        <head>
        <title>test for lee</title>
        <link href="<s:url value='/styles/main.css' encode='false' includeParams='none'/>" rel="stylesheet" type="text/css" media="all"/>
        </head>
        <body>
        <div id="shippingDiv" style="display: none;"></div>
        <s:form action="shippingCostsAjax" method="post" id="shipzipform" name="shipzipform">
        <s:textfield name="shipzip" id="shipzip" size="8" label="Enter your ship-to zipcode to view shipping costs" labelposition="left" />

        <s:radio list="

        {'0','1','2'}

        " name="currentEmployee.level" cssClass="radio.CustomClass" cssStyle="

        { align:left;border-style:none; }

        "/>

        <sx:submit name="ajaxShippingSubmit" id="ajaxShippingSubmit" targets="shippingDiv" value="Get Shipping Costs" formId="shipzipform"
        align="left" ajaxAfterValidation="true" executeScripts="true"
        separateScripts="true" />

        </s:form>

        </body>
        </html>

        the requested cssStyle of align:left is not respected by s:form

        Show
        Martin Gainty added a comment - straight html such as <input type="radio" name="currentEmployee.level" id="shipzipform_currentEmployee_level0" value="0" class="radio.CustomClass" style=" { align:left;border-style:none; } "/><label for="shipzipform_currentEmployee_level0">0</label> Struts tag s:radio when placed inside s:form does NOT render <%@ taglib prefix="s" uri="/struts-tags" %> <%@ taglib prefix="sx" uri="/struts-dojo-tags" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>test for lee</title> <link href="<s:url value='/styles/main.css' encode='false' includeParams='none'/>" rel="stylesheet" type="text/css" media="all"/> </head> <body> <div id="shippingDiv" style="display: none;"></div> <s:form action="shippingCostsAjax" method="post" id="shipzipform" name="shipzipform"> <s:textfield name="shipzip" id="shipzip" size="8" label="Enter your ship-to zipcode to view shipping costs" labelposition="left" /> <s:radio list=" {'0','1','2'} " name="currentEmployee.level" cssClass="radio.CustomClass" cssStyle=" { align:left;border-style:none; } "/> <sx:submit name="ajaxShippingSubmit" id="ajaxShippingSubmit" targets="shippingDiv" value="Get Shipping Costs" formId="shipzipform" align="left" ajaxAfterValidation="true" executeScripts="true" separateScripts="true" /> </s:form> </body> </html> the requested cssStyle of align:left is not respected by s:form
        Hide
        Dave Newton added a comment -

        Include the rendered HTML for the form and radio. If it's rendering with the "style" attribute as reported in the previous comment then this isn't an issue with Struts but rather an issue with people's understanding of CSS.

        Show
        Dave Newton added a comment - Include the rendered HTML for the form and radio. If it's rendering with the "style" attribute as reported in the previous comment then this isn't an issue with Struts but rather an issue with people's understanding of CSS.
        Hide
        musachy added a comment -

        closing...

        Show
        musachy added a comment - closing...
        Hide
        musachy added a comment -

        reopening for closer examination, I think I missed something. Wes can you take a look?

        Show
        musachy added a comment - reopening for closer examination, I think I missed something. Wes can you take a look?
        Hide
        Lee Clemens added a comment - - edited

        This started with an attempt to have the radio options aligned to the left (as in each one in their own row), rather than being displayed in a single row.

        While I did notice the class="radio.customClass" being put into the <input> tags when using <s:radio cssClass="radio.customClass">, it was not rendering the radio options in red font (as I had created that css class).

        After I wrapped the <s:radio> tag with <div class='radio.customClass'>, the CSS style was rendered as expected (red font).

        The only way I found to get each radio option to appear on its own line was to modify radiomap.ftl to add <table> and <tr> tags, and then <td> tags inside the iterator.

        This solved the initial issue - but this potential rendering issue was discovered during its troubleshooting.

        Show
        Lee Clemens added a comment - - edited This started with an attempt to have the radio options aligned to the left (as in each one in their own row), rather than being displayed in a single row. While I did notice the class="radio.customClass" being put into the <input> tags when using <s:radio cssClass="radio.customClass">, it was not rendering the radio options in red font (as I had created that css class). After I wrapped the <s:radio> tag with <div class='radio.customClass'>, the CSS style was rendered as expected (red font). The only way I found to get each radio option to appear on its own line was to modify radiomap.ftl to add <table> and <tr> tags, and then <td> tags inside the iterator. This solved the initial issue - but this potential rendering issue was discovered during its troubleshooting.
        Hide
        Lukasz Lenart added a comment -

        Need investigation...

        Show
        Lukasz Lenart added a comment - Need investigation...
        Hide
        Lukasz Lenart added a comment -

        The problem is that the generated <label/> tag doesn't use provided cssClass and cssStyle

        Show
        Lukasz Lenart added a comment - The problem is that the generated <label/> tag doesn't use provided cssClass and cssStyle
        Hide
        Lukasz Lenart added a comment -

        Added cssStyle and cssClass to generated <label/> tag.

        Show
        Lukasz Lenart added a comment - Added cssStyle and cssClass to generated <label/> tag.
        Hide
        Hudson added a comment -

        Integrated in Struts2 #521 (See https://builds.apache.org/job/Struts2/521/)
        WW-3231 adds cssStyle and cssClass attributes to generated <label/> tag (Revision 1379561)

        Result = SUCCESS
        lukaszlenart :
        Files :

        • /struts/struts2/trunk/core/src/main/resources/template/simple/radiomap.ftl
        Show
        Hudson added a comment - Integrated in Struts2 #521 (See https://builds.apache.org/job/Struts2/521/ ) WW-3231 adds cssStyle and cssClass attributes to generated <label/> tag (Revision 1379561) Result = SUCCESS lukaszlenart : Files : /struts/struts2/trunk/core/src/main/resources/template/simple/radiomap.ftl

          People

          • Assignee:
            Lukasz Lenart
            Reporter:
            Martin Gainty
          • Votes:
            0 Vote for this issue
            Watchers:
            3 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved:

              Development