+ Start a Discussion
manishtiwary1.390210540410199E12manishtiwary1.390210540410199E12 

Custom Button

Hi All,

I wanted to create multilevel button in my salesforce visulaforce.
PFB the snapshot
 User-added image
If I click on pdf I dhould get result in PDF
if i will click on excel I should get my data in Excel.
Ankit AroraAnkit Arora
You can create a picklist with both options which will be default to none. Now on change of this picklist you can call a method in class which will donwload the file if it is XLS and show the file if it is PDF.
manishtiwary1.390210540410199E12manishtiwary1.390210540410199E12
Hi Ankit,

Thank you for your answer.
But I want to use button as mention above
Ankit AroraAnkit Arora
I think you can achieve this by HTML buttons in select list.
Grazitti TeamGrazitti Team
Hi,

You can achieve this with the help of bootstarp platform.

Please find the link of bootstrap:

http://getbootstrap.com/getting-started/

Please see the code below for customize the dropdown:

<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul>
</div>

Once you complete the styling of the dropdown then you have to write javascript on anchor tag for onclick event.

If you are rerending the block in the page then you should call the action function from the javascript function.  Please see the sample code 1 for this.

Sample code 1:
jQuery('.dropdown-menu >li> a').on('click', function () {
                        var val = jQuery(this).text();
                        updateType(val);
                   });

<apex:form>
<apex:actionFunction name="updateType" action="{!updateType}" rerender="postWrapper" >
                    <apex:param name="param" assignTo="{!selectedType}" />
                </apex:actionFunction>
</apex:form>

If you are refershing the whole page after click on the anchor tag then you have to do post request form the javascript function. Please
see the sample code 2 for this:

Sample Code 2:
jQuery('.dropdown-menu >li> a').on('click', function () {
                        var val = jQuery(this).text();
                        location.href = "{!$Page.testPage}?selectedType="+val;
                   });

Let us know if you have any queries.

Please don't forget to Mark this as best answer if it resolves your issue.

Regards,
Grazitti Team
Web: www.grazitti.com
manishtiwary1.390210540410199E12manishtiwary1.390210540410199E12
Hi Grazitti , I am not using dropdown list. I want to use commond button to implement the same