AJAX无法将数据发送到PHP页面

时间:2012-11-08 19:29:04

标签: php ajax

我有一个带有这个AJAX代码的php页面,它从表单中获取数据并将它们传递给另一个php页面。 问题是它不起作用,我不知道为什么!

这里的AJAX代码格式为:

               <form name="modulo" id="alter_tarea">
                    <table id="alter_tarea_table">
                        <tr>
                            <td>Descrizione</td>
                            <td><input type="text" name="descrizione" id="descrizione" value="<?php echo $x['descrizione']; ?>"></td>
                        </tr>
                        <tr>
                            <td>Data Limite</td>
                            <td><input type="text" name="data_limite" id="sel3" size="10" value="<?php echo $x['data_limite']; ?>"><input type="reset" value=" ... "
        onclick="return showCalendar('sel3', '%Y-%m-%d');"></td>
                        </tr> 
                        <tr>
                            <td>Realizzato</td>
                            <?php 
                                if($x['realizzato'] == 1)
                                    echo"<td><input type=\"checkbox\" name=\"realizzato\" id=\"realizzato\" /></td>";
                                else
                                    echo"<td><input type=\"checkbox\" name=\"realizzato\" id=\"realizzato\" checked=\"checked\"/></td>";  
                            ?>
                        </tr>                 
                        <tr>
                            <td><input type="button" value="Modifica" id="modifica_button" name="modifica_button"></td>
                        </tr>
                    </table>  
                </form>

                         <script type="text/javascript">
                            $(document).ready(function() {
                                $("#modifica_button").click(function(){

                                var descrizione = $("#descrizione").val();
                                var data = $("#data_limite").val();
                                var realizzato = $("#realizzato").val();

                                $.ajax({

                                //imposto il tipo di invio dati (GET O POST)
                                type: "POST",

                                //Dove devo inviare i dati recuperati dal form?
                                url: "modifica_tarea.php",

                                //Quali dati devo inviare?
                                data: "descrizione=" + descrizione + "&data_limite=" + data + "&realizzato=" + realizzato,
                                dataType: "html",

                                //Inizio visualizzazione errori
                                success: function(msg)
                                {
                                    $("#mostra_tarea").replaceWith(msg); 
                                },
                                error: function()
                                {
                                    alert("Chiamata fallita, si prega di riprovare..."); //sempre meglio impostare una callback in caso di fallimento
                                }
                                });
                            });
                           });
                    </script>

这里是简单的.php页面:

<?php

$descrizione = $_POST['descrizione'];
$data_limite = $_POST['data'];
$realizzato = $_POST['realizzato'];

echo $descrizione;
echo $data_limite;
echo $realizzato;
?>

1 个答案:

答案 0 :(得分:0)

看起来你忘了包含jQuery库....它对我来说很好。

<!-- ADD THIS LINE //-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<form name="modulo" id="alter_tarea">
                    <table id="alter_tarea_table">
                        <tr>
                            <td>Descrizione</td>
                            <td><input type="text" name="descrizione" id="descrizione" value="<?php echo $x['descrizione']; ?>"></td>
                        </tr>
                        <tr>
                            <td>Data Limite</td>
                            <td><input type="text" name="data_limite" id="sel3" size="10" value="<?php echo $x['data_limite']; ?>"><input type="reset" value=" ... "
        onclick="return showCalendar('sel3', '%Y-%m-%d');"></td>
                        </tr> 
                        <tr>
                            <td>Realizzato</td>
                            <?php 
                                if($x['realizzato'] == 1)
                                    echo"<td><input type=\"checkbox\" name=\"realizzato\" id=\"realizzato\" /></td>";
                                else
                                    echo"<td><input type=\"checkbox\" name=\"realizzato\" id=\"realizzato\" checked=\"checked\"/></td>";  
                            ?>
                        </tr>                 
                        <tr>
                            <td><input type="button" value="Modifica" id="modifica_button" name="modifica_button"></td>
                        </tr>
                    </table>  
                </form>

                         <script type="text/javascript">
                            $(document).ready(function() {
                                $("#modifica_button").click(function(){

                                var descrizione = $("#descrizione").val();
                                var data = $("#data_limite").val();
                                var realizzato = $("#realizzato").val();

                                $.ajax({

                                //imposto il tipo di invio dati (GET O POST)
                                type: "POST",

                                //Dove devo inviare i dati recuperati dal form?
                                url: "modifica_tarea.php",

                                //Quali dati devo inviare?
                                data: "descrizione=" + descrizione + "&data_limite=" + data + "&realizzato=" + realizzato,
                                dataType: "html",

                                //Inizio visualizzazione errori
                                success: function(msg)
                                {
                                    // CHANGE THIS LINE TO $("#mostra_tarea").replaceWith(msg); 
                                    $("#mostra_tarea").empty().append(msg);  
                                },
                                error: function()
                                {
                                    alert("Chiamata fallita, si prega di riprovare..."); //sempre meglio impostare una callback in caso di fallimento
                                }
                                });
                            });
                           });
                    </script>