How to post form by clicking in anchor element - javascript

How to submit form by clicking in a element ?
I tried code below but Chrome sends it using http GET method. How to fix this so that form is sent using POST method ?
<html>
<body>
<form id="_form" method='post' target='_blank'>
<input type="email" value="me#company.com" name="_email" />
<a href='SendEMail?_entity=DokGReport&_dokumnrs=135361'
id='sendemail' class='button'>
Send
</a>
</form>
<script>
$(function () {
$('#sendemail').button({ icons: { primary: "ui-icon-mail-closed" } })
.click(function () {
$('#_form')[0].action = $(this).attr('href');
$('#_form')[0].submit();
});
});
</script>
</body>
</html>

You need to prevent the default action of clicking on the anchor, which is to follow the link:
$(function () {
$('#sendemail').button({ icons: { primary: "ui-icon-mail-closed" } })
.click(function (e) {
e.preventDefault(); // Don't follow the link normally
$('#_form').attr('action', $(this).attr('href')).submit();
});
});

Related

Click On window to add class on span

I can remove class when I click On button. I need To add the remove class again after I click on button and span display when I click On window
my HTML file
<button>Click To show Comment</button>
<span class="my_comment my_comment_none">Hello</span>
my CSS FILE
.my_comment{display: block} .my_comment_none{display: none}
my js File
$(document).ready(function () {
$("button").click(function () {
$(this).removeClass("my_comment_none");
});
});
You can attach the click event on document object and check the target name to hide or show the comment:
$(document).ready(function () {
$(document).click(function (e) {
if($(e.target).is('BUTTON'))
$('.my_comment').show();
else
$('.my_comment').hide();
});
});
.my_comment{display: none}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Click on the button to show the comment
and hide the comment on clicking anywhere else</div>
<button>Click To show Comment</button>
<span class="my_comment" id="comment">Hello</span>
use toggleClass
$(document).ready(function () {
$("button").click(function () {
$(this).toggleClass("my_comment_none");
});
});
for window click . maintain any unique id for button and use selectors with id
$(window).click(function () {
if ($('button').hasClass("my_comment_none")) {
$('button').removeClass("my_comment_none");
}
})
;
use toggleClass
$(document).ready(function () {
$("button").click(function () {
$(this).toggleClass("my_comment_none");
});
});
You may use simply jQuery slideToggle() function.
$("button").click(function(){
$(".toggle").slideToggle();
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click To hide/show</button>
<div class="toggle">Hello</div>

How to trigger mouse right click programmatically using javascript or jQuery

I need trigger mouse right click using javascript or jQuery.
Here I tried below code it is not working for me
<div id="testing" style="height:500px;width:1000px;background-color:lime;"></div>
<script>
$(document).ready(function () {
$('#testing').contextmenu();
//or
$('#testing').trigger({
type: 'mousedown',
which: 3
});
});
</script>
can you please any provide information on this.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div id="testing" style="height:500px;width:1000px;background-color:lime;"></div>
<script>
$(document).ready(function () {
$("#testing" ).contextmenu(function() {
alert( "Right clicked" );
});
});
</script>

How do I use dynamically created html/javascript with ASP.NET? [duplicate]

Please see the following code:
<body>
<form id="form1" runat="server">
<div>
<button id="helloButton">
Search</button>
<div id="hello">
</div>
<script type="text/javascript">
$(document).ready(
function () {
$('#helloButton').click(function () {
$('#hello').html('<div>hello world</div>');
});
});
</script>
</div>
</form>
When I use this script, all it does is flash "hello world", it doesn't keep it on the page. Does this has something to do with the click event? I'm trying to click the button and then leave the object on the page.
Otherwise you can simply do a return false which will do both
preventDefault and stop propagation
$('#helloButton').click(function (e) {
$('#hello').html('<div>hello world</div>');
return false;
});
in order to prevent the form from posting, so that you can see your changes, you need to call preventDefault()
$('#helloButton').click(function (e) {
e.preventDefault();
$('#hello').html('<div>hello world</div>');
});

Disable right click except some elements

I am using this code to disable right click on my page:
$(document).ready(function() {
$(document).bind("contextmenu",function(e) {
return false;
});
});
How can i add some exception, lets say when you right click on image the context menu should not be disabled.
Maybe something with stopPropagation but can't figure it out.
Thanks
with event.target:
$(document).ready(function() {
$(document).bind("contextmenu", function(e) {
if(!$(e.target).is('img')){
return false;
}
});
});
Try this:
<script type="text/javascript">
$(function () {
$('#btnClick').bind('contextmenu',function(e){
e.preventDefault();
alert('Right Click is not allowed');
});
});
</script>
<input type="text" /><br>
<input type="checkbox" />
<button id="btnClick">Click</button>
http://jsfiddle.net/NLJ6t/1/

How to enable/disable Anchor Tag

Below example is working for enable/disable of href but not for onclick. I need to enable/disable for both attributes
Note: I cant simply remove/bind the onclick event to dummy function() as it need once we enable it.
Script Code:
<script type="text/javascript">
$(document).ready(function () {
$("#b1").click(function () {
$("#yahoo").attr("disabled", "disabled");
$("#yahoo").css("background-color", "silver");
})
$("#b2").click(function () {
$("#yahoo").removeAttr("disabled");
$("#yahoo").css("background-color", "white");
})
$("#yahoo").click(function (e) {
if ($("#yahoo").attr("disabled") == "disabled") {
e.preventDefault();
}
});
});
</script>
HTML Code:
<div>
<input type="button" id="b1" value="Disable Yahoo Link">
<input type="button" id="b2" value="Enable Yahoo Link">
</div>
<a id="yahoo" target="_blank" href="javascript:alert('href alert')" onclick="javascript:alert('onclick alert')">Yahoo.com</a>
Working Example
http://jsfiddle.net/nunnakirankumar/suYe4/
Inside your click() function, you need to explicitly return false (after discovering it's disabled). Otherwise the default handler will cause the browser to go to or run the designated href.
The OP has most likely moved on, so this answer is really just for google searchers' sake.

Categories