0

私はajaxフォームプロセスを持っています。しかし、関数をクリックすると、このプロセスが実行されます。クリックすると、Jquery ダイアログで PHP フォームが開きます。しかし、フォームを処理すると、POST VAR は NULL になります。

これはコードです：

フォームを要求する関数を含むメイン ファイル:

<!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>Aircrafts</title>
    <link rel="stylesheet" type="text/css" href="../../../lib/css/style.css">
    <link rel="stylesheet" href="../../../lib/css/flick/jquery.ui.all.css">
    <script src="../../../lib/js/jquery.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.button.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.core.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.widget.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.mouse.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.button.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.draggable.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.position.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.resizable.js"></script>
    <script src="../../../lib/js/ui/jquery.ui.dialog.js"></script>


    <script>
    $(function() {
        $( "#loadingdialog" ).dialog({
            autoOpen: false,
            width: 300,
            height: 65
        });

        $("#loadingdialog").dialog('widget').find(".ui-dialog-titlebar").hide();
        $("#loadingdialog").dialog('widget').find(".ui-resizable-se").hide();

        $( "#editaircraftdialog" ).dialog({
            autoOpen: false,
            width: 425
        });

        $("#editaircraftdialog").dialog('widget').find(".ui-resizable-se").hide();                   
    });

        if (window.XMLHttpRequest)
                {
                ajax=new XMLHttpRequest();
                }
            else
                {
                ajax=new ActiveXObject("Microsoft.XMLHTTP");
                }


     function edit(str) {
            $.ajax({
                url: "./edit_aircraft.php?icao="+str,
                context: document.body,
                success: function(responseText) {
                    $("#editaircraftdialog").html(responseText);
                    $("#editaircraftdialog").find("script").each(function(i) {
                        eval($(this).text());
                    });
                    $("#editaircraftdialog").dialog('open');
                }
            });
        };
    </script>
    </head>
    <body>

    <div id="result"></div></br>

    <div id="loadingdialog"><center><p><img src="../../../lib/images/loading.gif"></center></p></div>

    <div id="editaircraftdialog"></div>


 <?php
    require_once('../../config.php');

$query = "SELECT * FROM aircrafts ORDER BY ICAO ASC LIMIT";

$result = mysql_query($query);
if (!$result)
{
die (mysql_error());
}

echo "<table border='0' cellspacing='0'>";
echo "<tr><th class=tabletitles>ICAO</th><th class=tabletitles>Edit</th></tr>";

while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
    if($i++%2==0){
       $color="#FFFFFF";
    }else{
       $color="#CCCCCC";
    }

    ?>

    <tr bgcolor='<?php echo $color; ?>' onmouseover="this.style.background='#ABFB04';" onmouseout="this.style.background='<?php echo $color; ?>';">
    <?php

echo "<td class=tablelist>";

echo $row["ICAO"] . '</td><td class=tablelist>';


echo "<img src=\"../../../lib/images/edit.png\" onclick=\"edit('".$row["ICAO"]."')\"></td><td class=tablelist>";

}

echo "</table>";
mysql_close();
    ?>

    </body>
    </html>

AJAX フォーム プロセスと PHP フォームを含むファイル:

<?php
require_once ('../../config.php');
$icao = $_GET["icao"];

$query = "SELECT * FROM aircrafts WHERE ICAO = '$icao'";

$result = mysql_query($query);
if (!$result)
{
die (mysql_error());
}

