Good Day Guys !
I have a problem here
I have 3
Prompt
Cert
Invoice
These 3 links load in the same page
if a click one link it will download.
but if i click it again i will not download
because i input a javascript like this
<script type="text/javascript">
{literal}
$(document).ready(function(){
var submitStatus = false;
$('a#promptButton').click(function(e){
if (!submitStatus) {
submitStatus = true;
} else {
e.preventDefault();
}
});
$('a#certButton').click(function(e){
if (!submitStatus) {
submitStatus = true;
} else {
e.preventDefault();
}
});
$('a#historyButton').click(function(e){
if (!submitStatus) {
submitStatus = true;
} else {
e.preventDefault();
}
});
$('a#invoiceButton').click(function(e){
if (!submitStatus) {
submitStatus = true;
} else {
e.preventDefault();
}
});
});
{/literal}
</script>
What will be my code if i want to download twice but i will prevent double submission?
Anybody can help me Please :(
This sample code may help to solve your issue.
HTML
<a href="http://www.google.com" target="_blank" >Google</a>
Yahoo
Stackoverflow
JS:
$('a').click(function(e){
$this = $(this);
if($this.data('disabled') == 'true'){
e.preventDefault();
setTimeout(function(){$this.data('disabled', 'false')}, 10); //Enable the anchor tag after 10 milliseconds
}else{
$this.data('disabled', 'true');
}
});
Demo: http://jsfiddle.net/rUrk4/6/
I have simple solution for you,
Just put this jQuery code after including JQuery ofcourse
<script type="text/javascript" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script type="text/javascript">$('a:visited').click(function(){return false;});</script>
this will prevent click on all visited links in your page. :)
So first time the click will work second time will not..
I hope this much explaination will do :)
Related
i have classic ASP form ,in that there is a hyperlink as follows.
<A href="javascript:ProcessForm()" >go here</A>
ProcessForm() submits the form to another page if validation is true.
function ProcessForm() {
if (validateform() == true) {
document.form1.action = "abc.asp";
document.form1.submit();
}
How can i disable the hyper link after a single click if validation is true? tried adding an id for the hyperlink and disabling it , then the text gets greyed out but on clicking the greyed text the page gets submitted multiple times. also tried with return false onclick.
Please suggest .
Set a global flag:
var hasSubmittedForm = false;
And then check that flag:
function ProcessForm() {
if (hasSubmittedForm) return false;
else hasSubmittedForm = true;
if (validateform() == true) {
document.form1.action = "abc.asp";
document.form1.submit();
}
}
Add an onclick event to your link:
<form name="form1" method="post" action="">
go here
</form>
<script type="text/javascript>
function validateform() {
return true;
}
function ProcessForm(link) {
if (validateform() == true) {
link.removeAttribute('href');
document.form1.action = 'abc.asp';
document.form1.submit();
}
}
</script>
You can make it with jQuery like this:
Here you go:
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function($){
$("#RemoveLink").click(function() {
var url = $(this).attr('href');
window.open(url);
$("#RemoveLink").removeAttr("href");
});
});
</script>
go here
Tested and working, tell me if this is not the functionality you want or mark my answer as answer for your question ;)
I am trying to set some text in window for single and double click in jquery.
But I am facing the ambiguity for double click.
When trying to do double click , first single click function works and then double click works.
Similar question is here check here and it was very old. Also it has some problem.
Any new answer using the latest jquery version.
Check the live demo here of my problem live demo
This my code ,
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<a id="press" href="http://jquery.com">Click here</a>
<div id="log"></div>
<script>
$("#press").click(function(event) {
event.preventDefault();
$("#log").text("I am single click !");
return false;
});
$("#press").dblclick(function(event) {
event.preventDefault();
$('#log').text("I am double click !");
return false;
});
</script>
</body>
</html>
Hope our stack users will help me.
The way around the problem is to use a timeout for the click event to give the user time to doubleclick.
If the user clicks twice within a certain timeframe, it's a doubleclick, if the user only clicks once, it's a normal click:
$('#press').click(function (event) {
event.preventDefault();
if ( $(this).data('dblclicked') ) {
$('#log').text('No google today!');
clearTimeout( $(this).data('clicked') );
$(this).data('dblclicked', false);
}else{
var self = this;
$(this).data('dblclicked', true).data('clicked', setTimeout(function() {
$('#log').text('google !');
$(self).data('dblclicked', false);
},300));
}
});
FIDDLE
I got the closest solution by ,
<a id="press" href="javascript:void(0)" onclick="singleClick(event)"
ondblclick="doubleClick(event)">Click here</a>
<div id="log"></div>
My JavaScript will be ,
var timer;
var status = 1;
function singleClick(event) {
event.preventDefault();
status = 1;
timer = setTimeout(function() {
if (status == 1) {
alert("I am single click !");
document.getElementById("log").innerHTML ='I am single click !';
}
}, 500);
}
function doubleClick(event) {
event.preventDefault();
clearTimeout(timer);
status = 0;
alert("I am double click !");
document.getElementById("log").innerHTML = 'I am a double click!';
}
My Requirement is to hide a tag initially, if user clicks forwardbutton without checking any radio or checkbutton we have show the tag and have to prevent page refresh. But it is permanently not submitting on click, Plese someone help me.
$(document).ready(function()
{
var y=$('input').filter(':checked').length;
alert(y);
if(y == 0 )
{
$('#Q1_7_label').parents('TR').hide();
}
$('#forwardbutton').live('click',function(event)
{
var x=$('input').filter(':checked').length;
if(x==0)
{
$('#Q1_7_label').parents('TR').show();
return false;
}
});
});
$('#forwardbutton').live('click',function(event)
{
var x=$('input').filter(':checked').length;
if(x==0)
{
$('#Q1_7_label').parents('TR').show();
return false;
}
return true;
});
Just add return true at the end of the function
Try to replace
return false;
with
event.preventDefault();
Let's say I have the following link:
Click Me!
When clicked this link will alert a message as well as appending a pound sign on the end of the page url. This doesn't look very pretty is there any way to avoid it besides using javascript in the url itself:
Click Me!
You have to prevent the default response from occurring.
The old-fashioned approach is to return false from it:
Click Me!
Or, better:
Click Me!
<script type="text/javascript">
window.onload = function() {
document.getElementById('myLink').onclick = function(event) {
alert('You clicked a link.');
return false;
};
};
</script>
The best approach nowadays is to call the proper method of the event property:
Click Me!
<script type="text/javascript">
window.onload = function() {
document.getElementById('myLink').onclick = function(event) {
alert('You clicked a link.');
event.preventDefault(); // <---
};
};
</script>
It's also best to replace that # with an URI to some proper page, for people not using JavaScript. In some jurisdictions, accessibility is in fact a legal requirement.
Edit Fixed for bleedin' IE:
function f() {
document.getElementById('myLink').onclick = function(e) {
alert('You clicked a link.');
if (!e) {
var e = window.event;
}
// e.cancelBubble is supported by IE - this will kill the bubbling process.
e.cancelBubble = true;
e.returnValue = false;
// e.stopPropagation works only in Firefox.
if (e.stopPropagation) {
e.stopPropagation();
e.preventDefault();
}
};
window.onload = f;
The trick is return false on the event handler.
Click Me!
I have a web page where i have 2 forms when i click the enter key, I am calling a javascript function to force the page to load another page.My code is
function SearchUser()
{
var text = document.getElementById("searchItem").value;
text = text == "" ? -1 : text;
var by = document.getElementById("listBy").value;
var on="";
if(by==1)
{
on="USERNAME";
}
else if(by==2)
{
on="FIRSTNAME";
}
else if(by==3)
{
on="EMAIL_ID";
}
gotoUrl="userlist.php?searchItem="+text+"&onSearch="+on;
alert(gotoUrl);
window.navigate=gotoUrl;
}
and
$(document).ready(function()
{
$("#frmUserListSearch").keyup(function(event)
{
if(event.keyCode == 13)
{
SearchUser();
}
});
});
But the page is doing a form submit when the SearchUSer function being called.I am getting the correct url in the alert.But The page is not loading in the brower
Any Ideas ???
Thanks in advance
if (document.addEventListener) {
document.getElementById('strip').addEventListener('keypress',HandleKeyPress,false);
} else {
document.getElementById('strip').onkeypress = HandleKeyPress;
}
function HandleKeyPress(e) {
switch (e.keyCode) {
case e.DOM_VK_ENTER:
if (e.preventDefault)
e.preventDefault();
else e.returnValue = false;
}
}
EDIT due to original Question edit:
all you need is:
$(document).ready(function()
{
$("#frmUserListSearch").keyup(function(event)
{
if(event.keyCode == 13)
{
SearchUser();
if (e.preventDefault)
e.preventDefault();
else e.returnValue = false;
}
});
});
edited to reflect comment
Returning false often does the trick.
http://javascript.about.com/library/bldisdef.htm
I have two recommendations. First, use the keydown event instead of keyup (it catches "enter" before submit better). Second, in your SearchUser() function, use window.location instead of window.navigate to go to the other page.
$(document).ready(function() {
$("#frmUserListSearch").keydown(function(event) {
if(event.keyCode == 13){
SearchUser();
return false;
}
});
});
NOTE: Don't forget to remove the "alert()" inside the SearchUser() function as it causes the form to submit before navigating away from the page.
You can do this by using the action attribute of the form, without having to deal with key events, granted that you will later need javascript to take action on the control that submits the form.
<html>
<head>
<script type="text/javascript">
function donothing() {}
</script>
<body>
<form action='javascript:donothing()'>
...
</form>
</body>
</html>