Jquery button click event was not firing - javascript

I was trying to validate form using jquery but button click event not firing in IE .
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btnResubmit2').click(function () {
alert('btnResubmit2 Here');
});
});
</script>
HTML code
<asp:Button ID="btnResubmit2" runat="server" Text="Resubmit" onclick="btnResubmit2_Click"/>
Could you please help me to resolve this issue.

Try the following...
JS
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btnResubmit2').click(function () {
alert('btnResubmit2 Here');
});
});
</script>
HTML
<asp:Button id="btnResubmit2" runat="server" Text="Resubmit"/>

get rid of the onclick attribute.
<asp:Button ID="btnResubmit2" runat="server" Text="Resubmit" />

Thanks to all.
I was using Asp.net button and it was worked after done some changes like as below. I really appreciate your immediate reply.
$(document).ready(function () {
$('#<%= Button1.ClientID %>').click(function () {
alert('btnResubmit2 Here');
});
});

Related

JQuery button OnClick not triggering

Hope everybody is having a good day. I had this buton and code, which worked for me.
I also followed the jQuery documentation: https://api.jquery.com/click/
$(function () {
$("#btnName").click(function () {
console.log("test");
});
}
I then upgraded webpack and JQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
If anybody can help me out that would be awesome. Thanks in advance.
Edit: HTML for button:
<!-- NEW CONTACT BUTTON -->
<div class="new-contact-buttons">
<div class="btn-grouped">
<button type="button" class="btn btn-default btn-block bottom" id="btnRetrieveCallerMatches" disabled style="display:none;">Retrieve
caller matches</button>
<button type="button" class="btn btn-default btn-block bottom" id="btnNewContactForm" disabled style="display:none;">New
contact</button>
</div>
</div>
I am now trying this code, but unfortunately its still not working:
$(function () {
$("#btnNewContactForm").click(function () {
console.log("######## clicked new contact")
});
});
I re-enable the button when I need it using:
$("#btnNewContactForm").show();
$("#btnNewContactForm").removeAttr("disabled");
And the button shows up so that piece of code works.
I also checked if the top function is being executed and it is.
Try this :
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
</head>
<body>
<button id="btnName">click me</button>
</body>
<script type="text/javascript">
$(document).ready(function () {
$("#btnName").on("click", function () {
console.log("test");
});
});
</script>
</html>
In each and every one of your examples you are forgetting to close your function, small syntax mistake, but the following code will work
$(function () {
$(document).ready(function() {
$("#btnName").click(function () {
console.log("test");
});
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btnName">Hi</button>
Just before the button code I had a sort method:
$(".phonebook table").tablesorter();
I think because the upgrade (webpack or jquery) this function stopped working and it wouldn't execute any code after this. So the code was fine all along but the binding code wasn't executing. Sorry for wasting everyones time.
When I put this code before the tablesorter everyting worked fine:
$("#btnNewContactForm").click(function () {
console.log("#######" + "saving new contact");
newContact();
});
$(function() {
$(document).on('click', "#btnName.app", function(e) {
e.preventDefault()
console.log("clicked");
});
});
you forgot to put ")" in the end of $(function(){...})

Can`t load JavaScript in ASP.NET

I want to test a simple JavaScript function in ASP.NET.
Movies/Index.cshtml
<!-- My local JavaScript File -->
<script src="~/Scripts/JavaScript.js" type="text/javascript"></script>
<input type="button" id="getPeople" value="Get People"/>
<ul id="people_list"/>
Views/Shared/_Layout.cshtml
<script src="~/Scripts/jquery-2.2.3.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="~/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="~/Scripts/JavaScript.js" type="text/javascript"></script>
/Scripts/JavaScript.js
$(document).ready(function ()
{
});
$('#getPeople').click(function ()
{
alert("getPeople");
}
I press the button but no alert appears. Why?
The click handler of '#getPeople' should be inside $(document).ready
$(document).ready(function ()
{
$('#getPeople').click(function ()
{
alert("getPeople");
}
});
Make sure
to import jQuery first (before importing /Scripts/JavaScript.js)
to add click handler inside document's ready event.
Check the output of your composed page (for example Developer tools in the browser), if you are uncertain.
$(document).ready(function () {
$('#getPeople').click(function () {
alert("getPeople");
});
});

JQuery trigger click event not working

I'm having trouble getting the following to work:
$('#elem').trigger('click');
When I run it, it doesn't trigger a click but it doesn't show any error logs in the console either.
I've also tried the following with no luck:
$('#elem')[0].click();
Any ideas as to what could be going wrong or a solution for this?
Update: Jquery is working and when I inspect the element, #elem does appear (it's an id for a button)
HTML:
<a:button id="elem">My Button</Button>
JQuery:
P.when('A', 'jQuery').execute(function (A, $) {
//when this function is called, it should trigger a button click
triggerButtonClick = function() {
$('#elem').trigger('click');
};
});
Try it in document.ready function, then all dom loads when the document is ready.You can do something like this based on your requirement.
$( document ).ready(function() {
$('#radio').click(function(){
$('#elem')[0].click();
})
});
i have tried this code and it works
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> </script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("chk1").click(function(){
$('#usr').trigger('click');
});
});
</script>
</head>
<body>
<form action="sample.php">
<button id="chk1">click</button>
<input class="form-control" type="submit" id="usr">
</form>
</body>
</html>
this code works for me:
$(window).load(function() {
$('#menu_toggle').trigger('click');
});
$(document).ready(function () {
$('#elem').click(function () {
alert('clicked');
$(this).css('color', 'red');
});
$('#elem').trigger('click');
});
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<body>
<div id="elem" >test</div>
</body>
</html>

Open my new page in pop up in asp.net

I have a regular page.When i clicked on a button it will be open in that page with some asp controls. what i need is that i want to open that page in a pop up page with close button inside it.I searched but i didn't find a properly cod for this. can any body help me?
thanks
<script type="text/javascript">
function OpenPopup() {
window.open("ProductClass.aspx", "List", "toolbar=no, location=no,status=yes,menubar=no,scrollbars=yes,resizable=no, width=900,height=500,left=430,top=100");
return false;
}
</script>
You can use windows.open in javascript.
<html>
<body>
<script type="text/javascript">
function windowOpen() {
myWindow=window.open('http://myurl.com','_blank','width=200,height=100, scrollbars=no,resizable=no')
myWindow.focus()
}
</script>
<input type="button" value="Open Window" onclick="windowOpen()">
</body>
</html>
Use return before your function
<html>
<body>
<script type="text/javascript">
function windowOpen() {
myWindow=window.open('http://myurl.com','_blank','width=200,height=100, scrollbars=no,resizable=no')
myWindow.focus()
return false;
}
</script>
<asp:button id="btnClick" text="Open Window" onClientClick="return windowOpen()">
</body>
</html>
Use the below code
ClientScript.RegisterStartupScript(typeof(Page), "MessagePopUp", "window.location.href = 'Home.aspx';", true);
hi all Kindly use the below code
function ShowPopup() {
$("#panOne").dialog({
autoOpen: true,
appendTo: "form",
height: 600,
width: 900
});
}
appendTo: "form" is Important as if you are not using it will autopostback all values

jquery, cannot have an ajax call in a callback function

<head>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#submit").click(function(){
$.get("invite_friends_session.php", function(){
});
});
});
</script>
</head>
<body>
<form >
<input type="submit" name="submit" id="submit" style="margin-top:100px; margin-left:100px;" />
</form>
</body>
the $.get("invite_friends_session.php") part does not work. But it works if i keep it outside the callback function.
But i need to call the invite_friends_session.php whenever there is a click on the #submit.
how to do that?
Since the submit button is inside a form, clicking the submit button bubbles up and submits the form. You need to add a return false to the end of the handler:
$("#submit").click(function(){
$.get("invite_friends_session.php", function(){
});
return false;
});
[Edit] You should prevent the default form submit action upon click.
$(document).ready(function(){
$("#submit").click(function(e){
e.preventDefault(); //edit
$.get({ url: "invite_friends_session.php",
success: function() {
alert('success');
},
error: function() {
alert('error');
},
complete: function() {
alert('complete');
}
});
});
});
Remove the <form> tags around the submit button. Since you're using jQuery's .get method, you don't need that form tag (technically, it doesn't even need to be a submit input button). Right now, it's trying to post using the form instead of getting the page via jquery.
Example: http://jsfiddle.net/R3CWp/
<head>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#submit").click(function(){
alert("i got clicked");
$.get("invite_friends_session.php", function(){
});
});
});
</script>
</head>
<body>
<input type="submit" name="submit" id="submit" style="margin-top:100px; margin-left:100px;" />
</body>

Categories

Resources