<button class="fa fa-caret-down font-size-18px" style="border: none"
#pop="bs-popover"
[popover]="fil"
placement="bottom right"
[adaptivePosition]="true"
[outsideClick]="true"
(keydown)="keydownEvent($event,pop)">
</button>
In my angular application, I am using a button which will open a popover. But I want it to be a tag or something other than a button because the button will be activated when we press space or enter keys which I don't want. The code should be like this:
<i class="fa fa-caret-down font-size-18px" style="border: none"
#pop="bs-popover"
[popover]="fil"
placement="bottom right"
[adaptivePosition]="true"
[outsideClick]="true"
(keydown)="keydownEvent($event,pop)">
</i>
But this will not trigger the keydown event. What might be the reason for it what are the alternatives? Thanks
Related
<table border=0 align=center cellpadding=9>
<tr>
<td>
<button class="font-awesome-btn" onClick="window.location='/viewAllAdmins';" style="margin:auto; display:block;"><i class="fa fa-arrow-left" aria-hidden="true"></i> Go Back </button>
</td>
<td>
<button class="font-awesome-btn"> Submit <i class="fa fa-arrow-right" aria-hidden="true"></i></button>
</td>
</tr></table>
onClick event submitting form instead of bringing me to the provided URL.
That’s because your button is a submit button, and you did not suppress its default action. You could set type="button" to simply work around that.
But using a button is rather an “abuse” of that element in the first place here - if you simply want to link to somewhere else - then you should use a link, <a>. Format it to look like a button via CSS, if desired.
so I'm currently trying to disable a button but also have the same button type. If anyone can help me with examples it would be great! Thanks so much to the ones that help! :D
<!--- I want this one to be the working button. --->
<a
class="project-link"
target="_blank"
href="/gimkit"
>Use <i class="fas fa-check-circle"></i> </a
>
<!--- this one to be the button that doesn't work. (disabled)
--->
<a
class="project-link"
target="_blank"
href="/support"
>Help <i class="fas fa-question-circle"></i> </a
>
I want something like this, but have the Help Button with a question mark to be faded instead of the normal button.
https://i.stack.imgur.com/QXRMz.png
For <button> element, just add the disabled property:
<button type="button" disabled>Help</button>
I think the button-elements answer is the best solution.
But if you really want to stick with the Anchor-Tags, you could also try to add a helper css class. For example you can use something like this:
<a
class="project-link disabled"
target="_blank"
href="/support"
onclick="return false;"
>Help <i class="fas fa-question-circle"></i> </a
>
And the css of the .disabled class could look like this:
.project-link.disabled{
opacity:0.5;
}
My uib-popover is not hiding on outsideClick.
<button
tooltip-placement="bottom"
tooltip="{{'common.addRemoveColumn'| translate}}"
class="btn btn-default pull-right"
uib-popover
popover-trigger="'outsideClick'"
popover-placement="bottom"
uib-popover-template="'gridColumns.html'"
data-original-title="{{'common.customizeColumn'| translate}}">
<i class="fa fa-columns"></i>
</button>
I have followed these stackOverflow questions,
uib-popover not closing on outside click
How to hide uib-popover on click outside of the popover in angular JS?
and nothing solved the issue.
My angularJs version is 1.3.13.
My Bootstrap version is 3.2.0.
$scope.myTrigger = "outsideClick"
then
popover-trigger="myTrigger">Click Me</button>
Pls check in below URL:
https://codepen.io/minhdynasty/pen/ozvAPJ
It will close th pop up
I've been thinking about this for a little while and maybe i started the button wrong in the beginning but need to know what is the correct / best way to proceed.
I have the following code
<button class="more-button">FIND OUT MORE <i class="fa fa-chevron-right" aria-hidden="true"></i></button>
I thought I'd be able to hadd a a href after the class, but that didn't work.
At the moment I'm doing this
<button class="more-button">FIND OUT MORE <i class="fa fa-chevron-right" aria-hidden="true"></i></button>
Is this ok ?
Should I be doing something different ?
thanks.
Without using JavaScript the only thing that is the way, wich is most recommended.
You have to use a form tag and an action attribute like:
<form action="http://example.com">
<input type="submit" value="Examplevalue" />
</form>
You could also style a link as a button with css.
Testbutton
CSS:
button{
appearance: button;
moz-appearance: button;
webkit-appearance: button;
}
<form method="GET" action="YOUR_Url"><button type="submit">Text</button></form>
This should work if you replace YOUR_URL with the targeted URL.
I am new to programming and just trying to get a simple button to link to google. However it seems every time I press it, it disappears. Any help would be great.
Below I have put my simple button using Boostrap, I just used the button and added an href to link to google with an i class of fa-edit,
<a href="https://www.google.se" class="btn btn-danger">
<i class="fa fa-edit fa-fw"></i>
google
</a>
Fiddle link
I'm sure it's a silly mistake, but any help would be great.
If you add the target attribute it will know to open in a new window I think that is why you are not having any luck making it work in your fiddle.
<a class="btn btn-danger" href="https://www.google.se/"
target="_blank"> <i class="fa fa-edit fa-fw"></i> google</a>