始终从不同的丢弃图像中获取相同的ID

时间:2015-04-14 16:59:02

标签: javascript php jquery html drag-and-drop

我有7个不同的div(从#rang1到#rang7)我可以在它们上放下图像。
具有类.DraggedItem的图像来自数据库,并且它们都具有不同的ID。我通过普通的fetch_assoc显示这些图像。如果有必要,你可以看到这样做的代码,请告诉我,以便我发布。但它确实是常规的
fetch_assoc方法 没有进一步的说话,让我们跳进代码

JS:

<script type="text/javascript">
$(function(){
    $(".DraggedItem").draggable({
            helper:'clone', 
            cursor:'move',
            revert: true
    });

    $('#rang1').droppable({
      drop: function( event, ui ) {
        //$('#rang1input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang1input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang1').append($img);
      }
    });

    $('#rang2').droppable({
      drop: function( event, ui ) {
        //$('#rang2input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang2input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang2').append($img);
      }
    });

    $('#rang3').droppable({
      drop: function( event, ui ) {
        //$('#rang3input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang3input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang3').append($img);
      }
    });

    $('#rang4').droppable({
      drop: function( event, ui ) {
        //$('#rang4input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang4input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang4').append($img);
      }
    });

    $('#rang5').droppable({
      drop: function( event, ui ) {
        //$('#rang5input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang5input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang5').append($img);
      }
    });

    $('#rang6').droppable({
      drop: function( event, ui ) {
        //$('#rang6input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang6input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang6').append($img);
      }
    });

    $('#rang7').droppable({
      drop: function( event, ui ) {
        //$('#rang7input').val($(ui.draggable).attr('id'));
        var elemid = ui.draggable[0].id;
        $("#rang7input").val(elemid);
        var imgsrc = ui.helper[0].src;
        var $img = $('<img></img>');
        $img.width(90);
        $img.height(90);
        $img.attr('src', imgsrc);

        $('#rang7').append($img);
      }
    });
});
</script>

HTML:

<form action="<?php echo $_SERVER["PHP_SELF"] ?>" method="POST">
<input type="hidden" value="<?php echo $row["IDBewoner"] ?>" name="bewoner">
<td> 
    <div id="rang1"></div> 
    <input type="hidden" value="" id="rang1input" name="rang1value">
</td>
<td> 
    <div id="rang2"></div> 
    <input type="hidden" value="" id="rang2input" name="rang2value">
</td>
<td> 
    <div id="rang3"></div> 
    <input type="hidden" value="" id="rang3input" name="rang3value">
</td>
<td> 
    <div id="rang4"></div> 
    <input type="hidden" value="" id="rang4input" name="rang4value">
</td>
<td> 
    <div id="rang5"></div>
    <input type="hidden" value="" id="rang5input" name="rang5value">
</td>
<td> 
    <div id="rang6"></div> 
    <input type="hidden" value="" id="rang6input" name="rang6value">
</td>
<td> 
    <div id="rang7"></div> 
    <input type="hidden" value="" id="rang7input" name="rang7value">
</td>
<input type="submit" value="Save">
</form>

PHP代码:

<?php 

if($_SERVER["REQUEST_METHOD"] == "POST") {
    $rang1 = $_POST["rang1value"];
    $rang2 = $_POST["rang1value"];
    $rang3 = $_POST["rang1value"];
    $rang4 = $_POST["rang1value"];
    $rang5 = $_POST["rang1value"];
    $rang6 = $_POST["rang1value"];
    $rang7 = $_POST["rang1value"];
    $bewonerID = $_POST["bewoner"];

    echo "<script>alert($rang1)</script>";
    echo "<script>alert($rang2)</script>";
    echo "<script>alert($rang3)</script>";
    echo "<script>alert($rang4)</script>";
    echo "<script>alert($rang5)</script>";
    echo "<script>alert($rang6)</script>";
    echo "<script>alert($rang7)</script>";
    }
?>

问题在于,当我提交表格时,我总是得到相同的身份证件 我认为脚本不是php代码有问题。我试图以不同的方式获得丢弃图像的id。 我确实有不同身份的不同图像,但我总是一遍又一遍地获得相同的身份。

1 个答案:

答案 0 :(得分:5)

我认为你总是在寻找相同的POST值,试试这个:

$rang1 = $_POST["rang1value"];
$rang2 = $_POST["rang2value"];
$rang3 = $_POST["rang3value"];
$rang4 = $_POST["rang4value"];
$rang5 = $_POST["rang5value"];
$rang6 = $_POST["rang6value"];
$rang7 = $_POST["rang7value"];