Ajax没有将变量发布到php文件

时间:2012-12-11 16:25:01

标签: ajax post drag-and-drop jquery-ui-draggable

我试图在'index.php'中使用拖放功能并将变量'element'发布到'store.php',在最终版本中它应该更新数据库。

'store.php'被调用并运行但变量未被传递。我在下面添加了一个缩短版本的'store.php',其中有一个陷阱来捕获它,所以在这个版本中我收到响应“Element value not set”。

的index.php:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="scripts/jquery-1.3.2.min.js"></script>
<script src="scripts/jquery-ui-1.7.1.custom.min.js"></script>
<link rel="stylesheet" href="style.css">

<div class="content_box" id="content_box_drag" onMouseOver="drag();">
    Drag label
    <?php for($i=0; $i<5;$i++) {
        echo "<p class='dragelement' id='dragelement_$i'>Ferrari_$i</p>";
    } ?>
</div>

<div class="content_holder_box" id="content_box_drop">
    Drop here
    <p class="dropper"></p>
</div>

<div style="clear:both;"></div>
    <br/><br/>
<div id="search_result"></div> 

<script>
    //initialize the drag and drop functions.
   function drag(){

    $( "#content_box_drag p" ).draggable({
        appendTo: "body",
        helper: "clone",
        revert: "invalid"

     });

    $( "#content_box_drop p" ).droppable({
        activeClass: "dropper_hover",
        hoverClass: "dropper_hover",
        accept: ":not(.ui-sortable-helper)",
        drop: function( event, ui ) {
             var ele = ui.draggable.text();
                $.ajax({
                url: "store.php",
                method: "POST",
                data: "element=" + ele,
                success: function(result) {
                    alert(result);
                }
           });
        }
    });
   }
</script>

STORE.PHP(缩短):

<?php

if(isset($_POST['element'])){
    $element=$_POST['element'];
} else {
    echo "Element value not set";
    exit;
}

?>

为什么没有设置变量的想法?

1 个答案:

答案 0 :(得分:1)

参数method不存在,请更改为type: "POST"

将您的数据设置为JSON地图,将data: "element=" + ele更改为data: {element : ele}

http://api.jquery.com/jQuery.ajax/(搜索type说明)

$( "#content_box_drop p" ).droppable({
    activeClass: "dropper_hover",
    hoverClass: "dropper_hover",
    accept: ":not(.ui-sortable-helper)",
    drop: function( event, ui ) {
         var ele = ui.draggable.text();
            $.ajax({
            url: "store.php",
            type: "POST",
            data: {element : ele},
            success: function(result) {
                alert(result);
            }
       });
    }
});