Welcome to WebmasterWorld Guest from

Forum Moderators: coopster & jatar k

Message Too Old, No Replies

Working with PHP and javascript together



4:47 pm on May 11, 2010 (gmt 0)

5+ Year Member

Hi, I am developing the admin part of a school management system where the admin can add students, teachers, holidays, notices, etc. Now I have been given a sample website as a reference. In that sample website, on the left hand side there is a list as below:

Manage Students
Manage Teachers
Manage Holidays

Now when I put the cursor on 'Manage Students', a submenu appears on its right side. The submenu has the following:

Add Student
View Student Profile

When I click on Add Student, the page /admin/addstudent.php opens up, whereas on clicking 'View Student Profile', the page /admin/viewstudent.php appears.

As far as I think the menu items can be added by the admin, that is, the menu shows up dynamically. I assume it to be like that...That said, would I be right if I say that the respective submenu items need to be specified while adding each menu item. Can anyone suggest how I get the submenu working?


5:47 pm on May 11, 2010 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

Hey, that's MY system! (Kidding . . . . in mine, it's on the right. :-)

There are about a million and a half ways to do this. :-) I'll suggest the first that comes to mind.

First, you built it without Javascript. So the links to "Manage Students" by default would come to a page that has the same thing you'd find in your drop down menus, a simple page with "Add Student" and "View Student Profile." This serves two purposes: first, it works out the back end so you can verify it's all working as expected, hammering out the server side bugs without the complication of debugging JS at the same time, and more importantly depending on if you care about this or not (you should,) it allows you to use Javascript as a tool to enhance the user experience, not fail if it's not enabled.

Once it's all working, you have a page template for the administration area, and in this template you specify

<script type="text/javascript" src="admin-menus.js"></script>

In the .js file is all the stuff that assigns the menus and their respective links to the admin menus. I'll leave off there on that part, you can use Ajax or "grow your own" menus, depending on what you find easiest to learn. Likely you will only have to do one thing to the script you've developed, add ID's to the links:

<li><a href="script.php?res=students" id="student_link">Manage Students</a></li>
<li><a href="script.php?res=instructors" id="student_link">Manage Teachers</a></li>
<li><a href="script.php?res=holidays" id="student_link">Manage Holidays</a></li>

(Depending on how you implement your menus, you may NOT need to add the ID's. You may just have to point the JS at a class or ID just the <ul> - as I said, about a million and a half ways . . . )

And what will/should happen is the Javascript will a) attach behaviors to the links, eliminating the need for inline Javascript, keeping your output clean, and b) return false on the links. What that means is when the link is clicked, Javascript will "take over" and not allow the link to navigate to the href.

So you've just added progressive enhancement via Javascript (likely Ajax) and maintained accessibility. Zen. :-)


5:44 pm on May 12, 2010 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

oops . . . in the previous, ID's need to be unique, I have three "student_link" id's, make them student_link, instructor_link, holiday_link . . . hindsight=20/20 and all that, sorry.


1:34 pm on May 13, 2010 (gmt 0)

5+ Year Member

I'm still in confusion...

The menu as well as the submenu items should come from the database. I don't think javascript onmouseover event can work with a function having PHP statements. How do I make javascript interact with the database? I have searched the web .... everywhere I got a hint that it can be done with Ajax.

I would like to know which is the simplest and best method to do this. Please consider providing helpful links or any tutorial (I'm new to Ajax).

Featured Threads

Hot Threads This Week

Hot Threads This Month