improved
Source Link
highfive
  • 6.1k
  • 3
  • 25
  • 51

Have a variable to generate unique Ids

<apex:variable var="i" value="{!0}"/> 
<apex:repeat value="{!OfficesOpen}" var="off" >
    officeList.push('<table style="width:100%; border: 1px solid Gray;" cellpadding="10px" cellspacing="0px">'
                  +'<tr>'
                  +'<td style="vertical-align:center;text-align:center;color: white;font-weight: bold;width:25%;">{!off.Slogan__c}</td>'
                  +'<td style="vertical-align:center;float:left;width:75%;"><i>{!off.Location}</i>'
                  +'<a id="xClose'+{!i}+'" style="vertical-align:top;float:right;cursor: pointer;">X</a>'
                  +'</td>'
        +'</tr>'
        +'</table>');
    <apex:variable var="i" value="{!i+1}"/>
</apex:repeat>

$("a").click(function(){
   var aId = this.id;
   //You can add your logic here based on the id
   ...
   $("#OffLocations").hide();
});

UPDATE : added $("#OffLocations").hide(); so that answer is complete

Have a variable to generate unique Ids

<apex:variable var="i" value="{!0}"/> 
<apex:repeat value="{!OfficesOpen}" var="off" >
    officeList.push('<table style="width:100%; border: 1px solid Gray;" cellpadding="10px" cellspacing="0px">'
                  +'<tr>'
                  +'<td style="vertical-align:center;text-align:center;color: white;font-weight: bold;width:25%;">{!off.Slogan__c}</td>'
                  +'<td style="vertical-align:center;float:left;width:75%;"><i>{!off.Location}</i>'
                  +'<a id="xClose'+{!i}+'" style="vertical-align:top;float:right;cursor: pointer;">X</a>'
                  +'</td>'
        +'</tr>'
        +'</table>');
    <apex:variable var="i" value="{!i+1}"/>
</apex:repeat>

$("a").click(function(){
   var aId = this.id;
   //You can add your logic here based on the id
});

Have a variable to generate unique Ids

<apex:variable var="i" value="{!0}"/> 
<apex:repeat value="{!OfficesOpen}" var="off" >
    officeList.push('<table style="width:100%; border: 1px solid Gray;" cellpadding="10px" cellspacing="0px">'
                  +'<tr>'
                  +'<td style="vertical-align:center;text-align:center;color: white;font-weight: bold;width:25%;">{!off.Slogan__c}</td>'
                  +'<td style="vertical-align:center;float:left;width:75%;"><i>{!off.Location}</i>'
                  +'<a id="xClose'+{!i}+'" style="vertical-align:top;float:right;cursor: pointer;">X</a>'
                  +'</td>'
        +'</tr>'
        +'</table>');
    <apex:variable var="i" value="{!i+1}"/>
</apex:repeat>

$("a").click(function(){
   var aId = this.id;
   //You can add your logic here based on the id
   ...
   $("#OffLocations").hide();
});

UPDATE : added $("#OffLocations").hide(); so that answer is complete

Source Link
highfive
  • 6.1k
  • 3
  • 25
  • 51

Have a variable to generate unique Ids

<apex:variable var="i" value="{!0}"/> 
<apex:repeat value="{!OfficesOpen}" var="off" >
    officeList.push('<table style="width:100%; border: 1px solid Gray;" cellpadding="10px" cellspacing="0px">'
                  +'<tr>'
                  +'<td style="vertical-align:center;text-align:center;color: white;font-weight: bold;width:25%;">{!off.Slogan__c}</td>'
                  +'<td style="vertical-align:center;float:left;width:75%;"><i>{!off.Location}</i>'
                  +'<a id="xClose'+{!i}+'" style="vertical-align:top;float:right;cursor: pointer;">X</a>'
                  +'</td>'
        +'</tr>'
        +'</table>');
    <apex:variable var="i" value="{!i+1}"/>
</apex:repeat>

$("a").click(function(){
   var aId = this.id;
   //You can add your logic here based on the id
});