Calling 2 ajax update functions based upon 1 onreadystatechange

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Constantine AI
    New Member
    • Mar 2008
    • 129

    Calling 2 ajax update functions based upon 1 onreadystatechange

    Hi

    I am wanting to call two ajax functions which basically update and filter drop down menus, this is to be executed upon the onreadystatecha nge of one drop down menu. I have the following code;

    ajax code for executing the commands

    Code:
    var xmlhttp;
    
    function callAjax(url,str,divid)
    {
    	xmlhttp=GetXmlHttpObject();
    	if (xmlhttp==null)
    	{
    		alert ("Browser does not support HTTP Request");
    		return;
    	}
    	
    	var url=url;
    	url=url+"?"+str;
    	url=url+"&sid="+Math.random();
    	xmlhttp.onreadystatechange=function()
    	{
    		if (xmlhttp.readyState==4 && xmlhttp.status==200)
    		{
    			document.getElementById(divid).innerHTML=xmlhttp.responseText;
    		}
    	}
    	xmlhttp.open("GET",url,true);
    	xmlhttp.send(null);
    }
    
    function GetXmlHttpObject()
    {
    	if (window.XMLHttpRequest)
    	{
    		// code for IE7+, Firefox, Chrome, Opera, Safari
    		return new XMLHttpRequest();
    	}
    	if (window.ActiveXObject)
    	{
    		// code for IE6, IE5
    		return new ActiveXObject("Microsoft.XMLHTTP");
    	}
    	return null;
    }
    php code for the onreadystatecha nge element

    Code:
    <td>';
    	$content .= "
    	<select id='projectID' name='projectID' style='width:100%;' onchange='callAjax(\"filterProjectTasks.php\", \"q=\"+this.value, \"filterProjectTaskResult\"); callAjax(\"filterProjectSites.php\", \"q=\"+this.value, \"filterProjectSiteResult\");'>
    	<option id='default' name='default' value='0'></option>";
    	foreach($this->getData('projectList') as $dbProject)
    	{
    		$checkSelectedResult = '';
    		if( $this->getData( 'inputProjectID' ) == $dbProject['projectID'] )
    		{
    			$checkSelectedResult = "selected='selected'";
    		}
    		$content .= "
    		<option value='{$dbProject['projectID']}' {$checkSelectedResult}>{$dbProject['name']}</option>";
    	}                            
    	$content .= '
    	</select>
    </td>
    This just lists all the projects, so once i select an option i would like it to filter two drops down menus; project tasks and project sites.

    php code for filterprojectta sks.php - seperate file

    Code:
    	/* FILTERPROJECTTASKS.php
    	 * ajax code for filtering project tasks within the daily diary form */
    
    	require_once('../../../includes/config.php');	
    
    	$id=$_GET["q"];
    	
    	$Task = new ProjectTask();
    	$taskList = $Task->getProjectTasksByProject($id);
    	
    	echo '<select id="taskID" name="taskID">
    	<option id="default" name="default" value="0">Please select a task</option>';
    	foreach($taskList as $dbTask)
    	{
    		echo '<option value="'.$dbTask['taskID'].'">'.$dbTask['description'].'</option>';
    	}
    	echo '</select>';
    php code for filterprojectsi tes.js - seperate file

    Code:
    	/* FILTERPROJECTSITES.php
    	 * ajax code for filtering project sites within the daily diary form */
    
    	require_once('../../../includes/config.php');	
    
    	$id=$_GET["q"];
    	
    	$Site = new ProjectSite();
    	$siteList = $Site->getProjectSitesByProject($id);
    	
    	echo '<select id="siteID" name="siteID">
    	<option id="default" name="default" value="0">Please select a site</option>';
    	foreach($siteList as $dbSite)
    	{
    		echo '<option value="'.$dbSite['siteID'].'">'.$dbSite['name'].'</option>';
    	}
    	echo '</select>';
    php code for the returned results for tasks

    Code:
    <td>
    	<div id="filterProjectTaskResult">
    		<select id="taskID_0'.$i.'" name="taskID_0'.$i.'">
    			<option id="default" name="default" value="0">Please select a task</option>';
    			foreach($this->getData('taskList') as $dbTask)
    			{
    				$checkSelectedResult = '';
    				if( $this->getData( 'inputTaskID_0'.$i ) == $dbTask['taskID'] )
    				{
    					$checkSelectedResult = 'selected="selected"';
    				}
    				$content .= '
    				<option value="'.$dbTask['taskID'].'" '.$checkSelectedResult.'>'.$dbTask['description'].'</option>';
    			}
    		$content .= '
    		</select>
    	</div>
    </td>
    as you can see by default i have the task drop down menu selecting all the tasks.

    php code for the returned results for sites

    Code:
    <td>
    	<div id="filterProjectSiteResult">
    		<select id="siteID_0'.$i.'" name="siteID_0'.$i.'">
    			<option id="default" name="default" value="0">Please select a site</option>';
    			foreach($this->getData('siteList') as $dbSite)
    			{
    				$checkSelectedResult = '';
    				if( $this->getData( 'inputSiteID_0'.$i ) == $dbSite['siteID'] )
    				{
    					$checkSelectedResult = 'selected="selected"';
    				}
    				$content .= '
    				<option value="'.$dbSite['siteID'].'" '.$checkSelectedResult.'>'.$dbSite['name'].'</option>';
    			}
    		$content .= '
    		</select>
    	</div>
    </td>
    as you can see by default i have the site drop down menu selecting all the sites.

    When debugging through the console it shows the command being called and executing the correct files with the correct results, however for some reason it does not filter the sites or tasks drop down menu's on screen.

    Any help would be greatly appreciated!
Working...