?>
<form action="javascript:editForm();" method="post" enctype="application/x-www-form-urlencoded"> 
<?php
echo '<table border="0">';
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){

echo '<tr><td class="forms">ICAO:</td><td><input type="text" id="icao" name="icao" size="30" value=';
echo $row["ICAO"] . "></td></tr>";

echo '<tr><td class="forms">Name:</td><td><input type="text" id="name" name="name" size="30" value=';
echo $row["Name"] . "></td></tr>";

echo '<tr><td class="forms">Weight Empty:</td><td><input type="text" id="weightempty" name="weightempty" size="30" value=';
echo $row["WeightEmpty"] . "></td></tr>";

echo '<tr><td class="forms">Weight Full:</td><td><input type="text" id="weightfull" name="weightfull" size="30" value=';
echo $row["WeightFull"] . "></td></tr>";

echo '<tr><td class="forms">Cargo Full:</td><td><input type="text" id="cargofull" name="cargofull" size="30" value=';
echo $row["CargoFull"] . "></td></tr>";

echo '<tr><td class="forms">Cruise Speed:</td><td><input type="text" id="cruisespeed" name="cruisespeed" size="30" value=';
echo $row["CruiseSpeed"] . "></td></tr>";

echo '<tr><td class="forms">Range:</td><td><input type="text" id="range" name="range" size="30" value=';
echo $row["Range"] . "></td></tr>";

echo '<tr><td class="forms">Price:</td><td><input type="text" id="price" name="price" size="30" value=';
echo $row["Price"] . "></td></tr>";

if($row["FirstClassSeats"] != NULL && $row["FirstClassSeats"] != 0){
echo '<tr><td class="forms">First Class Seats:</td><td><input type="text" id="firstclassseats" name="firstclassseats" size="30" value=';
echo $row["FirstClassSeats"] . "></td></tr>";}

if($row["BusinessClassSeats"] != NULL && $row["BusinessClassSeats"] != 0){
echo '<tr><td class="forms">Business Class Seats:</td><td><input type="text" id="businessclassseats" name="businessclassseats" size="30" value=';
echo $row["BusinessClassSeats"] . "></td></tr>";}

if($row["EconomyClassSeats"] != NULL && $row["EconomyClassSeats"] != 0){
echo '<tr><td class="forms">Economy Class Seats:</td><td><input type="text" id="economyclassseats" name="economyclassseats" size="30" value=';
echo $row["EconomyClassSeats"] . "></td></tr>";}

echo '<tr><td><input id="editaircraft" type="submit" value="Edit Aircraft"></td></tr>';

}
echo "</table>";
?>

</form>
<script>

    $(function() {
        $("#editaircraft")
            .button()
            .click(function editForm() {
        });
    });

function editForm(){

            var icao = document.getElementById('icao').value;
            var name = document.getElementById('name').value;
            var weightempty = document.getElementById('weightempty').value;
            var weightfull = document.getElementById('weightfull').value;
            var cargofull = document.getElementById('cargofull').value;
            var cruisespeed = document.getElementById('cruisespeed').value;
            var range = document.getElementById('range').value;
            var price = document.getElementById('price').value;
            var firstclassseats = document.getElementById('firstclassseats').value;
            var businessclassseats = document.getElementById('businessclassseats').value;
            var economyclassseats = document.getElementById('economyclassseats').value;
            ajax.open("POST","edit_aircraft_process.php",true);
            ajax.onreadystatechange=function(){
                if(ajax.readyState==4)
                {
                refreshTable(function(){$("#loadingdialog").dialog('close');});

                refreshTable(function(){$("#result").fadeIn(); document.getElementById("result").innerHTML=ajax.responseText;});
                setTimeout(function() { $("#result").fadeOut() }, 5000);
                }
            }
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        ajax.send("icao="+icao+"&name="+name+"&weightempty="+weightempty+"&weightfull="+weightfull+"&cargofull="+cargofull+"&cruisespeed="+cruisespeed+"&range="+range+"&price="+price+"&firstclassseats="+firstclassseats+"&businessclassseats="+businessclassseats+"&economyclassseats="+economyclassseats);
        $("#editaircraftdialog").dialog('close');
        $("#loadingdialog").dialog('open');
        }
</script>

editForm を実行すると、<div id="result">細かい処理の結果を入れて動作します。ただし、データベースで編集するために送信される変数 (icao など) は NULL であり、何も編集しません。

エラーは、ajax リクエストの後、document.getElementById.

4

2 に答える 2

0

XMLでは、フラグメント識別子はタイプIDであり、要素ごとにタイプIDの属性は1つだけです。したがって、XHTML 1.0では、id属性はタイプIDであると定義されています。XHTML1.0ドキュメントが適切に構造化されたXMLドキュメントであることを確認するため。

