Since am new to php i have the following doubt.
I have a combo box within a form in my home page.The combo box will display data from mysql database. When the user chooses an item, i have to pass it to an query and display the result in a textfield. I have done all these things.
But the problem is, when the user enters others details and selects the combo box value it automatically gets refreshed. i know this is because php is for server side. My coding is as follows:
<html>
<head>
<title>Call Reader</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<?php
$dbname='callreader';
$db_user='root';
$db_pass='';
$host='localhost';
$conn = mysql_connect($host, $db_user, $db_pass);
mysql_select_db($dbname);
$query="select distinct Name from billing_numbers";
$result=mysql_query($query,$conn) or die(mysql_error());
?>
<center>
<form name=callsubm method="post">
<table border="0" >
<tr >
<td align="right">
From Date</td>
<td align="center" >
<input style="border-style: none;" type="text" name="beg" id="beg" size="15" ></td>
<td><img src="calender" alt="C" id='img1'>
<script language=javascript type="text/javascript">
var cal = new Zapatec.Calendar.setup({
inputField:"beg",
ifFormat:"%d-%m-%Y ",
button:"img1",
showsTime:false
});
</script>
</td>
</tr>
<tr>
<td>
End Date</td>
<td >
<input style="border-style: none;" type="text" name="datEnd" id="datEnd" size="15" ></td>
<td><img src="calender" alt="C" id='img2'>
<script language=javascript type="text/javascript">
var cal = new Zapatec.Calendar.setup({
inputField:"datEnd",
ifFormat:"%d-%m-%Y ",
button:"img2",
showsTime:false
});
</script>
</td>
</tr>
<tr>
<td>
Time</td>
<td >
<input style="border-style: none;" name=time id=time type="text" size="15"></td>
<td><input type="image" id=time name=time src="Time.png"></td>
</tr>
<?php
if($result)
{
?>
<tr>
<td>
Group:</td>
<td>
<select name="Name" id="Name" onchange='PrintCombo();' style="width:117px; font-size:12px; color:#006699;font-weight: bold;font-family:verdana;background-color:#ffffff;">
<?php
while($row=mysql_fetch_assoc($result)) {
echo '<option value="'.$row['Name'].'">'.$row['Name'].'</option>';
}
}
?>
</select>
<?php
if(isset($_POST['Name']))
{
echo '<script type="javascript"> alert("hi");</script>';
$array=array();
$query="select Number from billing_numbers where Name='".$_POST['Name']."'";
$result=mysql_query($query,$conn) or die(mysql_error());
if($result)
{
while($row=mysql_fetch_assoc($result))
{
$array[]=$row['Number'];
}
$total_numbers = implode(',', $array);
}
}
?>
</td>
</tr>
<tr>
<td>
Extension</td>
<td >
<input style="border-style: none;" name=inTxt id=inTxt type="text" size="15" value="<?php echo $total_numbers;?>"></td>
<td><a href="outgoing.php"><img style='border-style:none' src='phone.png'></a>
</td>
</tr>
</table>
<br/>
<table>
<tr align="center">
<td align="center">Single </td>
<td><input class="submit" type=radio id=optSingle name=optSingle onclick=selectpage(name)>
</td>
<td> Datewise </td>
<td><input class="submit" type=radio checked id=optDat name=optDat onclick=selectpage(name)>
</td>
</tr>
</table>
<input TYPE=HIDDEN NAME="pageNum" value="1">
<input TYPE=HIDDEN NAME="rowsPerPage" value="10">
</form>
</center>
</body>
<script type="text/javascript">
function PrintCombo()
{
document.callsubm.submit();
}
function DoSubmit()
{
if(document.callsubm.datEnd.value=="")
{
document.callsubm.datEnd.value=document.callsubm.beg.value;
}
if (document.callsubm.inTxt.value=="")
{
alert ("Extension field cannot be empty");
document.callsubm.inTxt.focus();
return false;
}
else
{
return true;
}
}
function selectpage(value)
{
if(value=='optSingle')
{
callsubm.optDat.checked=!callsubm.optDat.checked;
}
if(value=='optDat')
{
callsubm.optSingle.checked=!callsubm.optSingle.checked;
}
}
</script>
</html>Actually the code should be like
<html>
<head>
<title>Call Reader</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body >
<?php
$dbname='callreader';
$db_user='root';
$db_pass='';
$host='localhost';
$conn = mysql_connect($host, $db_user, $db_pass);
mysql_select_db($dbname);
$query="select distinct Name from billing_numbers";
$result=mysql_query($query,$conn) or die(mysql_error());
?>
<center>
<form name=callsubm method="get" action="outgoing.php">
<table border="0" >
<tr >
<td align="right">
From Date</td>
<td align="center" >
<input style="border-style: none;" type="text" name="beg" id="beg" size="15" ></td>
<td><img src="calender" alt="C" id='img1'>
<script language=javascript type="text/javascript">
var cal = new Zapatec.Calendar.setup({
inputField:"beg",
ifFormat:"%d-%m-%Y ",
button:"img1",
showsTime:false
});
</script>
</td>
</tr>
<tr>
<td>
End Date</td>
<td >
<input style="border-style: none;" type="text" name="datEnd" id="datEnd" size="15" ></td>
<td><img src="calender" alt="C" id='img2'>
<script language=javascript type="text/javascript">
var cal = new Zapatec.Calendar.setup({
inputField:"datEnd",
ifFormat:"%d-%m-%Y ",
button:"img2",
showsTime:false
});
</script>
</td>
</tr>
<tr>
<td>
Time</td>
<td >
<input style="border-style: none;" name=time id=time type="text" size="15"></td>
<td><input type="image" id=time name=time src="Time.png"></td>
</tr>
<?php
if($result)
{
?>
<tr>
<td>
Group:</td>
<td>
<select name="Name" id="Name" onchange='PrintCombo();' style="width:117px; font-size:12px; color:#006699;font-weight: bold;font-family:verdana;background-color:#ffffff;">
<?php
while($row=mysql_fetch_assoc($result)) {
echo '<option value="'.$row['Name'].'">'.$row['Name'].'</option>';
}
}
?>
</select>
<?php
if(isset($_POST['Name']))
{
echo '<script type="javascript"> alert("hi");</script>';
$array=array();
$query="select Number from billing_numbers where Name='".$_POST['Name']."'";
$result=mysql_query($query,$conn) or die(mysql_error());
if($result)
{
while($row=mysql_fetch_assoc($result))
{
$array[]=$row['Number'];
}
$total_numbers = implode(',', $array);
}
}
?>
</td>
</tr>
<tr>
<td>
Extension</td>
<td >
<input style="border-style: none;" name=inTxt id=inTxt type="text" size="15" value="<?php echo $total_numbers;?>"></td>
<td><input type="image" id=callBtn name=callBtn src="phone.png" >
</td>
</tr>
</table>
<br/>
<table>
<tr align="center">
<td align="center">Single </td>
<td><input class="submit" type=radio id=optSingle name=optSingle onclick=selectpage(name)>
</td>
<td> Datewise </td>
<td><input class="submit" type=radio checked id=optDat name=optDat onclick=selectpage(name)>
</td>
</tr>
</table>
<input TYPE=HIDDEN NAME="pageNum" value="1">
<input TYPE=HIDDEN NAME="rowsPerPage" value="10">
</form>
</center>
</body>
<script type="text/javascript">
function PrintCombo()
{
document.callsubm.submit();
}
function DoSubmit()
{
if(document.callsubm.datEnd.value=="")
{
document.callsubm.datEnd.value=document.callsubm.beg.value;
}
if (document.callsubm.inTxt.value=="")
{
alert ("Extension field cannot be empty");
document.callsubm.inTxt.focus();
return false;
}
else
{
return true;
}
}
function selectpage(value)
{
if(value=='optSingle')
{
callsubm.optDat.checked=!callsubm.optDat.checked;
}
if(value=='optDat')
{
callsubm.optSingle.checked=!callsubm.optSingle.checked;
}
}
</script>
</html>But when i use above code, i won get the result because of method="get" and am using $_POST. My doubt is whether i can pass the combo selected item to another page to do the querying and again pass the result to homepage textfield without navigating to another pages.
Is my doubt is clear or its confusing?