Databases
StackOverflow2013
Postsdbo
PODependent Things PHP + AJAX
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PODependent Things PHP + AJAX
    text
    copied!<p>I have this two files:</p> <p>new_aircraft.php</p> <pre><code> &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;link rel="STYLESHEET" type="text/css" href="./style.css"&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;Insert Aircraft&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;script&gt; //Ajax Script function require(){ try{ req = new XMLHttpRequest(); }catch(err1){ try{ req = new ActiveXObject("Microsoft.XMLHTTP"); }catch(err2){ try{ req = new ActiveXObject("Msxml2.XMLHTTP"); }catch(err3){ req = false; } } } return req; } var request = require(); function callAjax(){ var ramdom = parseInt(Math.random()*999999999); valor = document.getElementById("numberclasses").value; var url="classes.php?Value="+valor+"&amp;r="+ramdom; request.open("GET",url,true); request.onreadystatechange = answerAjax; request.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); request.send(null); } function answerAjax(){ if(request.readyState==4){ if(request.status==200){ //alert(request.responseText); document.getElementById("classes").innerHTML=request.responseText; }else{ alert("ha ocurrido un error"+request.statusText); } } } &lt;/script&gt; &lt;? $boton = $_POST['enviar']; $nombre = $_POST['nombre']; $precio = $_POST['precio']; $pax = $_POST['pax']; $ICAO = $_POST['ICAO']; if($boton == 'Insertar') { include('./db.inc.php'); $ICAO = strtoupper($ICAO); mysql_query("INSERT INTO flota(ICAO, nombre, precio, capacidad) VALUES('$ICAO', '$nombre', '$precio', '$pax')") or die('&lt;h4 style="color: red;"&gt;Ha habido un problema con la insercion.&lt;/h4&gt;'); mysql_close(); echo '&lt;h3 style="color: green;"&gt;Aeronave adquirida correctamente.&lt;h3/&gt;'; } else { ?&gt; &lt;form action="insertar-modelo.php" method="post" enctype="application/x-www-form-urlencoded"&gt; &lt;table&gt; &lt;tr&gt;&lt;td class=Forms&gt;ICAO: &lt;/td&gt;&lt;td&gt;&lt;input type="text" value="" name="ICAO" /&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class=Forms&gt;Name: &lt;/td&gt;&lt;td&gt;&lt;input type="text" value="Airbus A320" name="nombre" /&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class=Forms&gt;Price: &lt;/td&gt;&lt;td&gt;&lt;input maxlength="9" value="1000000" type="text" name="precio" /&gt; €&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class=Forms&gt;Number Classes: &lt;/td&gt;&lt;/td&gt;&lt;td&gt;&lt;select name="numberclasses" id="numberclasses" onchange="callAjax()"&gt; &lt;option&gt;Select Number of Classes&lt;/option&gt; &lt;?php echo'&lt;option value="1"&gt;One&lt;/option&gt;'; ?&gt; &lt;/select&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td id="classes" &gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class=Forms&gt;Capacidad: &lt;/td&gt;&lt;td&gt;&lt;input maxlength="3" value="150" type="text" name="pax" /&gt; pasajeros&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt;&lt;br /&gt; &lt;input type="submit" name="enviar" value="Insertar"/&gt; &lt;/form&gt; &lt;? } ?&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>classes.php</p> <pre><code> &lt;?php $value = $_GET['Value']; if($value == 1){ ?&gt; &lt;thead&gt; &lt;td class=Forms&gt;First Class: &lt;/td&gt;&lt;td&gt;&lt;input maxlength="3" value="150" type="text" name="pax" /&gt;&lt;/td&gt; &lt;/thead&gt; &lt;?php } ?&gt; </code></pre> <p>And the result when I "Select Number of Classes" 1 is <a href="http://i48.tinypic.com/erbfnn.png" rel="nofollow">http://i48.tinypic.com/erbfnn.png</a> (It is an image, please see it).</p> <p>The First Class part isn´t on the correct order. It should below Number Classes but It is the first. And First Class part doesn´t respect the other parts width.</p> <p>How can I fix it?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload