shaung Posted December 20, 2013 Share Posted December 20, 2013 Hello, I am new to JS and PHP. I cannot for the life of me get any js function to run, no matter how simple it is. I have the function in a seperate js file. The function pops up an alert that says hello. Of course I have bigger and better plans for what I want to do, but I have to get a basic js function to work before I can do that. What is the minimum I need to do to run a function from a button click? Here are some snippets. in my .js file: function sayHello() { alert('Hello'); } I am including the .js file using the web template from our dept at work, so I know it is correct. in the code I am calling it like this: <button onclick="sayHello();">Click Me</button> Nothing I do will make any javascript work. I know I am missing something very basic. Please.... thx Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/ Share on other sites More sharing options...
Psycho Posted December 20, 2013 Share Posted December 20, 2013 (edited) How, exactly, are you including the js file in the main page? Edited December 20, 2013 by Psycho Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462871 Share on other sites More sharing options...
Psycho Posted December 20, 2013 Share Posted December 20, 2013 This works for me: test.htm <html> <head> <script src="myscript.js"></script> </head> <body> <button onclick="sayHello();">Click Me</button> </body> </html> myscript.js function sayHello() { alert('Hello'); } Note that the js page needs to be in the same directory as the htm page. If not, the path to the js file will need to be modified in the script tag. Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462872 Share on other sites More sharing options...
shaung Posted December 21, 2013 Author Share Posted December 21, 2013 Here is how I am adding the js file (using our work template) //add additional ccs and js files (optional) $hccTemplate->addJSFile("lightview.js", "/lightview/js/"); $hccTemplate->addCSSFile("lightview.css", "/lightview/css/"); $hccTemplate->addCSSFile("jquery.dataTables.css", "https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/"); $hccTemplate->addJSFile("jquery.dataTables.min.js", "https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/"); $hccTemplate->addJSFile("dataTables.js", "required/"); $hccTemplate->addJSFile("showAddForm.js", "required/"); The js file I created is called showAddForm.js. The datatables work beautifully, so I know that the template is including the js files correctly. When I comment out the bottom line and add this: <script src="required/showAddForm.js"></script> <button onclick="showAddForm();">Click me</button> it still doesn't work. The code is in a php file, but not between php tags. Everything else in the file works but I just cannot for the life of me get my js to work. I'm wondering if I have it in the wrong location or something. "Click me" button shows, when I click it the page seems to reload, but nothing happens. Thanks for your help. Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462880 Share on other sites More sharing options...
jazzman1 Posted December 21, 2013 Share Posted December 21, 2013 Do you see the <script src="required/showAddForm.js"></script> tag when you try to open the page as a view source documment? What js debbuging tool are you using? Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462906 Share on other sites More sharing options...
shaung Posted December 22, 2013 Author Share Posted December 22, 2013 (edited) Nothing shows on the page when I click the button. I am using netbeans. I'm going to rewrite some of the page. Edited December 22, 2013 by shaung Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462935 Share on other sites More sharing options...
kicken Posted December 22, 2013 Share Posted December 22, 2013 When dealing with javascript mixed with PHP, it's best to load up your pages in the browser and then use the browsers view-source function to see what your PHP script generated and make sure the source is output correctly. Also use your browsers javascript console to check for any javascript errors. So load up your page and view-source. Make sure both your script tag importing the js file and the button's onclick attribute calling the function are there. If that checks out, click the button and then check your browsers javascript console for any error messages. Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1462972 Share on other sites More sharing options...
shaung Posted December 23, 2013 Author Share Posted December 23, 2013 (edited) When dealing with javascript mixed with PHP, it's best to load up your pages in the browser and then use the browsers view-source function to see what your PHP script generated and make sure the source is output correctly. Also use your browsers javascript console to check for any javascript errors. So load up your page and view-source. Make sure both your script tag importing the js file and the button's onclick attribute calling the function are there. If that checks out, click the button and then check your browsers javascript console for any error messages. The js page is loading correctly when I view source. When I look at the js console, I see this error: Failed to load resource: the server responded with a status of 404 (Not Found) Is it because I am calling the function from within php code? If so how do I get around it? I essentially want an iframe to popup with some data in it. The data that pops up is based on a hidden field in a row that the button is on, which is passed to the popup page. I have everything working but the popup, which I cannot get to work for the life of me. Today and tomorrow I finally have time to work on this. Once I get the popup working all I have to do is some input validation and I'm done. Thanks Edited December 23, 2013 by shaung Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1463021 Share on other sites More sharing options...
Psycho Posted December 23, 2013 Share Posted December 23, 2013 The js page is loading correctly when I view source. When I look at the js console, I see this error: Failed to load resource: the server responded with a status of 404 (Not Found) Hmm, I think the error is an indication that the JS file is not being loaded correctly. You are apparently using a custom function (addJSFile) to load your JS files. I don't think that is part of the JQuery framework (at least I can't find it) so I can't say if you are using it correctly or not. Also, Is it because I am calling the function from within php code? No where in your previous posts do you mention or show any code where you have PHP code within JavaScript code. You cannot execute PHP code within JavaScript (you can make a call to PHP code via AJAX). However, you can have PHP code that is used to create/modify JavaScript before it is sent to the user. For example function foo() { if(foo == true) { <?php callPhpFunction(); ?> } } The PHP function would be run at the time the page is requested from the server. Not when the JavaScript function foo() is called by the client. Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1463023 Share on other sites More sharing options...
shaung Posted December 23, 2013 Author Share Posted December 23, 2013 (edited) I fixed the "Failed to load resource: the server responded with a status of 404 (Not Found)" error. The lightview css and js were not in the right directory. Now the js console shows this error: Uncaught ReferenceError: Prototype is not defined. The error is in the lightview js file, but it is being skipped so it should still work. My real problem is below "No where in your previous posts do you mention or show any code where you have PHP code within JavaScript code." I don't have php within JS. I am calling the js function from within a PHP if statement. if(isset($_POST['update'])) //popup here sayHello(); } When I click the update button, this error shows in the browser: Fatal error: Call to undefined function sayHello() I am still unable to call a simple function. Edited December 23, 2013 by shaung Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1463027 Share on other sites More sharing options...
shaung Posted December 23, 2013 Author Share Posted December 23, 2013 (edited) Let me be a bit clearer what I'm trying to do. I have a database full of faculty info. When a user logs in, they are directed to a page depending which group they belong to. If they are a faculty member, they are shown their individual record as a single row in a table. If they are in the 'bookstore' group, they see all of the faculty records in a table. Each row shows the users information and an 'edit' button. When the edit button is clicked, I want a webpage to popup that contains editable form fields. They can edit their information as needed and it saves to the database. I have everything working except the popup. IT WON'T POPUP!! That's where I am at. Once I have the popup working all I have to do is input validation and I'm finished. I have been stuck on the popup part for at least three days now. Hope that helps. Edited December 23, 2013 by shaung Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1463028 Share on other sites More sharing options...
Solution Psycho Posted December 23, 2013 Solution Share Posted December 23, 2013 "No where in your previous posts do you mention or show any code where you have PHP code within JavaScript code." I don't have php within JS. I am calling the js function from within a PHP if statement. if(isset($_POST['update'])) //popup here sayHello(); } When I click the update button, this error shows in the browser: Fatal error: Call to undefined function sayHello() I am still unable to call a simple function. OK, I got that backwards. But, the same statement holds true - you never mentioned this in your previous posts. You can't do that. PHP code is executed on the server. JavaScript code is executed in the browser. They can interact only through client-server communications (e.g. AJAX). Each row shows the users information and an 'edit' button. When the edit button is clicked, I want a webpage to popup that contains editable form fields. They can edit their information as needed and it saves to the database. I have everything working except the popup. IT WON'T POPUP!! I think you are making this way more difficult than it needs to be. I would make your edit button call a JavaScript function that simply opens a web page - adding the ID of the record to the parameter list of the URL for that web page: <button onclick="showForm(15);">Edit</button> //15 is the ID of the record to be edited function showForm(id=false) { var url = 'http://mysite.com/user_form.php'; if(id!==false) { url += '?id=' + id; } window.open(url); } Then build the page user_form.php to check the value of $_GET['id'] when the page loads. If there is no value, then show the form in the "add" scenario. If there is a value, then get the data associated with the record with that ID and populate the form fields accordingly. Quote Link to comment https://forums.phpfreaks.com/topic/284881-call-a-function/#findComment-1463030 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.