Tuesday, April 24, 2007

Ajax select category and subcategory list automatic

//category.php


<script language = 'javascript'>

// create ajax instance

function GetXMLHttpRequest()

{

var object = null;



if (window.XMLHttpRequest) //for mozilla,safari,opera,nets..

{

object = new XMLHttpRequest();

}

else if (window.ActiveXObject) //for IE..

{

try

{

object = new ActiveXObject("Msxml2.XMLHTTP");

}

catch(e)

{

}



if (object == null)

{

try

{

object = new ActiveXObject("Microsoft.XMLHTTP");

}

catch(e)

{

}

}

}



if (object == null)

{

alert("Your browser does not support AJAX");

}



return object;

}

var httpxx = GetXMLHttpRequest();


//Ajax for Subcategories


 


var url_cat = "getsubcategory.php?cid=";


// handling ajax response

function handleHttpResponse2()

{

if (httpx.readyState == 4)

{



if(httpx.status == 200)

{



document.getElementById('prepage2').style.visibility='hidden';

var results=httpx.responseText.split(",");



var oSelect1 = document.getElementById("subcategory");

oSelect1.options.length=0;



if(results[0].length==0)

{

var oOption = document.createElement("option");

oOption.value = 0;

oOption.innerHTML = "-select-";



var oSelect = document.getElementById("subcategory");

oSelect.appendChild(oOption);

}

else

{

var oOption = document.createElement("option");

oOption.value = 0;

oOption.innerHTML = "-select-";



var oSelect = document.getElementById("subcategory");

oSelect.appendChild(oOption);

for (var d=0;d < results.length ;d++)

{

var oOption = document.createElement("option");

var dd1=results[d].split("-")

oOption.value = dd1[1];

oOption.innerHTML = dd1[0];



var oSelect = document.getElementById("subcategory");

oSelect.appendChild(oOption);

}

}

}

}

}


// make ajax request

function updateCategoryState() {

var categoryValue = document.getElementById("category").value;

httpx.open("GET", url_cat + escape(categoryValue), true);

document.getElementById('prepage2').style.visibility='visible';

httpx.onreadystatechange = handleHttpResponse2;

httpx.send(null);

}


var httpx = GetXMLHttpRequest();


</script>


//category.php file where selection is made and subcategory is updated


<td width="53%">

<select id="category" name='category' onchange="updateCategoryState();" class='welcome_text'>

<option value='0' class='welcome_text'>Select Category</option>

<?php


$query1Select = "select * from tblcategories";

$query1Result = query_select($query1Select,$nRows);

while($row = mysql_fetch_object($query1Result))

{

$categoryList.="<option value='$row->id'>$row->categoryname</option>";

}


?>

</select>


</td>


<tr>

<td class="caption" align='right' class='welcome_text'>SubCategory Name&nbsp;</td>

<td width="53%">

<select id="subcategory" name='subcategory' class='welcome_text'>

<option value='0' class='welcome_text'>Select Subcategory</option>

<?php


$query1Select = "select * from tblsubcategories";

$query1Result = query_select($query1Select,$nRows);

while($row = mysql_fetch_object($query1Result))

{

$subcategoryList.="<option value='$row->subcategoryname'>$row->subcategoryname</option>";

}


?>

</select>

<span id="prepage2" align='center' class='welcome_text'>

<font color='#FF0000'>

Loading ... ...Please wait

</font>

</span>

</td>

</tr>


 


 


//get subcategory file .php


<?php

$str="select * from tblsubcategories where categoryid=$cid";

$res=query_select($str,$conn);

$str="";

while ($fobj=mysql_fetch_object($res))

{

$str.="$fobj->subcategoryname"."-"."$fobj->id".",";

}

$str2=substr($str,0,strlen($str)-1);

echo "$str2";

?>

No comments: