Page 2 of 2

Re: Error on page

Posted: Mon Oct 04, 2010 7:42 am
by alexia_net
Hi. One more thing just to have it clear: Is there any 'clickable' element in php except a button? To give you an idea about what i am trying to do: I want to have a group of radio buttons with buildings, floors, rooms. If the user want to save a room for a building at a specified floor he must have the possibility to select the building first; after selecting a building another list will be automatically populated with the floors for that building. The user selects the floor to which he wants to add the room. Then another list with the rooms for that floor is populated. Is there a way for doing this in one form?
Programming i have done before but nothing related with web design. Just VB and Visual C#, things like these. Thank you.

Re: Error on page

Posted: Mon Oct 04, 2010 8:17 am
by social_experiment
Clickable elements (buttons) are actually HTML elements ;) and i would only use the submit button. Imo, you should look to a javascript solution if you are not comfortable with handling this in php.

Re: Error on page

Posted: Mon Oct 04, 2010 8:25 am
by alexia_net
Thank you. Do you have a good starting point for JavaScripting for a beginner?

Re: Error on page

Posted: Mon Oct 04, 2010 9:00 am
by internet-solution
alexia_net wrote:Hello. Thank you for your answer. This is what I am trying to avoid, the button for submission. From your answer I understand that there is no way to populate/refresh a list if I click the radio button, right?I want to avoid the button because I would have to many of them on my form. The form will get more complex in time. So, there is no way to execute a code after clicking another object on the form beside a button? Thank you!
You definitely have to use Ajax for this. In radio button, you can set an onchange event which will call the javascript function that will make an Ajax request. See the tutorial on w3school - http://www.w3schools.com/ajax/default.asp

Re: Error on page

Posted: Wed Oct 06, 2010 7:50 am
by alexia_net
Hi. I have read the tutorials for Ajax and javascript, but i still cannot make it work. I am posting my code. The idea is that I want to change the value of a variable - $optiune -, defined in the php code on the client side, through a javascript. So, initially the value is $otiune="". When I select BUILDINGS radio button I want this value to become $optiune="buildings" and send it to the server to use it in the php code.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untiteled</title>

<script type="text/javascript">

function check_option(){

	var x="building";
	
	if (window.XMLHttpRequest)     // Object of the current windows
	{ 
	    xhr = new XMLHttpRequest();     // Firefox, Safari, ...
	} 
	else 
	 if (window.ActiveXObject)   // ActiveX version
	 {
	    xhr = new ActiveXObject("Microsoft.XMLHTTP");  // Internet Explorer 
	 } 

	try {
		   xhr = new ActiveXObject("Microsoft.XMLHTTP");    // Trying Internet Explorer 
		}
		catch(e)    // Failed 
		{
		  xhr = new XMLHttpRequest();    // Other browsers.
		}

	 			if (document.BuildingsInfrastructure.rdBuildInfra[0].checked){
					alert("ati ales primul buton");
					document.BuildingsInfrastructure.txtBuilding.value="test";
					//xmlhttp.open("POST","ITA/AddInfo/addBuildingsInfrastructure.php",true);
					//xmlhttp.send("option=building");
					}

	   xhr.open(POST, "addBuildingsInfrastructure.php",  true); 
	   xhr.send("optiune=building"); 
}

</script>

</head>


<body>

<?php 
require_once($_SERVER["DOCUMENT_ROOT"].'/ITA/DB/OpenDB.php');

$optiune="";

function save_building(){
	$nameBuilding = $_POST['txtBuilding'];
		if ($_POST['txtBuilding'] == ""){
			PaginaPrecedenta();
			die ('The name of the Building cannot be blank!');
		}else{
			$strSQL = "INSERT INTO building(internalCodeBuilding, inUseNot) VALUES('$nameBuilding','yes')";
			mysql_query($strSQL) or die ('Unable to insert the new information!<br>');
			PaginaPrecedenta();
			echo 'SAVED!<br>';
		}
}

function PaginaPrecedenta(){
//intoarcere la pagina precedenta
echo '
<a href="addBuildingForm.php">Back</a><br>';
}


if ($_POST[$optiune] == "building") {
 $_POST['txtFloor']="fdddddddddddddddddddddddddddddddddddddddddd";
}

echo '
<form name="BuildingsInfrastructure" method="post" action="">
  <p>&nbsp;</p>
  <table width="50%" border="1">
    <tr>
      <td width="13%" rowspan="4"><label> 
      <input type="radio" name="rdBuildInfra" value="buildings" id="rdBuildInfra_0">
Buildings <br>
<input type="radio" name="rdBuildInfra" value="floors" id="rdBuildInfra_1">
Floors <br>
      <input type="radio" name="rdBuildInfra" value="rooms" id="rdBuildInfra_2">
Rooms</label>
        <br>
        <label>
        <input type="radio" name="rdBuildInfra" value="racks" id="rdBuildInfra_3">
