I have a problem with this.
index.php
<script type="text/javascript">
function edit(str){
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
document.getElementById("editdialog").innerHTML=conection.responseText;
$( "#editdialog" ).dialog({
autoOpen: true,
width: 425
});
}
xmlhttp.open("GET","edit.php?id="+str,true);
xmlhttp.send();
}
</script>
$query=mysql_result(SELECT * FROM paises)
while ($row = mysql_fetch_assoc($query)) {
echo $row['pais'];
echo "<a href=\"#\" onclick=\"edit('".$row["ICAO"]."')\">Edit</a>";
}
?>
<div id="editdialog" title="Edit"></div>
and the edit.php file:
<script src="./jquery.js"></script>
<script src="./ui/jquery.ui.widget.js"></script>
<script src="./ui/jquery.ui.button.js"></script>
<script src="./ui/jquery.ui.core.js"></script>
<script src="./ui/jquery.ui.widget.js"></script>
<script src="./ui/jquery.ui.mouse.js"></script>
<script src="./ui/jquery.ui.button.js"></script>
<script src="./ui/jquery.ui.draggable.js"></script>
<script src="./ui/jquery.ui.position.js"></script>
<script src="./ui/jquery.ui.resizable.js"></script>
<script src="./ui/jquery.ui.dialog.js"></script>
<script src="./ui/jquery.ui.effect.js"></script>
<script>
$(function() {
$("#editaircraft")
.button()
.click(function(event) {
});
});
</script>
<?php
require_once ('config.php');
$icao = $_REQUEST["icao"];
echo '<tr><td class="forms">Number Classes:</td><td><select id="numberclasses" name="numberclasses">';
echo "<option value='0'>Select Number of Classes</option>";
echo "<option value='1'>One Classes (Economy)</option>";
echo "<option value='2'>Two Classes (Business & Economy)</option>";
echo "<option value='3'>Three Classes (First, Business & Economy)</option>";
echo '</select></td></tr>';
echo '<tr><td class="forms">First Class Seats:</td><td><input disabled="disabled" type="text" id="firstclassseats" name="firstclassseats" size="30" value=';
echo $row["FirstClassSeats"] . "></td></tr>";
echo '<tr><td class="forms">Business Class Seats:</td><td><input disabled="disabled" type="text" id="businessclassseats" name="businessclassseats" size="30" value=';
echo $row["BusinessClassSeats"] . "></td></tr>";
echo '<tr><td class="forms">Economy Class Seats:</td><td><input disabled="disabled" type="text" id="economyclassseats" name="economyclassseats" size="30" value=';
echo $row["EconomyClassSeats"] . "></td></tr>";
?>
<script>
$("#numberclasses").change(function() {
value = $(this).val();
str = parseInt(value);
switch(str)
{
case 0:
$(document).ready(function() {
$("#firstclassseats").attr("disabled","disabled");
$("#businessclassseats").attr("disabled","disabled");
$("#economyclassseats").attr("disabled","disabled");
});
break;
case 1:
$(document).ready(function() {
$("#economyclassseats").removeAttr('disabled');
$("#firstclassseats").attr("disabled","disabled");
$("#businessclassseats").attr("disabled","disabled");
});
break;
case 2:
$(document).ready(function() {
$("#businessclassseats").removeAttr('disabled');
$("#economyclassseats").removeAttr('disabled');
$("#firstclassseats").attr("disabled","disabled");
});
break;
case 3:
$(document).ready(function() {
$("#firstclassseats").removeAttr('disabled');
$("#businessclassseats").removeAttr('disabled');
$("#economyclassseats").removeAttr('disabled');
});
break;
}
});
</script>
<?php
echo "<tr><td><input id='editaircraft' type='submit' value='Edit Aircraft'></td></tr>";
echo "</table>";
?>
</form>
The problem is this script:
$("#numberclasses").change(function() {
value = $(this).val();
str = parseInt(value);
switch(str)
{
case 0:
$(document).ready(function() {
$("#firstclassseats").attr("disabled","disabled");
$("#businessclassseats").attr("disabled","disabled");
$("#economyclassseats").attr("disabled","disabled");
});
break;
case 1:
$(document).ready(function() {
$("#economyclassseats").removeAttr('disabled');
$("#firstclassseats").attr("disabled","disabled");
$("#businessclassseats").attr("disabled","disabled");
});
break;
case 2:
$(document).ready(function() {
$("#businessclassseats").removeAttr('disabled');
$("#economyclassseats").removeAttr('disabled');
$("#firstclassseats").attr("disabled","disabled");
});
break;
case 3:
$(document).ready(function() {
$("#firstclassseats").removeAttr('disabled');
$("#businessclassseats").removeAttr('disabled');
$("#economyclassseats").removeAttr('disabled');
});
break;
}
});
</script>
This script must activate and deactivate in function the selection of the select. But if I do this in the file all works perfect. But If I want to do it by the index.php with the Edit link Ajax opens the dialog but the script don´t work. I select the option but the inputs not change.