Angular Strap V2's modal seems to have lost some functionality of V1, and I'm struggling to work out how to achieve what was fairly straightforward with V1 (using angular-strap's $modal service).
The documentation only shows an example where the modal is attached to a DOM element like a button and seems to be automatically wired to the click event. However I want to use other events eg SwipeLeft is a common convention for deleting something, but I'd like to pop up an "Are you sure?" modal prompt for this action. Is this possible?
Is there any way to use the V2 modal with any event other than the click event?
Looking at the source code, it looks like you can bind your own events, or use the default click event.
It should work if you add a data-trigger='myEvent' to your markup.
https://github.com/mgcrea/angular-strap/blob/master/src/modal/modal.js#L279
Related
I am using ui bootstrap for showing popover on some link. I need to handle click event on popover. I searched for handling click event on popover but didn't get how to register and then handle click event on it.
Here my code below:
a#notification(href='', popover='You got a new notification!!!', popover-placement='left', ng-click='onClickNotification()')
img.icon-notification(src='../images/speaker.png')
Is there some other way to register a click event listener on it?
Thanks
You can add event listenet like this: http://www.w3schools.com/jsref/dom_obj_event.asp
In below example it has two buttons "Add" and "ClearAll".
`http://jsfiddle.net/naveencgr/L3orucjm/3/`
"Add" button is inside the template which is loaded by backbone on view render and Clear All button is loaded normally as in html.
I had events for both the buttons in view, but click event on normally loaded button is not working . Why?
i have seen this question asked in backbone github forum. I thibk it is designed this way. each backbone view events only involved with items inside the view.
in order to use the outside event you either put thie inner view into theoutter view or simple use jquery event for it. basically backbone authors believe this is more elegant and secure and this will not be changed at least for now.
I have the following example.
Two kendo UI buttons and two regular buttons. Both should enable/disable the button on bottom. Only the regular buttons do and I don't understand why. Probably has something to do with the scope...
EDIT:
From another example I have, it seems like the scope is updated correctly but the ui is not updated. In my example i have another control that when I click it the ui is suddenly being updated.
Found the answer:
When clicking the kendo button the scope does change but it doesn't go through angular so angular doesn't know that the scope was changed so the digest cycle doesn't run.
So adding $scope.$apply(); at the end of the function triggers the digest.
Took the explanation from here.
I have a navigation view with one button in the toolbar. Based on the view pushed, the button's label and functionality should chang. I've managed to do this by creating many buttons and activating them as needed (hide/show)
Instead of doing that approach I'd like to have just one button and in the controller change the text and action. Something along these lines:
this.getButton().setHtml("new text");
this.getButton().action = "newaction";
setHtml works, but setting the action doesn't. Examining the button in the console, I see the action changes but when I click it, it responds to the previous action.
Any suggestions on how to approach this?
Thanks
You should use setText instead of setHtml that, err... Doesn't seem to exist! And setHandler to change the handler function.
Alternatively, since you say that you're working in a controller, you can attach a function to the click event of the button and, inside this listener function, decide what action to execute in the current context.
Demo Fiddle
I'd like to show some help text using a popover for the entire group of fields, not for each individual input.
In the fiddle, I'm simply using a mouseenter trigger to show how it should look like, but what I really want is to trigger it on focus for any input, but have the popover be positioned based on the parent element.
In non-angular land, I'd trigger a custom event (say groupenter) when any one of the fields is in focus, and have the popover listen to that event. I'd also debounce the corresponding groupleave event so the popover won't flicker as I tab around the inputs.
What's an angular-y way to accomplish that here?
(I think this patch helps, but it just got committed days ago)
Got it working!
I had to fork tooltip.js to add 'groupenter': 'groupleave' to triggerMap since there's no public api to add to the map.