Racks</label></td>
      <td width="51%"><div align="right">Building name: 
          <input type="text" name="txtBuilding" id="txtBuilding">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td width="36%">&nbsp;</td>
    </tr>
    <tr>
      <td><div align="right">Floor name:
          <input type="text" name="txtFloor" id="txtFloor">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select building:
          <select name="lstBuildings" id="lstBuildings">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
    <tr>
      <td><div align="right">Room name:
          <input type="text" name="txtRoom" id="txtRoom">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select floor:
          <select name="lstFloors" id="lstFloors">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
    <tr>
      <td><div align="right">Rack name:
          <input type="text" name="txtRack" id="txtRack">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select room:
          <select name="lstRooms" id="lstRooms">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
  </table>
  <br>
  <input type="submit" name="btnSave" id="btnSave" value="Save" onclick="check_option()"> 
</form>

';


?>

</body>
</html>

Thank you.

Re: Error on page

Posted: Wed Oct 06, 2010 11:20 am
by internet-solution
Your code will not work for several reasons.

To start with

Code: Select all

if ($_POST[$optiune] == "building")  {
 $_POST['txtFloor']="fdddddddddddddddddddddddddddddddddddddddddd";
}
the above will not work as the page is not submitted and $_POST[$optiune] will not have any data.

And you need to call check_option() when your radio button changes. So specify this in your radio buttons onchange event.

You need Ajax if you need to get some data from server (either from database, or some calculations you don't want to share) based on the radio box selected. If you just need to set the value of $_POST['txtFloor'], then you can do the following in javascript, without the Ajax part.

Code: Select all

 function check_option(){
        if (document.BuildingsInfrastructure.rdBuildInfra[0].checked)
                                      document.BuildingsInfrastructure.txtFloor.value ="fdddddddddddddddddddddddddddddddddddddddddd";
}
Then when you submit the page the $_POST['txtFloor'] value will be available to you and then you can process this in your PHP save_building() function.


If you need to use Ajax in future, you need to understand the concept of "callback" function. This function will be called when server (your PHP script - addBuildingsInfrastructure.php) returns requested data. You can specify callback function, as

Code: Select all

 xhr.onreadystatechange=myCallBack;

Re: Error on page

Posted: Thu Oct 07, 2010 2:51 am
by alexia_net
Hi. I have found an example about AJAX and I have got a better idea about AJAX. I have tried to implement it into my program but there is still a catch somewhere and i cannot find it. I have modified the code as follows:
The first file:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untiteled</title>

<script type="text/javascript">


//Get the HTTP Object
function getHTTPObject(){
if (window.ActiveXObject) return new ActiveXObject("Microsoft.XMLHTTP");
	else if (window.XMLHttpRequest) return new XMLHttpRequest();
else {
	alert("Your browser does not support AJAX.");
	return null;
}
} 
		
 var x="test";
		
 function check_option(){
	 
			httpObject = getHTTPObject();
 			if (document.BuildingsInfrastructure.rdBuildInfra[0].checked){
				alert("ati ales primul buton");
				document.BuildingsInfrastructure.txtBuilding.value="test";
								
				if (httpObject != null){
					httpObject.open("GET","saveBuildingsData.php?option="+x, true);
					httpObject.send(null);
	
				}				
			}
		
		var httpObject = null;
		}
</script>

</head>


<body>

<?php 


echo '
<form name="BuildingsInfrastructure" > 
  <p>&nbsp;</p>
  <table width="50%" border="1">
    <tr>
      <td width="13%" rowspan="4"><label> 
      <input type="radio" name="rdBuildInfra" value="buildings" id="rdBuildInfra_0">
Buildings <br>
<input type="radio" name="rdBuildInfra" value="floors" id="rdBuildInfra_1">
Floors <br>
      <input type="radio" name="rdBuildInfra" value="rooms" id="rdBuildInfra_2">
Rooms</label>
        <br>
        <label>
        <input type="radio" name="rdBuildInfra" value="racks" id="rdBuildInfra_3">
Racks</label></td>
      <td width="51%"><div align="right">Building name: 
          <input type="text" name="txtBuilding" id="txtBuilding">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td width="36%">&nbsp;</td>
    </tr>
    <tr>
      <td><div align="right">Floor name:
          <input type="text" name="txtFloor" id="txtFloor">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select building:
          <select name="lstBuildings" id="lstBuildings">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
    <tr>
      <td><div align="right">Room name:
          <input type="text" name="txtRoom" id="txtRoom">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select floor:
          <select name="lstFloors" id="lstFloors">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
    <tr>
      <td><div align="right">Rack name:
          <input type="text" name="txtRack" id="txtRack">
      </div>
        <label>
        <div align="right"></div>
      </label></td>
      <td><div align="right">Select room:
          <select name="lstRooms" id="lstRooms">
        </select>
      </div>        <label>
        <div align="right"></div>
      </label></td>
    </tr>
  </table>
  <br>
  <input type="submit" name="btnSave" id="btnSave" value="Save" onclick="check_option()"> <br>
  <div id="myDiv"><h2>Let AJAX change this text</h2></div>
</form>

';


?>

</body>
</html>

and now the second file, with the value sent through GET

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untiteled</title>


<body>

<?php 
echo $_GET['option'];
?>

echo'
<script type="text/javascript>
alert("Ready");
</script>
';
</body>
</html>
I hope someone can see the problem because i cannot. Thank you.

Re: Error on page

Posted: Thu Oct 07, 2010 5:46 am
by internet-solution
Have you read my previous post?

Re: Error on page

Posted: Thu Oct 14, 2010 3:52 am
by alexia_net
Hi. I did some more reading and i have managed to have this solved. I thank you all for your support. :)