Button onlick show alert box - javascript

I have a modal and after pressing the password update button, the modal should close and an alert box should appear on my homepage. however, the alert box will not appear when the page is first opened. how can I do it? Do you have any examples you can share?

If you are using the alerts provided by the browser, you have to add a EventListener to your button like:
yourCloseButton.addEventListener("click", () => {
alert("The modal has been closed!");
});

Complementing Apollo79's answer, you can also use an inline event listener, but this is no longer recommended. There are some specific cases for this, but if you really don't need one, use Apollo79's answer instead.
<button id="urButton" onclick="alertAndDisappear()">
or
yourCloseButton.onclick = function(){}
which is equivalent to the first one.
Again, only use these if you really need them

Related

Run jquery inside sweet alert

I have some rows where the user can click and then I run a jQuery function, everything working fine.
As some rows have extra options I decided to load those extra options in a popup window using sweet alert and they should do the same (when the row inside the sweet alert is clicked run same function)
The problem is that the rows inside the sweet alert popup are not calling any function on click. Why can be this?
Can I use sweet alert for this or should I look for other plugin?
This is how I'm calling the jQuery function
$('.maincontent').on('click', '.betHandle', function () {
add(this);
});
I think there is one of two possible reasons it isn't working.
as #sweaver2112 has suggested, your .betHandle may not be under .maincontent in the DOM tree
you're adding the listener before .maincontent is added to the DOM
In either case, adding the listener to the body will work:
$('body').on('click', '.betHandle', function () {
add(this);
});

Click event not always triggering

I'm using the bootstrap editor jquery plugin. I'm trying to set an event listener to the add hyperlink button, but it only gets triggered when the text input next to it is empty, otherwise it does not fire. Here's my jsfiddle. My code:
$('.dropdown-menu button').on('click', function () {
alert("ADD clicked");
});
To test the jsfiddle, simple select some text and press add without inputting a URL.
Then, select the text again, input a URL and press add, no alert() will be shown.
Any ideas why this is happening?
Something in this line is changing the behaviour for a reason I can't see right now:
$(this).parent('.dropdown-menu').siblings('.dropdown-toggle').dropdown('toggle');
If you remove it, seems work, so, something in dropdown (i guess) is doing something wrong for you

Alertify for OnClick Event of Button

I'm trying to display a message that the user has clicked Delete button when he/she clicks on it. This is what I'm doing:
<script>
$('#button_del').on('click',function(e){
alertify.error('You have clicked on Delete!');
});
</script>
But no message appears when I click on the button. What am I doing wrong?
There are only four possibilities here:
You don't load your libraries correctly: jQuery and alertify.
There is no element with the button_del ID, or there are markup errors involving it.
You're not actually clicking #button_del.
4. the most likely one:
You need to attach the click handler when the document is loaded, otherwise #button_del is probably not available/loaded yet!
$(document).ready(function() {
$('#button_del').on('click',function(e){
alertify.error('You have clicked on Delete!');
});
});
Even if the first three conditions are met, you'd still have to change this.

How to click on button and pop up alert message using jQuery

I am unable to get the alert message to pop up. I have all the other jQuery code working, so I know I linked the library correctly. Could it be where I put it in the document that matters?
HTML:
<button type="button" class="cancelForm">Cancel</button>
jQuery:
$(".cancelForm").submit(function(){
alert('Are you sure you want to cancel?');
});
UPDATE: Still couldn't get it to work. I wil try relabeling later. Thanks for the tips.
$(".cancelForm").on('click', function(){
alert('Are you sure you want to cancel?');
});
You want an on click, not on submit.
$(".cancelForm").click(function()
Also - call your button's class something else (right now, it's "cancelForm", which implies that it's a form, which is confusing you - and will likely confuse developers that need to maintain the code after you.
Also - use a jquery dialog to show a message, not an alert().
The button type would need to be "submit" for this javascript to work. otherwise you would need to have an onclick event handler for the button.
I got it to work but putting the code within the document.ready section. Thank you for our help

Remove focus programmatically?

I have a jquery ui dialog with tabs loaded dynamically/JSON with content. Due to the complexity, I can't really post a fiddle or a relevant code (too much code).
What's happening is that when the dialog opens, you can tab through the elements within the dialog, up to the first tab. After that, you cannot tab through to anywhere else. The focus is locked on that tab, even if you click elsewhere, that focus is locked on that tab.
I am unable to locate the actual cause of this issue.
So, how would I remove the focus programmatically?
This might help...
http://api.jquery.com/blur/
$('#tabName').blur();
Try triggering a blur event on the field you want to lose focus.
I'd put in a load of alerts to find where the JS is failing. E.g.
alert(1);
var a = 10;
alert(2);
var b = null;
alert(3);
a += 5;
alert(4);
b.hello();
alert(5);
Obviously in this example the last alert will be 4.
It is not a nice approach but everyone has to do it at some point.

Categories