how to get the value of the image when drop from the droppable area?

Question

i have a drag and drop code here from jquery i wanted to get the value of the image then insert it to the database and when the image is remove from the droppable area then update and remove the image value.. how can i do it? here's the code....

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Droppable - Default functionality</title>
    <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
    <script src="js/jquery-1.4.4.js"></script>
    <script src="js/jquery.ui.core.js"></script>
    <script src="js/jquery.ui.widget.js"></script>
    <script src="js/jquery.ui.mouse.js"></script>
    <script src="js/jquery.ui.draggable.js"></script>
    <script src="js/jquery.ui.droppable.js"></script>
    <link rel="stylesheet" href="js/demos.css">
    <style>
    #comment { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
    #draggable1 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
    #droppable { width: 500px; height: 200px; padding: 0.5em; float: left; margin: 10px; background: silver;}

    </style>
    <script>
    $(function() {
        $( "#comment" ).draggable();
        $( "#draggable1" ).draggable();
        $( "#droppable" ).droppable({

            drop: function( event, ui ) {
            $( this )
            .find( "p" )
                .html("Dropped!")
            },
            out: function(event, ui) {
            $(this)
            .find( "p" )
                .html("Drop Node Here!");   
            }
        });
    });


    </script>
</head>
<body>

<div class="demo">

<div id="comment" class="ui-widget-content">
    <img src="images/signup.png" id="1">
</div>
<div id="draggable1" class="ui-widget-content">
    <img src="images/signup.png" id="2">
</div>



<div id="droppable" class="ui-widget-header">
    <p>Drop Node here</p>
    <?php
        $comment = "#comment";
        $drop = "#droppable";
        $dropped = "dropped";
        require_once("includes/connection.php");

        require_once("includes/close.php");
    ?>
</div>

</div><!-- End demo -->

</body>
</html>

Answer 1

Off the top of my head something like this should give you the src of the image

drop: function( event, ui ) {
var image_src = $(ui).attr('src');

how to get the value of the image when drop from the droppable area?

Question

1 answers

solution1
0 2011-02-01 10:04:06

how to get the value of the image when drop from the droppable area?

Question

1 answers

solution1 0 2011-02-01 10:04:06

solution1
0 2011-02-01 10:04:06