Member Avatar for dhairyaguptha

I have a form loaded with table values from database. The form is embedded in php page because it is coming as result of AJAX request. I want to update the data in the same form and return to the table in database.

the process is working overall. But when i want to copy textbox value to another textbox using javascript its not working.

even a simple alert not working.

i try to use the javascript functions as follows

 echo "<button type='button' onclick='alerting()'>Testing Script</button>";
//echo "<button type='button' onclick='alerting();'>Testing Script</button>";
 <script type="text/javascript">
    function alerting(){
        alert("dfdgfg");
    }

</script>

This one even not working. i tried with the above commented one too.

Please help me in this...

Edited by Reverend Jim because: Fixed formatting
  • 4 Contributors
  • 11 Replies
  • 13K Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by dhairyaguptha
Member Avatar for Agarsia

This one works:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
?>
<script type="text/javascript">
function alerting(){
alert("dfdgfg");
}
</script>

or:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
echo '<script type="text/javascript">function alerting(){alert("dfdgfg");}</script>';
?>
Member Avatar for dhairyaguptha

This one works:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
?>
<script type="text/javascript">
function alerting(){
alert("dfdgfg");
}
</script>

or:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
echo '<script type="text/javascript">function alerting(){alert("dfdgfg");}</script>';
?>

this part is inside the php tags

echo "<button type='button' onclick='alerting()'>Testing Script</button>";
//echo "<button type='button' onclick='alerting();'>Testing Script</button>";

both ways not working thats is the problem!

Edited by dhairyaguptha because: n/a
Member Avatar for dhairyaguptha

Its working when its alone but not working in the database resulted .php page.

Member Avatar for dhairyaguptha

This one works:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
?>
<script type="text/javascript">
function alerting(){
alert("dfdgfg");
}
</script>

or:

<?php
echo "<button type='button' onclick='alerting()'>Testing Script</button>";
echo '<script type="text/javascript">function alerting(){alert("dfdgfg");}</script>';
?>

This is the complete code!

<?php
$q=$_GET["q"];

$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("school", $con);

$sql="SELECT * FROM student WHERE indexno = '".$q."'";
	//$sql="SELECT * FROM student WHERE indexno = '2'";
$result = mysql_query($sql);



