I have a problem with the JS's confirm in my PartialView. The code below works fine if the page is NOT a PartialView, but, if the page IS a PartialView, if I click OK on that confirm dialog it does not close. Why ?
$("input.del-file-cb").live('click',function () {
if ($(this).is(':checked')) {
var ans = confirm('Are You sure ?');
if (ans) {
....
} else {
$(this).attr("checked", false);
}
}
});
Edit
It looks that it is a double confirmation... like here jQuery/Javascript confirm coming up twice
The solution:
$("input.del-file-cb").live('click',function (e) {
if ($(this).is(':checked')) {
e.preventDefault();
... the rest of the code ...
Related
We fave a CF7 form http://prntscr.com/v3ijfm, http://prntscr.com/v3ilpi .
Website url : https://loyard.it/
The task:
If the first radio button is clicked and form is submitted, redirect the user to url.
For other 2 radio buttons a plugin handles the task (After successful payment user is redirected).
I inserted the js in functions.php but it's not working .
add_action('wp_footer', 'redirect_cf7');
function redirect_cf7()
{
?>
<script>
document.addEventListener('wpcf7mailsent', function(event) {
$('#PayMeth input[name="radio-809"]').change(
function() {
if (this.checked && this.value == 'Paga alla consegna') {
location = 'https://www.google.md/';
}
});
}, false);
</script>
Any suggestions ? Thanks in advance !
Update: This works but the issue is its redirecting also for the other 2 radio buttons (
<script>
$('body #PayMeth input[name="radio-809"][value="Paga alla consegna"]').attr('checked', true).change(
document.addEventListener('wpcf7mailsent', function(event) {
window.location.href = 'https://loyard.it/thank-you/';
}, false));
</script>
f***ck this jQuery :P for me this is cleaner
const redirect = () => {
window.location.href = 'https://loyard.it/thank-you/';
};
const input = document.querySelector(`body #PayMeth input[name="radio-809"][value="Paga alla consegna"]`);
//console.log(input) - check that your selector works correctly
if(input){
input.addEventListener("change", (event) => {
if(event.target.value){
document.addEventListener('wpcf7mailsent', redirect);
} else {
document.removeEventListener('wpcf7mailsent', redirect);
}
})
}
Change line
$('#PayMeth input[name="radio-809"]').change(
with
$('body #PayMeth input[name="radio-809"]').change(
I am trying to create an alert, to insure that the user is submitting the correct information and if 'Ok' is clicked rather than cancel, the link is clicked and <a> sent. I have nearly achieved it, the alert activates, however does not activate if ok is clicked. Unfortunately, I am not a js wizard, yet..
EDIT :
click => preventDefault => alert (yes, no) if yes(send) if no dont.
<script>
jQuery(document).ready(function($){
$("input.btn-default").click(function(e){
e.preventDefault();
var answer=confirm('Are you sure that you want to do this?');
if(answer == true){
///not sure how to remove the prevent default and send link?!
}
else{
return;
}
});
});
</script>
Try the following code using return false; if the user cancel confirm dialog and window.open( $(this).att('href') ); to open the link when he user click OK :
$("input.btn-default").click(function(e)
{
e.preventDefault();
if( confirm('Are you sure that you want to do this?') )
{
window.open( $(this).att('href') );
}
else
{
return false;
}
});
Hope this helps.
confirm() is modal, so you just need to check for answer:
jQuery(document).ready(function ($) {
$("input.btn-default").click(function (e) {
var answer = confirm('Are you sure that you want to do this?');
if (!answer) {
e.preventDefault();
}
});
});
I am pretty new to javascript.
Working on a wordpress I typed the following function in the custom js for my theme:
document.getElementsByName("empty_cart")[0].onclick = function(e) {
var choice = confirm("Are You Sure ?");
if (!choice) {
//Cancel submit
e.preventDefault();
}
};
This script allows for an "Are you sure you want to empty the cart?" confirmation, and works fine.
but when I added the following script that I copy and pasted from my email campaign provider ( robly ) the "are you sure" confirmation stopped working.
$(document).ready(function () {
$("#robly_embedded_subscribe").click(function (e) {
e.preventDefault();
var email = $("#DATA0").val();
if (!is_valid_email_address(email)) {
alert("Please enter a valid email address.");
return false;
}
var f = $("#robly_embedded_subscribe_form");
f.submit();
return false;
});
});
function is_valid_email_address(emailAddress) {
var pattern = new RegExp(/^((([a-z]|d|[!#$%&'*+-/=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])+(.([a-z]|d|[!#$%&'*+-/=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])+)*)|((x22)((((x20|x09)*(x0dx0a))?(x20|x09)+)?(([x01-x08x0bx0cx0e-x1fx7f]|x21|[x23-x5b]|[x5d-x7e]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(([x01-x09x0bx0cx0d-x7f]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF]))))*(((x20|x09)*(x0dx0a))?(x20|x09)+)?(x22)))#((([a-z]|d|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(([a-z]|d|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])([a-z]|d|-|.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])*([a-z]|d|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF]))).)+(([a-z]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(([a-z]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])([a-z]|d|-|.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])*([a-z]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF]))).?$/i);
return pattern.test(emailAddress);
}
I have attempted to remove the function is_valid snippet and move that to my functions.php file in my child theme... but that didn't work.
If anyone could help me out I would really appreciate it.
If you need any further information from me, please ask.
Often times with WordPress you need to change all instances of $ to jQuery
For example:
$(document).ready(function () { ... });
would become:
jQuery(document).ready(function () { ... });
My case is that "System needs to ask to the user that 'are you going to open the image or to download it.?' by using a confirm box.. If user presses okay we should not prevent the default action of that anchor tag, let it go, but if user presses cancel the particular image should get downloaded...
HTML:
test
JS:
$('a').click(function (e) {
if (!$(this).is('[download]')) {
var cond = confirm('Press ok to view, cancel to save..');
if (!cond) {
e.preventDefault();
$(this).attr('download', 'download').click().removeAttr('download');
}
}
});
DEMO
Can anybody tell how to achieve this..?
You need to use this.click(); as HTMLElement.click() method simulates a mouse click on an element.
Whereas $(this).click(); will only trigger jquery click handler and onclick handler bounded to element nothing else.
$('a').click(function (e) {
if (!$(this).is('[download]')) {
var cond = confirm('Press ok to view, cancel to save..');
if (!cond) {
e.preventDefault();
$(this).attr('download', 'download');
this.click()
$(this).removeAttr('download');
}
}
});
DEMO
Try with this, $("a")[0].click() will do the trick
$('a').click(function (e) {
if (!$(this).is('[download]')) {
var cond = confirm('Press ok to view, cancel to save..');
if (!cond) {
e.preventDefault();
$(this).attr('download', 'download');
$("a")[0].click().removeAttr('download');
}
}
});
Demo
$('a').click(function (e) {
if (!$(this).is('[download]')) {
var resp = confirm("Press ok to view, cancel to save..!");
if (resp == true) {
// You pressed OK
e.preventDefault();
} else {
// Pressed Cancel!";
$(this).attr('download', 'download').click().removeAttr('download');
}
}
});
here you go working fiddle
http://jsfiddle.net/sajrashid/94Hra/18/
There is no need to mess with event bubbling with this one. Let the browser's default behavior take care of everything. Calling events manually always creates a mess. Control behavior with the download attribute. Add it or remove it based on your condition and pass the ball to browser.
Demo
Code:
$('a').click(function (e) {
var cond = confirm('Press ok to view, cancel to save..');
if (!cond) {
$(this).attr('download', 'download');
} else {
$(this).removeAttr('download');
}
});
I checked your code and got a solution
So you have to change your code a bit
you have add a name tag in your anchor tag like
test
Now replace your code
$('a').click(function (e) {
With this one
$(document).on("click","a[name='myevent']", function (e) {
I have an ASP.NET application and I have implemented the below code to disable users from double clicking and a submit button and thus the method behind the code is not executed than once.
OnClientClick="this.disabled = true; this.value = 'Submitting...';" UseSubmitBehavior="false" onclick="BtnSubmit_Click"
This was working perfectly, but on one of the pages I had implemented javascript forms validations and the below code is not working:
OnClientClick="return validation(); this.disabled = true;" UseSubmitBehavior="false" onclick="BtnAdd_Click"
The validation is to make sure user does not leave any empty fields, however on clicking the button if validation is success, the button is disabled but the onclick method is not being called.
Why exactly is this happening?
Rikket, you'll have to write separate code to prevent double submission of forms, once its submitted, a Jquery function will help probably, something like below, put this after your JavaScript validation function:
jQuery.fn.preventDoubleSubmission = function () {
var $form = $(this);
$form.on('submit', function (e) {
if ($form.data('submitted') === true) {
e.preventDefault();
} else {
$form.data('submitted', true);
}
}).find('input').on('change', function () {
$form.data('submitted', false);
});
return this;
};
And can be called after your validation inside the else :
if (nullFieldTracked == 'true') {
alert(nullExceptionMsg);
return false;
}
else {
$('form').preventDoubleSubmission();
}