Tapestry 5
  1. Tapestry 5
  2. TAP5-343

The Grid component generates non-unique HTML DOM ids for sort columns

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 5.0.16
    • Fix Version/s: 5.0.16
    • Component/s: tapestry-core
    • Labels:
      None

      Description

      If I use the Grid component multiple times in a page/component template then the generated HTML contains the same id multiple times:

      Template:
      <t:grid t:id="communicationList" t:source="address.communication" t:row="currentCommunication" t:rowIndex="currentRow"
      t:inPlace="true" t:volatile="true" t:include="id,type,value,isMain,dateModified">
      </t:grid>

      <t:grid t:id="addressList" t:source="contact.person.address" t:row="currentAddress" t:rowIndex="currentRow"
      t:inPlace="true" t:volatile="true" t:include="id,street,streetNumber,city,dateCreated,dateModified">
      </t:grid>

      Generated HTML:
      <thead><tr><th class="id t-first"><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/id/communicationList_0" id="sort_13">Id</a><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/id/communicationList_0" id="sort2_13"><img alt="[Sortable]" class="t-sort-icon" id="id:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="type">Type</th><th class="value"><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/value/communicationList_0" id="sort_14">Value</a><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/value/communicationList_0" id="sort2_14"><img alt="[Sortable]" class="t-sort-icon" id="value:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="isMain"><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/isMain/communicationList_0" id="sort_15">Is Main</a><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/isMain/communicationList_0" id="sort2_15"><img alt="[Sortable]" class="t-sort-icon" id="isMain:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="dateModified"><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/dateModified/communicationList_0" id="sort_16">Date Modified</a><a href="./addresslist.pc.personcontactedit.communicationlist.columns:sort/dateModified/communicationList_0" id="sort2_16"><img alt="[Sortable]" class="t-sort-icon" id="dateModified:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th></tr></thead>

      <thead><tr><th class="id t-first"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/id/addressList" id="sort_7">Id</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/id/addressList" id="sort2_7"><img alt="[Sortable]" class="t-sort-icon" id="id:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="street"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/street/addressList" id="sort_8">Street</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/street/addressList" id="sort2_8"><img alt="[Sortable]" class="t-sort-icon" id="street:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="streetNumber"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/streetNumber/addressList" id="sort_9">Street Number</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/streetNumber/addressList" id="sort2_9"><img alt="[Sortable]" class="t-sort-icon" id="streetNumber:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="city"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/city/addressList" id="sort_10">City</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/city/addressList" id="sort2_10"><img alt="[Sortable]" class="t-sort-icon" id="city:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="dateCreated"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/dateCreated/addressList" id="sort_11">Date Created</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/dateCreated/addressList" id="sort2_11"><img alt="[Sortable]" class="t-sort-icon" id="dateCreated:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th><th class="dateModified"><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/dateModified/addressList" id="sort_12">Date Modified</a><a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/dateModified/addressList" id="sort2_12"><img alt="[Sortable]" class="t-sort-icon" id="dateModified:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/></a></th></tr></thead>

      Column id and dateModified are the same:
      <img alt="[Sortable]" class="t-sort-icon" id="id:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/>
      <img alt="[Sortable]" class="t-sort-icon" id="id:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/>

      <img alt="[Sortable]" class="t-sort-icon" id="dateModified:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/>
      <img alt="[Sortable]" class="t-sort-icon" id="dateModified:sort" src="assets/5.0.15/tapestry/corelib/components/sortable.png"/>

      The DOM id of other elements are unique:
      <a href="./addresslist.pc.personcontactedit.addresslist.columns:sort/dateModified/addressList" id="sort2_12">

      Thanks,
      Andrej Aschenbrenner

        Activity

        Hide
        Howard M. Lewis Ship added a comment -

        There's no particular reason for the img elements to have an id; they can still be identified using CSS based on enclosing elements and class names.

        Show
        Howard M. Lewis Ship added a comment - There's no particular reason for the img elements to have an id; they can still be identified using CSS based on enclosing elements and class names.

          People

          • Assignee:
            Howard M. Lewis Ship
            Reporter:
            Andrej Aschenbrenner
          • Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved:

              Development