while($row = mysql_fetch_array($result))
  {
  $indexno=$row['indexno'];
  $studentname=$row['stuname'];
  $fathername=$row['fathername'];
  $mothername=$row['mothername'];
  $dateofbirth=$row['dateofbirth'];
 $father_address=$row['father_address'];	
 $mother_address=$row['mother_address'];
 $Father_Official_address=$row['Father_Official_address'];	
 $tel_no=$row['tel_no'];
 $mobile_no=$row['mobile_no'];
 $admission_date=$row['admission_date'];
 $admision_grade=$row['admision_grade'];	
 $current_grade=$row['current_grade'];
 $stuclass=$row['class'];
 $sex=$row['sex'];
 $gs_division=$row['gs_division'];
 $electorate=$row['electorate'];	
 $imagepath=$row['imagepath'];
 $nic=$row['nicno'];
 $lastschool=$row['last_school'];
  
  //echo "<tr>";
  //echo "<td>" . $row['indexno'] . "</td>";
  //echo "<td>" . $row['stuname'] . "</td>";
  //echo "<td>" . $row['fathername'] . "</td>";
  //echo "<td>" . $row['mothername'] . "</td>";
  //echo "<td>" . $row['dateofbirth'] . "</td>";
  //echo "<td> <img src=".$row['imagepath']." name='replaceMe' id='replaceMe'/></td>";
//. $row['imagepath'] .
  //echo "</tr>";
  //}

echo "<body bgcolor='#ebf4fb'>";
echo "<form id='form' name='form' method='post' action='updatestudent.php'>";

echo "<table border='2' >";
echo "<h1 align='center'>Student Details Update</h1>";
echo "<p align='center'>School Management System</p>";

echo "<table border='2' align='center'>";
echo "<tr><td>";
echo "<label>Index No </label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='indexno' id='indexno' value=$indexno />";
echo "</td>";
echo "</tr>";
echo "<tr><td>";
echo "<label>Student Name</label></td>";
echo "<td>";
echo "<input type='text' name='stuname' id='stuname' value=$studentname >";
echo "</td></tr>";
echo "<tr><td>";

echo "<label>Date of Birth";
echo "<button type='button'>Select Date</button>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='dob' id='dob' value=$dateofbirth />";
echo "</td></tr>";

echo "<tr><td>";
echo "<label>Father/Guardien Name";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='fathername' id='fathername' value=$fathername />";
echo "</td></tr>";


echo "<tr><td>";
echo "<label>Father/Guardien Address";

echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='fatheraddress' id='fatheraddress' value=$father_address />";
echo "</td></tr>";



echo "<tr><td>";
echo "<label>Father/Guardien NIC No";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='nid' id='nid' value=$nic />";
echo "</td></tr>";

echo "<tr><td>";
echo "<label>Mother Name";

echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='mothername' id='mothername' value=$mothername />";
echo "</td></tr>";

echo "<tr><td>";
echo "<label>Mother Address(Check if Same as Father's)";
echo "<input type='checkbox' name='option1' value='Same' onclick='alerting()'>";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' id='motheraddress' name='motheraddress' value=$mother_address />";
echo "</td></tr>";

echo "<tr><td>";
echo "<label>Official Address";

echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='offaddress' id='offaddress' value=$Father_Official_address />";
echo "</td></tr>";

echo "<tr><td>";
echo "<label>Grade";

echo "<select name='admingrade' >";
 echo "<option>$admision_grade</option>";
	  echo "<option>Grade 1</option>";
  echo "<option>Grade 2</option>";
  echo "<option>Grade 3</option>";
  echo "<option>Grade 4</option>";
echo "</select></label>";
echo "</td>";
echo "<td>";
echo "<label>Class";

echo "<select name='stuclass' >";
 echo "<option>$stuclass</option>";
	echo "<option>A</option>";
  echo "<option>B</option>";
  echo "<option>C</option>";
  echo "<option>D</option>";
echo "</select></span></label>";

echo "</td></tr>";
	

echo "<tr><td>";
echo "<label>Tel No";

echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='telno' id='telno' value=$tel_no/>";
echo "</tr></td>";

echo "<tr><td>";
echo "<label>Mobile No";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='mobno' id='mobno' value=$mobile_no />";

echo "</tr></td>";

echo "<tr><td>";
echo "<label>Previous School";

echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='lastschool' id='lastschool' value=$lastschool >";
echo "</tr></td>";

echo "<tr><td>";
echo "<label>GS Division";
echo "<span class='small'>GS Division";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='gsdivision' id='gsdivision' value=$gs_division />";
echo "</tr></td>";

echo "<tr><td>";
echo "<label>Electorate";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<input type='text' name='electorate' id='electorate' value=$electorate />";
echo "</tr></td>";

echo "<tr><td>";
echo "<label>Sex";
echo "</label>";
echo "</td>";
echo "<td>";
echo "<select name='sex'>";
 echo "<option>$sex</option>";
 echo "<option>M</option>";
 echo "<option>F</option>";
 echo "</select></span>";
 echo "</tr></td>";

 
 echo "<tr><td>";

echo "<input type='file' name='myImage' id='myImage' size='30' />";
echo "<button type='button' onclick='alerting()'>Preview</button>";
//
echo "</td>";
echo "<td>";
echo "<img src='$imagepath' name='replaceMe' id='replaceMe' />";
echo "</td>";
echo "</tr>";
echo "<tr><td>";



echo "<label>Admision Date";

echo "<button type='button' id='testbutton'>Select Date</button>";
echo "<td>";
echo "<input type='text' name='datesend' id='testtext' value=$admission_date></label>";
echo "</td></tr>";
echo "</td><td></td><td>";
echo "<button type='submit'>Update Details</button>";
echo "</td></tr>";
echo "</table>";


 
echo "</form>";
echo "</body>";
}
mysql_close($con);
?>


<script type="text/javascript">
	function alerting(){
		alert("ggfgf");
	}
	
</script>