この場合、データを同じ入力IDにループします。コードを次のように変更します。

var i = 1;
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){

echo '<tr><td class="forms">ICAO:</td><td><input type="text" id="icao_' . i . '" name="icao" size="30" value="';
echo $row["ICAO"] . '"></td></tr>"';

echo '<tr><td class="forms">Name:</td><td><input type="text" id="name_' . i . '" name="name" size="30" value="';
echo $row["Name"] . '"></td></tr>"';

echo '<tr><td class="forms">Weight Empty:</td><td><input type="text" id="weightempty_' . i . '" name="weightempty" size="30" value="';
echo $row["WeightEmpty"] . '"></td></tr>"';

echo '<tr><td class="forms">Weight Full:</td><td><input type="text" id="weightfull_' . i . '" name="weightfull" size="30" value="';
echo $row["WeightFull"] . '"></td></tr>"';

echo '<tr><td class="forms">Cargo Full:</td><td><input type="text" id="cargofull_' . i . '" name="cargofull" size="30" value="';
echo $row["CargoFull"] . '"></td></tr>"';

echo '<tr><td class="forms">Cruise Speed:</td><td><input type="text" id="cruisespeed_' . i . '" name="cruisespeed" size="30" value="';
echo $row["CruiseSpeed"] . '"></td></tr>"';

echo '<tr><td class="forms">Range:</td><td><input type="text" id="range_' . i . '" name="range" size="30" value="';
echo $row["Range"] . '"></td></tr>"';

echo '<tr><td class="forms">Price:</td><td><input type="text" id="price_' . i . '" name="price" size="30" value="';
echo $row["Price"] . '"></td></tr>"';

if($row["FirstClassSeats"] != NULL && $row["FirstClassSeats"] != 0){
echo '<tr><td class="forms">First Class Seats:</td><td><input type="text" id="firstclassseats_' . i . '" name="firstclassseats" size="30" value="';
echo $row["FirstClassSeats"] . '"></td></tr>"';}

if($row["BusinessClassSeats"] != NULL && $row["BusinessClassSeats"] != 0){
echo '<tr><td class="forms">Business Class Seats:</td><td><input type="text" id="businessclassseats_' . i . '" name="businessclassseats" size="30" value="';
echo $row["BusinessClassSeats"] . '"></td></tr>"';}

if($row["EconomyClassSeats"] != NULL && $row["EconomyClassSeats"] != 0){
echo '<tr><td class="forms">Economy Class Seats:</td><td><input type="text" id="economyclassseats_' . i . '" name="economyclassseats" size="30" value="';
echo $row["EconomyClassSeats"] . '"></td></tr>"';}

echo '<tr><td><input id="editaircraft_' . i . '" type="submit" value="Edit Aircraft"></td></tr>';
i++;
}

次に、jqueryserializeを使用してデータを送信できます

これを変える ：

ajax.send("icao="+icao+"&name="+name+"&weightempty="+weightempty+"&weightfull="+weightfull+"&cargofull="+cargofull+"&cruisespeed="+cruisespeed+"&range="+range+"&price="+price+"&firstclassseats="+firstclassseats+"&businessclassseats="+businessclassseats+"&economyclassseats="+economyclassseats);

これに：

ajax.send($("form").serialize());
于 2013-01-20T19:37:06.670 に答える
0

正確な問題が何であるかはわかりませんが、コードをすばやくチェックすると、次の 2 つのことがあります。

  1. 入力タグを適切に閉じていません。例:

     echo '<tr><td class="forms">ICAO:</td><td><input type="text" id="icao" name="icao" size="30" value=';
echo $row["ICAO"] . "/></td></tr>";// <--- notice the added forward slash to close the input

  2. value属性を で囲んでいません"":

     echo '<tr><td class="forms">ICAO:</td><td><input type="text" id="icao" name="icao" size="30" value="'; //<-- open here
echo $row["ICAO"] . '"/></td></tr>'; //<--- notice the closing "
于 2013-01-20T19:13:51.840 に答える