I use existing scripts and try to modify them to my needs.
I started a new project and learn as a go.
What i want to achieve is the following:
If sales district 1 - 4 is selected Display OrderStatus.
If sales disrict 5 0r 6 is selected Display NoVal1
This Is my index page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dynamic field creation in PHP</title>
<script type="text/javascript" src="jquery.js"></script>
<script language="javascript">
function getXMLHTTP()
{
var xmlhttp=null;
try {
xmlhttp=new XMLHttpRequest();
}
catch(e)
{
try {
xmlhttp=new ActiveXobject("Microsoft.XMLHTTP");
}
catch(e)
{
try {
xmlhttp=new ActiveXObject("msxml2.XMLHTTP");
}
catch(e1)
{
xmlhttp=false;
}
}
}
return xmlhttp;
}
var strurl="dynamic-form.php?cate="+cat;
var req=getXMLHTTP();
function getCat(cat) {
//alert(cat);
$("#flash").show();
$("#flash").fadeIn(400).html('<img src="ajax-loader.gif" align="absmiddle"> loading.....');
var strurl="dynamic-form.php?cate="+cat;
//alert(strurl);
var req=getXMLHTTP();
if(req==null)
{
alert("browser error");
}
if(req)
{
req.onreadystatechange=function() {
if(req.readyState ==4 || req.readyState=="complete") {
$("#flash").hide();
document.getElementById("ajaxresult").innerHTML=req.responseText;
}
}
req.open("GET",strurl,true);
req.send(null);
}
}
</script>
</head>
<body>
<div style="text-align:center;">
<div style="display:none;"><img src="ajax-loader.gif" /></div>
<h1 style="color:#CCC;">VAT WORKFLOW</h1></div>
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="10%">TODAYS DATE</td>
<td width="10%">
<?php
echo date("d/m/Y");
?>
</td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="10%">SALES DISTRICT</td>
<td width="10%"><label>
<select name="select" id="select" onChange="getCat(this.value)">
<option value="" selected="selected">Select Sales District</option>
<option value="1">IN05</option>
<option value="2">IN02</option>
<option value="3">IN23</option>
<option value="4">IN13</option>
<option value="5">EDU</option>
<option value="6">EPP</option>
</select></label></td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="1317" colspan="4">
<div id="flash"></div>
<div id="ajaxresult"></div></td>
</tr>
</table>
</body>
</html>
I edit the dynamic-form.php file to:
<?php
$cat=$_REQUEST['cate'];
if($cat==1 && $cat==2 && $cat==3 && $cat==4)
{
require_once('OrderStatus.php');
}
elseif ($cat==5 && $cat==6)
{
require_once('NoVal1.php');
}
?>
OrderStatus.php File:
<table width="100%" border="0" cellspacing="2" cellpadding="2">
<tr>
<th width="10%" align="left" valign="middle"><strong>ORDER STATUS</strong></td>
<th width="10%" align="left" valign="middle"><label>
<select name="select" id="select">
<option value="" selected="selected">Select Order Status</option>
<option value="1">Open</option>
<option value="2">Shipped</option>
<option value="3">Open & Shipped</option>
</select>
</label></td>
<th width="25%"> </td>
<th width="25%"> </td>
</tr>
</table>
NoVal1.php File:
<table width="100%" border="0" cellspacing="2" cellpadding="2">
<tr>
<th>DO NOT VALIDATE<br> STICKEY:</td>
<th width="25%"> </td>
<th width="25%"> </td>
</tr>
</table>