Is it possible to add a Custom Salesforce Button from an installed package to a skuid page? The button is an Execute JavaScript

  • 1
  • Question
  • Updated 8 months ago
  • Answered
Is it possible to add a Custom Salesforce Button from an installed package to a skuid page?  The button is an Execute JavaScript
Photo of Jake Miller

Jake Miller

  • 146 Points 100 badge 2x thumb

Posted 8 months ago

  • 1
Photo of Bill McCullough

Bill McCullough, Champion

  • 12,436 Points 10k badge 2x thumb
Jake,

Add a Button Set or Page Title component to your page.  Then add a button and select 'Custom: SF Button/Link' as the Button Type.  Your button should show in the Custom Button / Link Name option.

Thanks,

Bill
Photo of Jake Miller

Jake Miller

  • 146 Points 100 badge 2x thumb
Thanks bill, I'll post JavaScript in below comment.
Photo of Jake Miller

Jake Miller

  • 146 Points 100 badge 2x thumb
// create the form. Set it up to POST the transaction 
f = document.createElement("form"); 
f.action="https://toutapp.com/components/add_to..."; 
f.method = "post"; 
f.target = "_blank"; 

// add the session id as a parameter 
i = document.createElement("input"); 
i.id = "session"; 
i.name = "session"; 
i.type = "hidden"; 
i.value = "{!API.Session_ID}"; 
f.appendChild(i); 

// add the server location as a parameter 
i = document.createElement("input"); 
i.id = "server"; 
i.name = "server"; 
i.type = "hidden"; 
i.value = "{!API.Partner_Server_URL_90}"; 
f.appendChild(i); 

// Get the Object IDs that were checked 
idArray = {!GETRECORDIDS($ObjectType.Contact)}; 

if(idArray.length > 0) { 
// add the idArray as a parameter 
i = document.createElement("input"); 
i.id = "ids"; 
i.name = "ids"; 
i.type = "hidden"; 
i.value = idArray; 
f.appendChild(i); 

// add the object type 
i = document.createElement("input"); 
i.id = "object_type"; 
i.name = "object_type"; 
i.type = "hidden"; 
i.value = "Contact"; 
f.appendChild(i); 

// add the form to the document. 
document.body.appendChild(f); 
var w = window.open("", "MySubWindow", "height=435,width=648"); 
f.target = "MySubWindow"; 
// submit the form 
f.submit(); 
} else { 
alert("Please select at least one Contact to add to a Tout Campaign."); 
}
(Edited)
Photo of Bill McCullough

Bill McCullough, Champion

  • 12,436 Points 10k badge 2x thumb
Jake,

Will you add this button to a page with a table of Contacts?  It looks like the code was setup to use contacts 'selected' in a table (what Skuid calls a Mass Action).  The reason for asking is that it changes how you would get the Contact Ids to put into the form submit.

The good news is that this script only needs a few changes.

Thanks,

Bill
Photo of Jake Miller

Jake Miller

  • 146 Points 100 badge 2x thumb
Correct, it is a table of Contacts with fields from Accounts as well.  So 3 models: Contacts, Accounts, User (to pull in Contacts/Accounts they own)
Photo of Bill McCullough

Bill McCullough, Champion

  • 12,436 Points 10k badge 2x thumb
Jake,

This is a sample page with the script included as a mass action on the table.  You will need to find the DOM element 'Id' of your table.  I changed mine to 'contactTable'.  

Thanks,

Bill


<skuidpage unsavedchangeswarning="yes" personalizationmode="server" useviewportmeta="true" showsidebar="true" showheader="true" tabtooverride="Contact">
    <models>
        <model id="Contact" limit="100" query="true" createrowifnonefound="false" datasource="salesforce" sobject="Contact">
            <fields>
                <field id="FirstName"/>
                <field id="LastName"/>
                <field id="CreatedDate"/>
                <field id="Id"/>
            </fields>
            <conditions/>
            <actions/>
        </model>
    </models>
    <components>
        <pagetitle model="Contact" uniqueid="sk-lNF-199">
            <maintitle>
                <template>{{Model.labelPlural}}</template>
            </maintitle>
            <subtitle>
                <template>Home</template>
            </subtitle>
            <actions>
                <action type="savecancel" uniqueid="sk-lNF-197"/>
            </actions>
        </pagetitle>
        <skootable showconditions="true" showsavecancel="false" searchmethod="server" searchbox="true" showexportbuttons="false" pagesize="10" createrecords="true" model="Contact" mode="read" allowcolumnreordering="true" uniqueid="contactTable">
            <fields>
                <field id="FirstName" hideable="true" allowordering="true" uniqueid="fi-lN9-939"/>
                <field id="LastName" hideable="true" allowordering="true" uniqueid="fi-lN9-940"/>
                <field id="CreatedDate" hideable="true" allowordering="true" uniqueid="fi-lN9-941"/>
            </fields>
            <rowactions/>
            <massactions usefirstitemasdefault="true">
                <action type="multi" label="Send to Toutapp" icon="sk-icon-import">
                    <actions>
                        <action type="custom" snippet="openToutapp"/>
                    </actions>
                </action>
            </massactions>
            <views>
                <view type="standard"/>
            </views>
            <searchfields/>
        </skootable>
    </components>
    <resources>
        <labels/>
        <css/>
        <javascript>
            <jsitem location="inlinesnippet" name="openToutapp" cachelocation="false">var params = arguments[0],
$ = skuid.$;
var sessionid = sforce.connection.sessionId;
var partnerurl = sforce.connection.partnerServerUrls[9];
console.log('sessionid');
console.log(sessionid);
console.log('partnerurl');
console.log(partnerurl);
var selected = skuid.component.getById("contactTable");
var items = selected.list.getSelectedItems();
console.log("items");
console.log(items);
// create the form. Set it up to POST the transaction 
f = document.createElement("form"); 
f.action="https://toutapp.com/components/add_to_campaign"
f.method = "post"; 
f.target = "_blank"; 
// add the session id as a parameter 
i = document.createElement("input"); 
i.id = "session"; 
i.name = "session"; 
i.type = "hidden"; 
i.value = sessionid; 
f.appendChild(i); 
// add the server location as a parameter 
i = document.createElement("input"); 
i.id = "server"; 
i.name = "server"; 
i.type = "hidden"; 
i.value = partnerurl; 
f.appendChild(i); 
// Get the Object IDs that were checked 
//idArray = {!GETRECORDIDS($ObjectType.Contact)}; 
var idArray=[];
for (var i=0; i &lt; items.length; i++) {
        idArray.push(items[i].row.Id);
}
console.log('idArray');
console.log(idArray);
if(idArray.length &gt; 0) { 
    // add the idArray as a parameter 
    i = document.createElement("input"); 
    i.id = "ids"; 
    i.name = "ids"; 
    i.type = "hidden"; 
    i.value = idArray; 
    f.appendChild(i); 
    
    // add the object type 
    i = document.createElement("input"); 
    i.id = "object_type"; 
    i.name = "object_type"; 
    i.type = "hidden"; 
    i.value = "Contact"; 
    f.appendChild(i); 
    
    // add the form to the document. 
    document.body.appendChild(f); 
    var w = window.open("", "MySubWindow", "height=435,width=648"); 
    f.target = "MySubWindow"; 
    // submit the form 
    f.submit(); 
} else { 
    alert("Please select at least one Contact to add to a Tout Campaign."); 
}</jsitem>
        </javascript>
        <actionsequences uniqueid="sk-lNF-248"/>
    </resources>
    <styles>
        <styleitem type="background" bgtype="none"/>
    </styles>
</skuidpage>