View Full Version : Help with functions and arguments

08-03-2011, 12:22 PM
Hi all,

I am trying to pass some dynamic values for use with javascript or more specifically AJAX...

I had a set up looking something like the following;

<input type="button" onclick="ajaxFunction()" value="Add Favourite"/>
<input type="text" name="school_id" id="school_id" value="<?php echo $school_id; ?>" />
<input type="text" name="teacher_id" id="teacher_id" value="<?php echo $teacher_id; ?>" />

<script language ="javascript" type="text/javascript">
//Browser Support Code
function ajaxFunction(){

var ajaxRequest; // The variable that makes Ajax possible!

// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
}catch (e){
// Internet Explorer Browsers
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
}catch (e){
// Something went wrong
alert("Your browser broke!");
return false;

// Create a function that will receive data
// sent from the server and will update
// div section in the same page.
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
var ajaxDisplay = document.getElementById('ajaxDiv');
ajaxDisplay.value = ajaxRequest.responseText;
// Now get the value from user and pass it to
// server script.
var school_id = document.getElementById('school_id').value;
var teacher_id = document.getElementById('teacher_id').value;

var queryString = "?sid=" + school_id;
queryString += "&tid=" + teacher_id;
ajaxRequest.open("GET", "ajax_insert_favourite.php" + queryString, true);


however because it is possible for there to be more than one button, i.e. many teachers can be returned the javascript would also output 1 and 1.

I need someway of making this unique to the id's... I think that passing arguments/params might be the solution but I'm having a hard time implementing it;

I've tried the following;

<input type="button" onclick="ajaxFunction('school_id','teacher_id')" value="Add Favourite"/>

//Browser Support Code
function ajaxFunction(school_id,teacher_id){

But once I do this, it no longer even make the call.

Can anyone advise here, I'm a relative newbie to javascript/AJAX etc.

Many thanks,


08-03-2011, 04:27 PM
You are using school_id and teacher_id for 3 different things:
The elements ID's
The identifiers for the passed variables
and for the in-function defined variables

Though it doesn't seem to whats causing the trouble in this case, it can be very hard to remember, what is what.
A good thing is to make some differences between the names.
The ID's with Initial caps
<input type="button" onclick="ajaxFunction('School_Id','Teacher_Id')" value="Add Favourite"/>
The identifiers in lower-case
function ajaxFunction(school_id,teacher_id){and the variables in upper-case
var SCHOOL_ID = document.getElementById('school_id').value;
var TEACHER_ID = document.getElementById('teacher_id').value;

var queryString = "?sid=" + SCHOOL_ID;
queryString += "&tid=" + TEACHER_ID;

beside that, the only problem I can see is that though you passed the id's to the function you are using predefined id's when creating the variables:
var SCHOOL_ID = document.getElementById('school_id').value;
var TEACHER_ID = document.getElementById('teacher_id').value;
change it so it refers to the identifiers instead:
var SCHOOL_ID = document.getElementById(school_id).value;
var TEACHER_ID = document.getElementById(teacher_id).value;