Displaytag last row's jQuery dialog can't load ajax

Question

I am using Struts 2 + display tag and Struts jQuery plugins in my project.

I am having some issues using the display tag.

This is my current markup:

<display:table style="width:100%" cellpadding="5" cellspacing="1" name="interviewAssList" class="dataTable" uid="interview" pagesize="5" sort="list" requestURI="getApplicantInterviewAssesment">

<display:column style="text-align: center;width:10%" title="Sr.No" >
    <s:property value="#attr.interview_rowNum"/>
</display:column>

<display:column style="text-align: left" title="Application ID"
    property="application.uniqueId" />

<display:column style="text-align: center" title="Name"
    property="application.firstName" />

<display:column style="text-align: center" title="Birth Date"
    property="application.dob" format="{0,date,dd/MM/yyyy}"/>

<display:column style="text-align: center" title="Marks">
    <s:property value="#attr.interview.marksObtained"/>
</display:column> 

<display:column style="text-align: center" title="Action" media="html" >
    <sj:dialog 
        id="editdialog" 
        buttons="{ 
            'Clear':function() { clearButton(); },
            'Add':function() { addButton(); } 
            }" 
        autoOpen="false" 
        modal="true" 
        title="Add Marks"
        href="%{ajax}"
        width="450"
    >
    </sj:dialog>
    <s:url id="ajax" value="/getApplicantDataInterviewAssesment.action?appId=%{#attr.interview.application.applicationId}"/>
    <s:param name="appId" value="%{#attr.interview.application.applicationId}"></s:param> 
    <sj:a 
        openDialog="editdialog" 
        button="true"
        buttonIcon="ui-icon-newwin"
    >
    Edit
    </sj:a>
</display:column>
</display:table>

When clicking on edit, a dialog opens which I can edit. However when clicking on the last row none of the Ajax content is loaded.

hi u may try any displaytag and jquery example the problem is there.. — Sanju, Sep 24 '11 at 06:47

Mark McLaren · Answer 1 · 2011-09-20T21:16:49.463

I am sure you know that Displaytag's column tag defines an object to be displayed in each row of your table (inside a table data cell, TD). Most commonly the column tag references a property from the objects in your collection. When the column tag is not an empty tag then the body will be evaluated.

In your example you specify your Struts jQuery tags inside you column tags. One issue you will have is that you are using the same ID (editdialog) for every row of table and with this tag library the ID becomes the HTML ID attribute. I expect the problem you are experiencing is due to this.

The standards specify that any given ID name can only be referenced once within a page or document. jQuery makes use of the ID uniqueness to target specific parts of your document. You have multiple ID's with the same name so your jQuery will get confused and stop working as expected.

You could try appending the _rowNum value to the end of your editdialog ID to ensure that each dialog is unique on your page. Alternatively, you could try having one dialog box (not encased in the displaytag) that was invoked differently by each row of the table causing different ajax calls - it might be easier to use raw jQuery for this instead of the Struts jQuery tag library.

Hello mark, thanks for answer and valuable inputs, as u said here that Id is differ than problem must be occur in any row not just n last row of table , as i had experience this problem each row has own dialog and content depend upon parameter in each row its working fine, but in last row there's something issue at here. — Sanju, Sep 24 '11 at 06:46

Displaytag last row's jQuery dialog can't load ajax

1 Answers1