3

I'm trying to pull fields in my custom object by matching it with the parent Id in Visualforce with the new Lightning design. I've done it with Apex but am a little confused with remote objects. I believe I have the code right, but it won't render. Any ideas?

What I used to do with Apex would be below and I would render it by extending it as a controller.

private List<Custom_Object__c> ObjectList; public List<Custom_Object__c> getObjectList() { Opportunity opp = [Select Id FROM Opportunity where Id = :Opp.Id]; if (opp.Id == null) return null; ObjectList = [Select Id, Name, ObjectParentId, CustomField1, CustomField2, CustomField3 FROM Custom_Object__c WHERE ObjectParentId = :Opp.Id ORDER by CreateDate acs limit 1]; return ObjectList }

And here is my what I'm currently trying to do with javascript and remote object

<apex:remoteObjects> <apex:remoteObjectModel name="Custom_Object__c" fields="Id, Name, ObjectParentId, CustomField1, CustomField2, CustomField3"/> </apex:remoteObjects>

Javascript......

<script>
      var sap = new SObjectModel.Custom_Object__c();
      var outputDiv = documet.getElementById("objectList");
      function updateOutputDiv() {    

        sap.retrieve({
          WHERE: {ObjectParentId: {eq: '{!Opportunity.Id}'},
          ORDERBY: [{CreateDate: 'ASC'}], limit: 1,
          }, 
          function(error, records) {
            if (error) {
              alert(error.message);
            } else {
                  var html = '<div class="slds-scrollable--x"><table class="slds-table slds-table--bordered">';    

              html += '<thead><tr><th scope="col">Custom Object Subject</th>';
              html += '<th scope="col">Custom Object Data</th></tr></thead><tbody>';    


              records.forEach(function(record) {
                  html += '<tr><td>' + record.get("CustomField1") + '</td>';
                  html += '<td>' + record.get("CustomField2") + '</td>';
                  html += '<td>' + record.get("CustomField3") + '</td></tr>';
              });
              html = html + '</tbody></table></div>';
              outputDiv.innerHTML = html;
              });
            }
         });
      }
      updateOutputDiv();
</script>

And then my Visualforce html

<apex:page standardcontroller="Opportunity" extensions="OppCtrlExtSAP">
    <vs:importvisualstrap theme="paper"/>
    <apex:stylesheet value="{!URLFOR($Resource.SLDS080, 'assets/styles/salesforce lightning-design-system-vf.css')}" />

    <html xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink"> 
       <div class="slds">
          <div class="myapp">
             <div id="objectList" class="slds-p-vertical--medium"></div>
          </div>
       </div
    </html>
</apex:page>

any ideas would be greatly appreciated

Cheers

2 Answers 2

1

You need to fix up your JSON query object, as it is written now it is malformed. You are missing a } after the Where clause, and after your limit clause there should not be a , character.

{
  where:{ObjectParentId: {eq: '{!Opportunity.Id}'}},
  orderby: [{CreateDate: 'ASC'}], 
  limit: 1
}

Also looking at the Format and Options for Remote Objects Query Criteria documentation all key words ("where", "orderby", etc) are in lower case. I don't know how Salesforce handles these on their end, but since Javascript is case sensitive I would keep them all lower case.

var ct = new RemoteObjectModel.Contact();
ct.retrieve( 
    { where: { 
        FirstName: {eq: 'Marc'}, 
        LastName: {eq: 'Benioff'} 
    }, 
    orderby: [ {LastName: 'ASC'}, {FirstName: 'ASC'} ],
    limit: 1 },  
    function(err, records) { 
        if (err) { 
            alert(err); 
        } else { 
            console.log(records.length); 
            console.log(records[0]); 
        } 
    } 
);

Finally, I don't know how the '{!Opportunity.Id}' merge field would work in the JSON object. You may try assigning the value to a variable outside of the JSON object and then using the variable.

0

1)Are you calling your function properly ?Do you see any issues in your console to see if JS error has happened .

First look at it says for SLDS your entire code should be wrapped in SLDS container div like below

   <div id="content" class="slds">
       <div class="myapp">
       <div id="objectList" class="slds-p-vertical--medium"></div>
       </div>
   </div>

I did this but with little React JS there ,in case you are interested

http://cloudyworlds.blogspot.com/2015/09/reactjs-and-salesforce-lightning-slds.html

3
  • Hi Mohith, I do have the slds class wrapped in my code. Sorry for not including it. Thanks for letting me know though. I'll edit it
    – Andrew
    Commented Oct 1, 2015 at 0:48
  • Do you see any error in console .You can console.log the whole object that comes from Visualforce Remote Objects Commented Oct 1, 2015 at 1:08
  • Hi Mohith, thanks for the response. There are no errors in my console and I've also tried console logging and have no real results to show.
    – Andrew
    Commented Oct 1, 2015 at 20:44

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .