+ Start a Discussion
SrBlancoSrBlanco 

s-control - Asset list to case detail page only works in >1 record is returned

Hi All,

Have written a s-control that returns a formatted list of assets for the account associated with a case.  I have hit a problem where no results are displayed if there is only one result returned.  >1 results render fine. 


Code:
<html>

<head>
<script src="/soap/ajax/10.0/connection.js"></script>

<script>

function initPage() {
var result = sforce.connection.query("Select Id, Name, Quantity, Support_Level__c, UsageEndDate from Asset Where AccountId = '{!Case.AccountId}' and UsageEndDate > today ");
var sb = new sforce.StringBuffer();
sb.append("<b>Current Assets for {!Account.Name}</b><br>");
sb.append("<hr>");
sb.append("<center><table width=90%><tr><td>Name</td><td>Qty</td><td>Support Level</td><td>End Date</td></tr>");

while (true) {
if (result.size > 0) {
for (i = 0; i < result.records.length; i++) {
var account = result.records[i];
sb.append("<tr>"); //<td>").append(i).append("</td>");
sb.append("</td><td> ").append(account.Name);
sb.append("</td><td> ").append(account.Quantity);
sb.append("</td><td><center> ").append(account.Support_Level__c);
sb.append("</td><td> ").append(account.UsageEndDate);
sb.append("</td></tr>");
}
}
if (result.done == "true") {
break;
} else {
result = sforce.connection.queryMore(result.queryLocator);
}
}
sb.append("</table>");
document.body.innerHTML = sb.toString();
}

</script>
</head>

<body onload="initPage();">
</body>

</html>

 Any and all help is appreciated.

-Michael

sfdcfoxsfdcfox
Use the QueryResultIterator instead; you might be accidently showing one record too few...

Code:
function initPage() {
  var result = sforce.connection.query("Select Id, Name, Quantity, Support_Level__c, UsageEndDate from Asset Where AccountId = '{!Case.AccountId}' and UsageEndDate > today ");
  var sb = new sforce.StringBuffer();
  var qr = new sforce.QueryResultIterator(result);

  sb.append("<b>Current Assets for {!Account.Name}</b><br>");
  sb.append("<hr>");
  sb.append("<center><table width=90%><tr><td>Name</td><td>Qty</td><td>Support Level</td><td>End Date</td></tr>");

  var i = 0;

  while(qr.hasNext())
  { var account = qr.next();
    sb.append("<tr>"); //<td>").append(i).append("</td>");
    i++;
    sb.append("</td><td> ").append(account.Name);
    sb.append("</td><td> ").append(account.Quantity);
    sb.append("</td><td><center> ").append(account.Support_Level__c);
    sb.append("</td><td> ").append(account.UsageEndDate);
    sb.append("</td></tr>");
  }

  sb.append("</table>");
  document.body.innerHTML = sb.toString();
}
The QueryResultIterator automatically takes care of the queryMore, running out of records, etc. You can use this as an easy way to make sure that all records are accounted for.
 

SrBlancoSrBlanco
Thanks sfdcfox!! That worked perfectly.  Next step, applying some CSS to make it pretty.  :)
steph1sourcesteph1source
Hi SrBlanco..I have very similar code but mine pulls in certain opptys for an account and I want to display this on the Account detail page. I have the scontrol working fine but the formatting is raw and I am really stuck as to how to get the look and feel to be more like the other related lists. Were you able to play around with the CSS to get something similar? Could you share the modifications that you made to the code to do this? thanks in advance..I am new to all of this so any help is very appreciated!
SrBlancoSrBlanco
Hi,

It took a fair amount of trial and error but I found that these resources helped:

http://www.salesforce.com/developer/tech-notes.jsp?tn=TN-16

http://wiki.apexdevnet.com/index.php/Stylesheets_and_S-Controls_Best_Practice_Guide

Here is the code I ended up with for reference:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<link href="/dCSS/Theme2/default/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet" >
<link href="/dCSS/Theme2/default/custom.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet" >
<html>
<head>
<script language="javascript" src="/soap/ajax/10.0/connection.js"></script>
<script type="text/javascript" src="/js/functions.js"></script>

<script language="javascript">
var qry = "Select Id, Name, Quantity, Support_Level__c, UsageEndDate ";
qry += "from Asset ";
qry += "Where AccountId = '{!Case.AccountId}' and UsageEndDate >= today and Cancel_Code__c = null";

function initPage() {
var result = sforce.connection.query(qry);
var sb = new sforce.StringBuffer();
var qr = new sforce.QueryResultIterator(result);
sb.append("<center><table width=90% class='list' border='0' cellspacing='0' cellpadding='0'>");
sb.append("<tr class='headerRow'>");
sb.append("<th align=left nowrap width=63%>Asset Name</th>");
sb.append("<th nowrap width=10%><center>Qty</th>");
sb.append("<th nowrap width=10%><center>Support Level</th>");
sb.append("<th nowrap width=12%><center>End Date</th>");
sb.append("<th width=10px></th>");
sb.append("</tr><tr><td colspan=5>");
sb.append("<DIV style=\"height:70px; overflow:auto;\"><table width=100% class='list' border='0' cellspacing='0' cellpadding='0'> ");

i = 0;
while (qr.hasNext()) {
var account = qr.next();
sb.append("<tr onmouseover=hiOn(this) onmouseout=hiOff(this)>");
sb.append("</td><td width=65%><a href=/{!Case.AccountId}#{!Case.AccountId}_RelatedAssetList_target target=_top>").append(account.Name).append("</a>");
sb.append("</td><td width=10%><center> ").append(account.Quantity);
sb.append("</td><td width=10%><center> ").append(account.Support_Level__c);
sb.append("</td><td width=15%><center> ").append(account.UsageEndDate);
sb.append("</td></tr>");
}

sb.append("</table></div></table></center>");
document.getElementById("AssetsTable").innerHTML = sb.toString();
}

</script>

</head>
<body class="case" style="background-color:#f3f3ec;" onload="initPage();">
<DIV class="bPageBlock secondaryPalette" style="background-image: none; border-bottom: none; border: none; background-color:#f3f3ec; "> <!--height:100px; overflow:auto;">-->
<DIV class=pbBody style="background-image: none; border-bottom: none; border: none; background-color:#f3f3ec;">
<DIV class=pbSubsection>

<div id="AssetsTable"></div>

</div>
</div>
</div>
</body>
</html>

 Hope that helps!

steph1sourcesteph1source

thanks a lot for this suggestion this helped immensely!  And I have no idea how I never came across those documents!

A couple of questions..are you using Internet Explorer or Firefox? For some reason the first column where I am showing Opportunity Name is centered in IE but left centered in Firefox. Do you how to get it to display left centered in IE? Also, for those Accounts that have multiple open opportunities (which is what I am showing in this 'related list') - how do I get it to size dynamically? Currently if there are more then 3 records in the related list the user has to use a scroll bar within the section to see the other records.

 

thanks again!

SrBlancoSrBlanco
Glad to help!

I am not that strong of a web developer so not sure I can help on the centering issue.  We pretty much use FF exclusively and I didnt even test it in IE. 

As to the auto-resize thing, I think you are limited by the size of the element on your page layouts so you are stuck with the scroll bars.  I put my s-control in it's own section so individuals could collapse it if they preferred.