Please help me. I want to get the selected image path from <input type="file"> tag to update to the database. before that i want to copy that to another textbox. for that purpose i need javascript working.

Javascript is not working thats the problem. i tried with several browsers.

Member Avatar for Roy Murphy

I looks as if your calling database driven PHP after you've closed the connection.
You've closed the connection on line 248, then calling the alert!
To my reasoning, the connection should be closed after you want to alert the information that's in it?
If the page is defined as .php, it will finish the script after ?> (line 249)
If the page is defined as .html, you can embed the PHP stuff and still call the JavaScript before the </body></html> part of the page.

Member Avatar for vsmash

No offense to the lads above but your advice so far is pretty far off target.
Not all web servers process php on .html named pages. You can open and close php tags anywhere in a file, many times on a page - you don't have to echo everything.

eg:

<input type=text name="foo" id="foo" size=10 maxlength=10 value="<? $foo ?>" />

Most importantly You can't pre populate an input type of file.
PHP is Pre Hypertext Processing. This means that the page is constructed with or without javascript by the web server, then delivered in its entirety to the browser.

It is the browser that interprets the html and javascript.

Input type=file is an upload mechanism. It will always begin as empty. Your file path is not a binary upload value. It is a text value.

Assuming you want folks to be able to replace the image, you need to know the following things to proceed:
1. In your form tag <form ...> must be ENCTYPE = "multipart/form-data". This tells the browser to post binary stream to the server rather than just text (ASCII).
2. The PHP page wot processes the form should ignor the file field if it is left empty, and not replace the existing image.
3. Use the database field to display the location of the image or the image itself but not to populate the file field.

Finally, you are currently opening and closing your body tag and form tag in a while statement. Body tags can only appear once, but your database may produce more than one record.

Good luck with it. Perhaps a bit of googling on php and multipart form data would help too.

Member Avatar for vsmash

oops. code examle above should be

<input type=text name="foo" id="foo" size=10 maxlength=10 value="<? echo $foo; ?>" />
Member Avatar for dhairyaguptha

No offense to the lads above but your advice so far is pretty far off target.
Not all web servers process php on .html named pages. You can open and close php tags anywhere in a file, many times on a page - you don't have to echo everything.

eg:

<input type=text name="foo" id="foo" size=10 maxlength=10 value="<? $foo ?>" />

Most importantly You can't pre populate an input type of file.
PHP is Pre Hypertext Processing. This means that the page is constructed with or without javascript by the web server, then delivered in its entirety to the browser.

It is the browser that interprets the html and javascript.

Input type=file is an upload mechanism. It will always begin as empty. Your file path is not a binary upload value. It is a text value.

Assuming you want folks to be able to replace the image, you need to know the following things to proceed:
1. In your form tag <form ...> must be ENCTYPE = "multipart/form-data". This tells the browser to post binary stream to the server rather than just text (ASCII).
2. The PHP page wot processes the form should ignor the file field if it is left empty, and not replace the existing image.
3. Use the database field to display the location of the image or the image itself but not to populate the file field.

Finally, you are currently opening and closing your body tag and form tag in a while statement. Body tags can only appear once, but your database may produce more than one record.

Good luck with it. Perhaps a bit of googling on php and multipart form data would help too.

I did store only the image name in the database. then i used it with a constant image path in the page. it worked the way i need it to work.

My problem is not that i want to get javascript to work for many works. not only for image path uploading. i have the following code for preview the image.

