Eiolon Posted October 25, 2012 Share Posted October 25, 2012 (edited) I am having problems getting jQuery to work on my computer which is running WAMPserver. Basically I used this code to see if it would alert me when the submit button was clicked. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://localhost/jquery/jquery-1.8.2.min.js"></script> <script type="text/javascript"> $('input#submit').on('click', function() { alert(1); )} </script> </head> <body> <form> <input type="text" id="field" /> <input type="submit" id="submit" value="Submit" /> </form> </body> </html> I get no alert when I click the button. I have tried it in IE9, Firefox 15 and Chrome. Does my web server need to be configured in some manner to allow Ajax to be used? EDIT: also tried moving the script to the end body tag. Edited October 25, 2012 by Eiolon Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/ Share on other sites More sharing options...
DavidAM Posted October 25, 2012 Share Posted October 25, 2012 At the time that that Javascript executes, the SUBMIT button does not exist (yet), so there is nothing to attach that function to. You need to wait until the document is finished loading. I usually use: /* When the page has finished loading, initialize any Javascript */ $(window).load(pageInit); function pageInit() { // Put your page initialization code here $('input#submit').on('click', function() { alert(1); )} } Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387762 Share on other sites More sharing options...
codefossa Posted October 25, 2012 Share Posted October 25, 2012 (edited) You should wrap everything in $.ready() function so it doesn't trigger until the page is loaded. Then on your action function, it's just $.click() then you need to close your bracket, then the parenthesis as that's the order they open in (backwards of course). Wrong $('input#submit').on('click', function() { alert(1); )} Correct $(document).ready(function() { $("#submit").click(function() { alert("A working example."); }); }): Edited October 25, 2012 by Kira Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387763 Share on other sites More sharing options...
codefossa Posted October 25, 2012 Share Posted October 25, 2012 Oh, by the way. When you do that. If that's actually a submission button, you may want to use an event.preventDefault() and return false to the click function so it doesn't submit, depending on what you want to do. Then it would also make more sense to use $.submit() on the form rather than the submission button, as not everyone actually clicks the button to submit, like myself. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387767 Share on other sites More sharing options...
Eiolon Posted October 25, 2012 Author Share Posted October 25, 2012 (edited) Thanks for your advice. I have tried it both methods suggested and I am still not getting the alert. I have uploaded it to my live web server and am not getting the alert. Here is my updated code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="jquery/jquery-1.8.2.min.js"></script> </head> <body> <form> <input type="text" id="field" /> <input type="submit" id="submit" value="Submit" /> </form> <script type="text/javascript"> $(document).ready(function(){ $("#submit").click(function() { alert("A working example."); }); }): </script> </body> </html> Sorry, the forums seem to lose all my formatting in code tags now. Edited October 25, 2012 by Eiolon Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387772 Share on other sites More sharing options...
codefossa Posted October 25, 2012 Share Posted October 25, 2012 Here's a working example that alerts the text value on form submission. http://xaotique.no-ip.org/tmp/10/ index.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Xaotique</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript" src="script.js"></script> </head> <body> <form method="post" action="" id="myform"> <input type="text" /> <input type="submit" value="Submit" /> </form> </body> </html> script.js $(document).ready(function() { $("#myform").submit(function(e) { e.preventDefault(); alert($("#myform input:first").val()); return false; }); }); Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387775 Share on other sites More sharing options...
Eiolon Posted October 25, 2012 Author Share Posted October 25, 2012 (edited) Okay, so that script works for me when I go to the link. If I create the script based on the source your provided and try it locally, it does not give the alert. If I upload that script to my live server, it DOES alert. So something is stopping it from working locally. Either WAMP or security settings of some sort. I have tried 3 major browsers and none of them work locally. It may be worth noting I tried this tutorial and it works on the website, but not locally. It works if I upload it to my live server. http://api.jquery.com/submit/ Edited October 25, 2012 by Eiolon Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387785 Share on other sites More sharing options...
Eiolon Posted October 26, 2012 Author Share Posted October 26, 2012 Alright, definitely looks like the computer has something going on. I just got home and just ran the script using WAMP and no problems. Now, spend time trying to figure this out or just wipe my work PC and start fresh ha ha. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387796 Share on other sites More sharing options...
Jessica Posted October 26, 2012 Share Posted October 26, 2012 Have you used firebug to debug it yet? Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387799 Share on other sites More sharing options...
Eiolon Posted October 26, 2012 Author Share Posted October 26, 2012 Yeah, that's the strange part. The value is getting passed. The same result from my work PC and my home PC in Firebug. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387803 Share on other sites More sharing options...
codefossa Posted October 26, 2012 Share Posted October 26, 2012 Javascript doesn't work locally like that as far as I know because of browser restrictions for security, so you can't do anything with local files. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387847 Share on other sites More sharing options...
Christian F. Posted October 26, 2012 Share Posted October 26, 2012 You can get JS to work on local files, but I've only tried it from HTML pages run on the local host. Even then I had to cut way back on the security settings, and endure a couple of warnings, before the browser let me do that. In short: It is extremely risky, and not recommended at all. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387883 Share on other sites More sharing options...
Eiolon Posted October 26, 2012 Author Share Posted October 26, 2012 Javascript doesn't work locally like that as far as I know because of browser restrictions for security, so you can't do anything with local files. That doesn't really make sense though. All the books I see tell you to install a webserver on your computer using WAMP or XAMP and work from there. All the Youtube tutorials I was trying to do clearly show the user using localhost for development. Those tutorials work fine on my personal PC but not my work computer. I just got to work and am going to nuke my PC. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387922 Share on other sites More sharing options...
Jessica Posted October 26, 2012 Share Posted October 26, 2012 I don't even follow you... what local files are you talking about? Are you saying you're just opening the file in the browser? Or are you running a webserver and going to localhost/file.ext? The first will not work, the second will. When you run it and it doesn't work, what happens in Firebug? Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387925 Share on other sites More sharing options...
Eiolon Posted October 26, 2012 Author Share Posted October 26, 2012 Success! I decided to remove my PC from our work domain to see if any group policies were stopping the scripts from working and all is well now. Now I just need to find out the policy that is preventing javascript from running before I can re-add it to the domain. Quote Link to comment https://forums.phpfreaks.com/topic/269916-problem-getting-jquery-to-work-in-general/#findComment-1387932 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.