+ Start a Discussion
KD119KD119 

Not able to get row id from datatable

Hi All,

 

I am using the Yahoo GUI in visualforce page 1 to open a dialog window. Within the dialog window I am opening visual force page 2 as an Iframe. 

Page 1 has  a grid of cases with a column for outputlink that will call the javascript to open the dialog box and pass the case Id to the script. This is where it fails because it keeps sending only the case id of the first case in the grid and not does not do it dynamically. Any help in getting this going will be appreciated.

<apex:page controller="caseController1" showheader="false" standardStylesheets="false">
    <apex:stylesheet value="{!URLFOR($Resource.Styles,'/css/core.css')}"/>
    <apex:stylesheet value="{!URLFOR($Resource.Styles,'/css/s.css')}"/>
    <apex:stylesheet value="{!URLFOR($Resource.Styles,'/css/shadowbox.css')}"/>
    <apex:stylesheet value="{!URLFOR($Resource.Styles,'/css/portal.css')}"/>
    <apex:stylesheet value="http://yui.yahooapis.com/2.6.0/build/assets/skins/sam/skin.css" /> 
    <apex:includescript value="http://yui.yahooapis.com/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js" />
    <apex:includescript value="http://yui.yahooapis.com/2.6.0/build/dragdrop/dragdrop-min.js" />
    <apex:includescript value="http://yui.yahooapis.com/2.6.0/build/container/container-min.js"/>
    <apex:includescript value="http://yui.yahooapis.com/2.6.0/build/animation/animation-min.js"/>
    <script>
        YAHOO.namespace("force.com");
        YAHOO.force.com.showComment = function(cId) {
            document.getElementById("mycomment").style.display = "block";
            document.getElementById("commentframe").setAttribute("src", "/apex/addComments_20?caseId="+cId);
            YAHOO.force.com.myDialogC.show();
        }
        YAHOO.force.com.showAttachment = function(caseId) {
            alert(caseId);
            document.getElementById("myattachment").style.display = "block";
            document.getElementById("attachmentframe").setAttribute("src", "/apex/addAttachment?cId="+caseId);
            YAHOO.force.com.myDialogA.show();
            caseid='';
        }
        YAHOO.force.com.hideComment = function() {
            YAHOO.force.com.myDialogC.hide();
        }
        YAHOO.force.com.hideAttachment = function() {
            YAHOO.force.com.myDialogA.hide();
        }
        YAHOO.force.com.init = function() {
            document.body.className = document.body.className + " yui-skin-sam";
            YAHOO.force.com.myDialogC = new YAHOO.widget.Panel(
                "mycomment",
                { 
                    width           :   "400px",
                    visible         :   false,
                    height          :   "150px",
                    xy              :  [350,50],
                    draggable       :   true,
                    close           :   true,
                    modal           :   true,
                    fixedCenter     :   true,
                    zindex          :   40,
                    effect          :   {effect:YAHOO.widget.ContainerEffect.FADE,duration:0.35} 
                }
            );
            YAHOO.force.com.myDialogC.render(document.body);
            YAHOO.force.com.myDialogA = new YAHOO.widget.Panel(
                "myattachment",
                { 
                    width           :   "425px",
                    visible         :   false,
                    height          :   "175px",
                    xy              :  [350,50],
                    draggable       :   true,
                    close           :   true,
                    modal           :   true,
                    fixedCenter     :   true,
                    zindex          :   40,
                    effect          :   {effect:YAHOO.widget.ContainerEffect.FADE,duration:0.35} 
                }
            );
            YAHOO.force.com.myDialogA.render(document.body);
        }
        YAHOO.util.Event.addListener(window, "load", YAHOO.force.com.init);
    </script>
    <apex:insert name="header">
        <c:PortalHeader />
    </apex:insert>
    <div id="container">
        <div id="content">
             <div id="left">
                <c:PortalNavLeftCases /> 
                <c:PortalNavLeftQuickLinks />
            </div>
            <div id="main">
                <div class="pagesection">
                    <apex:pagemessages />
                    <div class="topline">My Support Cases
                        <apex:form >
                            <apex:commandLink action="{!openNewCase}">
                                <apex:image style="float: right; width: 66px; height: 24px; margin-top: -21px; margin-right: 6px; padding-right:6px; padding-top:2px;" url="{!URLFOR($Resource.Styles,'/i/icons/new-case-btn-a.png')}"/>
                            </apex:commandLink>
                        </apex:form>
                    </div> <!-- closing topline div -->
                        <div style="overflow: auto; font-weight: normal; height: 350px; text-align: left;">
                            <apex:dataTable value="{!Cases}" var="c" id="cases" rowClasses="even,odd">
                                <apex:column headerValue="Case #" width="10%">
                                    <apex:outputText value="{!c.CaseNumber}" />
                                </apex:column>
                                <apex:column headerValue="Subject" width="30%">
                                    <apex:outputText value="{!c.Subject}" />
                                </apex:column>
                                <apex:column headerValue="Status" width="10%">
                                    <apex:outputText value="{!c.Status}" />
                                </apex:column>
                                <apex:column width="15%" style="text-align:right;">
                                    <apex:form >
                                    <apex:commandLink value="Add Comments" onclick="YAHOO.force.com.showComment('{!c.Id}');" reRender="noaction">
                                    </apex:commandLink>
                                    </apex:form>
                                </apex:column>
                                <apex:column width="15%" style="text-align:right;">
                                    <apex:form >
                                    <apex:commandLink value="Attach a File" onclick="YAHOO.force.com.showAttachment('{!c.Id}');" reRender="noaction">
                                    </apex:commandLink>
                                    </apex:form>
                                </apex:column>
                            </apex:dataTable>
                        </div> <!-- closing form div -->
                </div> <!-- closing pagesection div -->
                <p><strong>Contact Support</strong></p>
                <p>Contact CORAID Support for technical help, customer service questions and account assistance <i>
                <a href="mailto:support@coraid.com">support@coraid.com</a>.</i></p>
            </div> <!-- closing main div -->
        </div> <!-- closing content div -->
    </div> <!-- closing container div -->
    <apex:insert name="footer">
        <c:PortalFooter />
    </apex:insert>
    <apex:form >
        <div id="mycomment" style="display: none">
            <div class="hd">
                <apex:outputText value="Add Comments" />
            </div>
            <div class="bd" style="overflow:auto; background-color:fff;padding:10px;">
                <apex:iframe height="260px" width="400px" id="commentframe"/>
            </div>
        </div>
    </apex:form>
    <apex:form >
        <div id="myattachment" style="display: none">
            <div class="hd">
                <apex:outputText value="Add Attachments" />
            </div>
            <div class="bd" style="overflow:auto;background-color:fff;padding:10px;">
                <apex:iframe height="325px" width="415px" id="attachmentframe" scrolling="false"/>
            </div>
        </div>
    </apex:form>
    <apex:outputPanel id="noaction">
    </apex:outputPanel>
</apex:page>

That is code. Assistance required in passing the correct case Id when the link against that line is clicked.

 

Thanks

KD

SantoshiSantoshi

The problem is not with the way you are passing the CaseId parameter because thats correct. Can you please explain me the scenario what is happening when you click on the link because problem is somewhere else may be in the javascript or the page called. Also send the code of the controller used and the two pages referenced in the show comment and add attachment method.

KD119KD119

Hi,

 

Say for example the Case data table has 7 records shown in the UI. Which mean each of the row has  a link named add attachment. What I am trying to do is pass the Id of the case against which the user clicked. But currently it always takes only the case id of the First case in the datatable and not the one that is clicked on. As for this the controller class holds nothing it is all done within the UI using the Javascript.

 

Thanks

KD

KD119KD119

In the above example I replaced the CommandLink with the CommandButton and the functionality worked correctly. Would like to know what is the difference between the CommandLink and CommandButton with respect to calling a javascript.

 

Thanks

KD