var imgRe = /^.+\.(jpg|jpeg|gif|png)$/i;
function previewImage(pathField, previewName)
{

var path = pathField.value;
if (path.search(imgRe) != -1)
{
//document[previewName].src = document.imageTest.myImage.value;
//document.getElementById("replaceMe").src = document.imageTest.myImage.value;
document.getElementById("replaceMe").src = document.form.myImage.value;

}
else
{
alert("JPG, PNG, and GIFs only!");
}

its working.. in other Registration form. (here my problem is in the update form generated from server as a result of a Query String)

function showUser(str,str1)
{
if (str==""&&str1=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","tablebase.php?q="+str,true);

xmlhttp.send();
}

im talking abt the above tablebase.php (the code posted above in my Question)

Is that you mean if i remove unnecessary Echo tags it should work?

Thank you!

Member Avatar for vsmash

Okay. You owe me an hour. Bad hairy.
Below is a redo of your page.

If you keep your code more organised you will not miss as many things.

Your first table had no <TR> or <TD>

Your closing tags for table rows were </tr></td> rather than </td></tr>

Your labels need "for" tags

Your form fields should _all_ have id tags

Your select fields and radio/checkboxes should also have id tags. I have changed the code on these to reflect the result of the database results.

I haven't read up lately on the security implications of browsers displaying local files, but the preview image function hereunder allows for you to add code.

I suggest you familiarise with jquery and themeroller ui plugin to help with stuff like datepickers and validation.

<?php
// make sure an id is passed
if(!isset($_GET["q"])){
	die('No Student Number Provided');
}
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }
	mysql_select_db("school", $con);

	$sql="SELECT * FROM student WHERE indexno = '".$q."'";
	//$sql="SELECT * FROM student WHERE indexno = '2'";
	$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
  {
  	$indexno=$row['indexno'];
  	$studentname=$row['stuname'];
 	$fathername=$row['fathername'];
  	$mothername=$row['mothername'];
  	$dateofbirth=$row['dateofbirth'];
	$father_address=$row['father_address'];	
	$mother_address=$row['mother_address'];
 	$Father_Official_address=$row['Father_Official_address'];	
 	$tel_no=$row['tel_no'];
 	$mobile_no=$row['mobile_no'];
 	$admission_date=$row['admission_date'];
 	$admision_grade=$row['admision_grade'];	
 	$current_grade=$row['current_grade'];
 	$stuclass=$row['class'];
 	$sex=$row['sex'];
 	$gs_division=$row['gs_division'];
 	$electorate=$row['electorate'];	
 	$imagepath=$row['imagepath'];
 	$nic=$row['nicno'];
 	$lastschool=$row['last_school'];
  //echo "<tr>";
  //echo "<td>" . $row['indexno'] . "</td>";
  //echo "<td>" . $row['stuname'] . "</td>";
  //echo "<td>" . $row['fathername'] . "</td>";
  //echo "<td>" . $row['mothername'] . "</td>";
  //echo "<td>" . $row['dateofbirth'] . "</td>";
  //echo "<td> <img src=".$row['imagepath']." name='replaceMe' id='replaceMe'/></td>";
//. $row['imagepath'] .
  //echo "</tr>";
  mysql_close($con);
  }

    // Okay that's enough php for now
?>
<html>
	<head>

	</head>
	<!-- these are handy but that's a lesson for another day -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
	<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.6/jquery.validate.min.js"></script>
	
	<!-- here are your other scripts -->
	<script language=javascript>
	// 	initialize variables 
	var imgRe = /^.+\.(jpg|jpeg|gif|png)$/i;

	//	make mum's address same as dad's
	function mumdadaddressfunction(obj){
		// obj is the checkbox
		if(obj.checked){
			// copy dad's address into mum's address field
			document.myform.motheraddress.value=document.myform.fatheraddress.value;
		}
	}
	
	// compare mum's address to dad's
	function checkmumdadaddress(){
		if(document.myform.motheraddress.value==document.myform.fatheraddress.value){
			document.myform.dadandmumsame.checked=true;		
		}else{
			document.myform.dadandmumsame.checked=false;		
		}
	}
	//	preview a chosen image	
	function previewimage(){
		var imgpath = document.myform.myImage.value;
		var mypreview = findObj("replaceMe");	// using utility object for cross browser compatibility
		if(imgpath.length>6){
			//	and image has been chosen.
			//      your preview image code goes here
			//	your preview image code goes here
			if (imgpath.search(imgRe) != -1){
					mypreview.src = 'file:///'+imgpath;
				}else{	
					alert("JPG, PNG, and GIFs only!");
				}
		}
	}
		
	//	UTILITY FUNCTIONS //
	// Example: obj = findObj("image1");
	function findObj(theObj, theDoc)
	{
	  var p, i, foundObj;
	  
	  if(!theDoc) theDoc = document;
	  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)
	  {
	    theDoc = parent.frames[theObj.substring(p+1)].document;
	    theObj = theObj.substring(0,p);
	  }
	  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
	  for (i=0; !foundObj && i < theDoc.forms.length; i++) 
	    foundObj = theDoc.forms[i][theObj];
	  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++) 
	    foundObj = findObj(theObj,theDoc.layers[i].document);
	  if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);
	  
	  return foundObj;
	}		
			
	</script>
	<body bgcolor='#ebf4fb'>
		<form id="myform" name='myform' method="post" ENCTYPE="multipart/form-data" action="updatestudent.php">
		<!-- form name changed to myform from 'form' because form is a reserved word in the DOM -->
		<table border='2'>
			<tr>
				<th><h1 align='center'>Student Details Update</h1>
					<p align='center'>School Management System</p>
					<table border='2' align='center'>
						<tr>
							<td><label for="indexno">Index No </label></td>
							<td><input type='text' name='indexno' id='indexno' value="<? echo $indexno;?>" /> </td>
						</tr>
						<tr>
							<td><label for="stuname">Student Name</label></td>
							<td><input type='text' name='stuname' id='stuname' value="<? echo $stuname;?>" /> </td>
						</tr>
						<tr>
							<td><label for="dob">Date of Birth</label><button type='button'>Select Date</button></td>
							<td><input type='text' name='dob' id='dob' value="<? echo $dateofbirth;?>" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien Name</label> </td>
							<td><input type='text' name='fathername' id='fathername' value="<? echo $fathername; ?>" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien Address</label> </td>
							<td><input type='text' name='fatheraddress' id='fatheraddress' value="<? echo $father_address;?>" onkeyup="checkmumdadaddress();" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien NIC No</label> </td>	
							<td><input type='text' name='nid' id='nid' value="<? echo $nic;?>" /> </td>
						</tr>
						<tr>
							<td><label>Mother Name</label> </td>
							<td><input type='text' name='mothername' id='mothername' value="<? echo $mothername; ?>" /> </td>
						</tr>
						<tr>
							<td><input type='checkbox' name='dadandmumsame' id='dadandmumsame' value='Same' onclick='mumdadaddressfunction(this);' <? if($mother_address==$father_address){ echo " CHECKED";} ?>><label for=motheraddress>Mother Address(Check if Same as Father's) </label> </td>
							<td><input type='text' id='motheraddress' name='motheraddress' value="<? echo $mother_address; ?>" onkeyup="checkmumdadaddress();" /></td>
						</tr>
						<tr>
							<td><label>Official Address</label></td>
							<td><input type='text' name='offaddress' id='offaddress' value="<? echo $Father_Official_address; ?>" /> </td>
						</tr>
						<tr>
							<td><label for="admingrade">Grade</label>
								<select name='admingrade' id=admingrade size=1>
	  								<option value="Grade 1" <? if($admision_grade=="Grade 1"){echo " SELECED";} ?>>Grade 1</option>
	  								<option value="Grade 2" <? if($admision_grade=="Grade 2"){echo " SELECED";} ?>>Grade 2</option>
	  								<option value="Grade 3" <? if($admision_grade=="Grade 3"){echo " SELECED";} ?>>Grade 3</option>
	  								<option value="Grade 4" <? if($admision_grade=="Grade 4"){echo " SELECED";} ?>>Grade 4</option>
								</select>
							</td>
							<td><label for=stuclass>Class</label>
								<select name='stuclass' id=stuclass size=1>
	  								<option value="A" <? if($stuclass=="A"){echo " SELECED";} ?>>A</option>
	  								<option value="B" <? if($stuclass=="B"){echo " SELECED";} ?>>B</option>
	  								<option value="C" <? if($stuclass=="C"){echo " SELECED";} ?>>C</option>
	  								<option value="D" <? if($stuclass=="D"){echo " SELECED";} ?>>D</option>
								</select>
							</td>
						</tr>
						<tr>
							<td><label for="telno">Tel No</label> </td>
							<td><input type='text' name='telno' id='telno' "<? echo $tel_no; ?>" /> </td>
						</tr>
						<tr>
							<td><label for="mobno">Mobile No</label></td>
							<td><input type='text' name='mobno' id='mobno' value="<? echo $mobile_no; ?>" /> </td>
						</tr>
						<tr>
							<td><label>Previous School</label></td>
							<td><input type='text' name='lastschool' id='lastschool' value="<? echo $lastschool; ?>" >
							</td>
						</tr>
						<tr>
							<td><label for="gsdivision">GS DivisionGS Division</label></td>
							<td><input type='text' name='gsdivision' id='gsdivision' value="<? echo $gs_division; ?>" />
							</td>
						</tr>
						<tr>
							<td><label for="electorate">Electorate</label> </td>
							<td><input type='text' name='electorate' id='electorate' value="<? echo $electorate; ?>" />
							</td>
						</tr>
						<tr>
							<td><label for=sex>Sex</label> </td>
							<td><input type=radio name="sex" valu="M" <? if($sex=="M"){echo "CHECKED";} ?> >M&nbsp;&nbsp; 
								<input type=radio name="sex" valu="F" <? if($sex=="F"){echo "CHECKED";} ?> >F
							</td>
						</tr>
						<tr>
							<td>
								<input type='file' name='myImage' id='myImage' size='30' /><br>
								<button type='button' onclick='previewimage();'>Preview</button>
							</td>
							<td>
								<img src='<? echo $imagepath; ?>' name='replaceMe' id='replaceMe' />
							</td>
						</tr>
						<tr>
							<td><label for="datesend">Admision Date</label>
								<button type='button' id='admissiondatebutton'>Select Date</button></td>
							<td><input type='text' name='datesend' id='datesend' value="<? echo $electorate; ?>" /></label>
							</td>
						</tr>
					</table>
				<button type='submit'>Update Details</button>
				</td>
			</tr>
		</table>
		</form>
</body>
</html>
Member Avatar for vsmash

Couple more things:
on code above I reckon close the mysql connection two lines further down (after the closing bracket).
also you could use onchange="previewimage" in the myImage field rather than a button.

Member Avatar for dhairyaguptha

Okay. You owe me an hour. Bad hairy.
Below is a redo of your page.

If you keep your code more organised you will not miss as many things.

Your first table had no <TR> or <TD>

Your closing tags for table rows were </tr></td> rather than </td></tr>

Your labels need "for" tags

Your form fields should _all_ have id tags

Your select fields and radio/checkboxes should also have id tags. I have changed the code on these to reflect the result of the database results.

I haven't read up lately on the security implications of browsers displaying local files, but the preview image function hereunder allows for you to add code.

I suggest you familiarise with jquery and themeroller ui plugin to help with stuff like datepickers and validation.

<?php
// make sure an id is passed
if(!isset($_GET["q"])){
	die('No Student Number Provided');
}
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }
	mysql_select_db("school", $con);

	$sql="SELECT * FROM student WHERE indexno = '".$q."'";
	//$sql="SELECT * FROM student WHERE indexno = '2'";
	$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
  {
  	$indexno=$row['indexno'];
  	$studentname=$row['stuname'];
 	$fathername=$row['fathername'];
  	$mothername=$row['mothername'];
  	$dateofbirth=$row['dateofbirth'];
	$father_address=$row['father_address'];	
	$mother_address=$row['mother_address'];
 	$Father_Official_address=$row['Father_Official_address'];	
 	$tel_no=$row['tel_no'];
 	$mobile_no=$row['mobile_no'];
 	$admission_date=$row['admission_date'];
 	$admision_grade=$row['admision_grade'];	
 	$current_grade=$row['current_grade'];
 	$stuclass=$row['class'];
 	$sex=$row['sex'];
 	$gs_division=$row['gs_division'];
 	$electorate=$row['electorate'];	
 	$imagepath=$row['imagepath'];
 	$nic=$row['nicno'];
 	$lastschool=$row['last_school'];
  //echo "<tr>";
  //echo "<td>" . $row['indexno'] . "</td>";
  //echo "<td>" . $row['stuname'] . "</td>";
  //echo "<td>" . $row['fathername'] . "</td>";
  //echo "<td>" . $row['mothername'] . "</td>";
  //echo "<td>" . $row['dateofbirth'] . "</td>";
  //echo "<td> <img src=".$row['imagepath']." name='replaceMe' id='replaceMe'/></td>";
//. $row['imagepath'] .
  //echo "</tr>";
  mysql_close($con);
  }

    // Okay that's enough php for now
