# Having functions for each Action Sheet button

**URL:** <https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019>\
**Category:** ionic-v1\
**Created:** [February 11, 2014, 8:12pm UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019 "2014-02-11T20:12:34Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [February 11, 2014, 8:12pm UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019/1 "2014-02-11T20:12:35Z")

</div>

Taking the standard markup for setting up an Action Sheet, I’m trying to create a function for each of the non-desctuctive buttons. So if my mark up is this:

```
$scope.show = function() {

    // Show the action sheet
    $ionicActionSheet.show({

      // The various non-destructive button choices
      buttons: [
        { text: 'Manual' },
        { text: 'See on Site' },
      ],

      // The text of the cancel button
      cancelText: 'Close',

      // Called when the sheet is cancelled, either from triggering the
      // cancel button, or tapping the backdrop, or using escape on the keyboard
      cancel: function() {
      },

      // Called when one of the non-destructive buttons is clicked, with
      // the index of the button that was clicked. Return
      // "true" to tell the action sheet to close. Return false to not close.
      buttonClicked: function(index) {
       return true;
      },

      // Called when the destructive button is clicked. Return true to close the
      // action sheet. False to keep it open
      destructiveButtonClicked: function() {
        return true;
      }
    });

  };

```

How do I expose the two buttons I have set up in my buttons array. Will this be similar to how left buttons and right buttons are set up for each controller?

---

<div class="post-metadata">

**Author:** ![mrameezraja](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mrameezraja/32/12745_2.png) [@mrameezraja](https://forum.ionicframework.com/u/mrameezraja)\
**Post date:** [February 12, 2014, 4:39am UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019/2 "2014-02-12T04:39:57Z")

</div>

```
buttonClicked: function(index) {
       if(index === 0){ // Manual Button
         alert('Manual button clicked...');
       }
       else if(index === 1){
        alert('See on Site button clicked...');
       }

       return true;
  }
```

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [February 12, 2014, 1:21pm UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019/3 "2014-02-12T13:21:51Z")

</div>

Awesome, thanks a lot

---

<div class="post-metadata">

**Author:** ![emgud](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/emgud/32/105512_2.png) [@emgud](https://forum.ionicframework.com/u/emgud)\
**Post date:** [December 21, 2016, 9:26am UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019/4 "2016-12-21T09:26:16Z")

</div>

I know this is an old thread, but I stumbled upon this looking for the same thing.  
Just wanted to share my approach in solving this.

```
var buttons = [
    { text: "My button", action: function() { alert("You pushed My button!"); } },
    { text: "Mah bahtton!", action: function() { alert("Mah bahtton?"); } }
]

$ionicActionSheet.show({
    buttons: buttons,
    buttonClicked: function(index) {
        if(buttons[index].action) {
            buttons[index].action()
        }

        return true
    }
});

```

This way the amount of if statements goes down and I think it makes the code a bit cleaner. 🙂

---

<div class="post-metadata">

**Author:** ![Dann01](https://avatars.discourse-cdn.com/v4/letter/d/848f3c/32.png) [@Dann01](https://forum.ionicframework.com/u/Dann01)\
**Post date:** [December 7, 2017, 8:17pm UTC](https://forum.ionicframework.com/t/having-functions-for-each-action-sheet-button/1019/5 "2017-12-07T20:17:10Z")

</div>

f it works, I have it this way…

```auto
 $scope.showActionsheet = function() {
 var buttons = [{id:1,text:"one"},{id:2,text:"two"},
                   {id:3,text:"three"},{id:4,text:"four"}];
     
    $ionicActionSheet.show({
        buttons: buttons,
             buttonClicked: function(index) {
            if(buttons[index].action) {
                buttons[index].action()
            }

            return true
        },
		 cancelText: 'Cancel',
		 cancel: function() {
		
		 }
    });

  };
   

```

 ![example](https://global.discourse-cdn.com/ionicframework/original/3X/5/6/56af5b2e4cfc9a76788d7df056fb1a4f3297beed.png)