?>
<html>
	<head>

	</head>
	<!-- these are handy but that's a lesson for another day -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
	<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.6/jquery.validate.min.js"></script>
	
	<!-- here are your other scripts -->
	<script language=javascript>
	// 	initialize variables 
	var imgRe = /^.+\.(jpg|jpeg|gif|png)$/i;

	//	make mum's address same as dad's
	function mumdadaddressfunction(obj){
		// obj is the checkbox
		if(obj.checked){
			// copy dad's address into mum's address field
			document.myform.motheraddress.value=document.myform.fatheraddress.value;
		}
	}
	
	// compare mum's address to dad's
	function checkmumdadaddress(){
		if(document.myform.motheraddress.value==document.myform.fatheraddress.value){
			document.myform.dadandmumsame.checked=true;		
		}else{
			document.myform.dadandmumsame.checked=false;		
		}
	}
	//	preview a chosen image	
	function previewimage(){
		var imgpath = document.myform.myImage.value;
		var mypreview = findObj("replaceMe");	// using utility object for cross browser compatibility
		if(imgpath.length>6){
			//	and image has been chosen.
			//      your preview image code goes here
			//	your preview image code goes here
			if (imgpath.search(imgRe) != -1){
					mypreview.src = 'file:///'+imgpath;
				}else{	
					alert("JPG, PNG, and GIFs only!");
				}
		}
	}
		
	//	UTILITY FUNCTIONS //
	// Example: obj = findObj("image1");
	function findObj(theObj, theDoc)
	{
	  var p, i, foundObj;
	  
	  if(!theDoc) theDoc = document;
	  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)
	  {
	    theDoc = parent.frames[theObj.substring(p+1)].document;
	    theObj = theObj.substring(0,p);
	  }
	  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
	  for (i=0; !foundObj && i < theDoc.forms.length; i++) 
	    foundObj = theDoc.forms[i][theObj];
	  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++) 
	    foundObj = findObj(theObj,theDoc.layers[i].document);
	  if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);
	  
	  return foundObj;
	}		
			
	</script>
	<body bgcolor='#ebf4fb'>
		<form id="myform" name='myform' method="post" ENCTYPE="multipart/form-data" action="updatestudent.php">
		<!-- form name changed to myform from 'form' because form is a reserved word in the DOM -->
		<table border='2'>
			<tr>
				<th><h1 align='center'>Student Details Update</h1>
					<p align='center'>School Management System</p>
					<table border='2' align='center'>
						<tr>
							<td><label for="indexno">Index No </label></td>
							<td><input type='text' name='indexno' id='indexno' value="<? echo $indexno;?>" /> </td>
						</tr>
						<tr>
							<td><label for="stuname">Student Name</label></td>
							<td><input type='text' name='stuname' id='stuname' value="<? echo $stuname;?>" /> </td>
						</tr>
						<tr>
							<td><label for="dob">Date of Birth</label><button type='button'>Select Date</button></td>
							<td><input type='text' name='dob' id='dob' value="<? echo $dateofbirth;?>" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien Name</label> </td>
							<td><input type='text' name='fathername' id='fathername' value="<? echo $fathername; ?>" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien Address</label> </td>
							<td><input type='text' name='fatheraddress' id='fatheraddress' value="<? echo $father_address;?>" onkeyup="checkmumdadaddress();" /> </td>
						</tr>
						<tr>
							<td><label>Father/Guardien NIC No</label> </td>	
							<td><input type='text' name='nid' id='nid' value="<? echo $nic;?>" /> </td>
						</tr>
						<tr>
							<td><label>Mother Name</label> </td>
							<td><input type='text' name='mothername' id='mothername' value="<? echo $mothername; ?>" /> </td>
						</tr>
						<tr>
							<td><input type='checkbox' name='dadandmumsame' id='dadandmumsame' value='Same' onclick='mumdadaddressfunction(this);' <? if($mother_address==$father_address){ echo " CHECKED";} ?>><label for=motheraddress>Mother Address(Check if Same as Father's) </label> </td>
							<td><input type='text' id='motheraddress' name='motheraddress' value="<? echo $mother_address; ?>" onkeyup="checkmumdadaddress();" /></td>
						</tr>
						<tr>
							<td><label>Official Address</label></td>
							<td><input type='text' name='offaddress' id='offaddress' value="<? echo $Father_Official_address; ?>" /> </td>
						</tr>
						<tr>
							<td><label for="admingrade">Grade</label>
								<select name='admingrade' id=admingrade size=1>
	  								<option value="Grade 1" <? if($admision_grade=="Grade 1"){echo " SELECED";} ?>>Grade 1</option>
	  								<option value="Grade 2" <? if($admision_grade=="Grade 2"){echo " SELECED";} ?>>Grade 2</option>
	  								<option value="Grade 3" <? if($admision_grade=="Grade 3"){echo " SELECED";} ?>>Grade 3</option>
	  								<option value="Grade 4" <? if($admision_grade=="Grade 4"){echo " SELECED";} ?>>Grade 4</option>
								</select>
							</td>
							<td><label for=stuclass>Class</label>
								<select name='stuclass' id=stuclass size=1>
	  								<option value="A" <? if($stuclass=="A"){echo " SELECED";} ?>>A</option>
	  								<option value="B" <? if($stuclass=="B"){echo " SELECED";} ?>>B</option>
	  								<option value="C" <? if($stuclass=="C"){echo " SELECED";} ?>>C</option>
	  								<option value="D" <? if($stuclass=="D"){echo " SELECED";} ?>>D</option>
								</select>
							</td>
						</tr>
						<tr>
							<td><label for="telno">Tel No</label> </td>
							<td><input type='text' name='telno' id='telno' "<? echo $tel_no; ?>" /> </td>
						</tr>
						<tr>
							<td><label for="mobno">Mobile No</label></td>
							<td><input type='text' name='mobno' id='mobno' value="<? echo $mobile_no; ?>" /> </td>
						</tr>
						<tr>
							<td><label>Previous School</label></td>
							<td><input type='text' name='lastschool' id='lastschool' value="<? echo $lastschool; ?>" >
							</td>
						</tr>
						<tr>
							<td><label for="gsdivision">GS DivisionGS Division</label></td>
							<td><input type='text' name='gsdivision' id='gsdivision' value="<? echo $gs_division; ?>" />
							</td>
						</tr>
						<tr>
							<td><label for="electorate">Electorate</label> </td>
							<td><input type='text' name='electorate' id='electorate' value="<? echo $electorate; ?>" />
							</td>
						</tr>
						<tr>
							<td><label for=sex>Sex</label> </td>
							<td><input type=radio name="sex" valu="M" <? if($sex=="M"){echo "CHECKED";} ?> >M&nbsp;&nbsp; 
								<input type=radio name="sex" valu="F" <? if($sex=="F"){echo "CHECKED";} ?> >F
							</td>
						</tr>
						<tr>
							<td>
								<input type='file' name='myImage' id='myImage' size='30' /><br>
								<button type='button' onclick='previewimage();'>Preview</button>
							</td>
							<td>
								<img src='<? echo $imagepath; ?>' name='replaceMe' id='replaceMe' />
							</td>
						</tr>
						<tr>
							<td><label for="datesend">Admision Date</label>
								<button type='button' id='admissiondatebutton'>Select Date</button></td>
							<td><input type='text' name='datesend' id='datesend' value="<? echo $electorate; ?>" /></label>
							</td>
						</tr>
					</table>
				<button type='submit'>Update Details</button>
				</td>
			</tr>
		</table>
		</form>
</body>
</html>

That is usefull for me. My problem overcome after i remove all javascript in this page and put it to the calling html page.

Thanks again.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.