Сохранить новую позицию для перетаскиваемого div, созданного динамически - PullRequest
Новая
       16

Сохранить новую позицию для перетаскиваемого div, созданного динамически

0 голосов
/ 24 августа 2011

У меня есть функция для сохранения новой позиции перетаскиваемого div, созданного динамически. 

<script type="text/javascript"> 

  $(document).ready(function() {

    $(".comdiv").draggable(

    {

      drag: function(event, ui) {

        $(".comdiv").css("opacity", "0.6"); // Semi-transparent when dragging

      },

      stop: function(event, ui) {

       alert ('Finished dragging!');

        $(".comdiv").css("opacity", "1.0"); // Full opacity when stopped

      },

    });

  });

</script>

Это работает для статического div, определенного в теле HTML-страницы.Я получаю окно с предупреждением.Но я также создаю div в php-скрипте, который вызывается через ajax.Окно предупреждения не подходит для них.Обработчик события определен для всего класса.Есть ли другой способ вызова этой функции для элементов div, созданных в этом сценарии?Окно предупреждения не появляется для них. 

<?php

function get_nodes() {
// load SimpleXML
$nodes = new SimpleXMLElement('communities.xml', null, true);

foreach($nodes as $node) // loop through 
{

        echo "<div id = '".$node['ID']."' class= 'comdiv ui-widget-content' style = 'top: ".$node->TOP."px; left: ".$node->LEFT."px; 

width: ".$node->WIDTH."px; height: ".$node->HEIGHT."px;'> \n";

        echo "   <p class = 'comhdr editableText ui-widget-header'>".$node->NAME."</p>\n";

        echo "   <a href='#' onClick=\"delete_div('".$node['ID']."');\">Delete</a>&nbsp;&nbsp;\n";
        echo "   <a href='#' onClick=\"add_url('".$node['ID']."');\">Add URL</a>&nbsp;&nbsp;\n";

        foreach($node->URLS->URL as $url)
        { 
           echo "   <div id='".$url['ID']."' class='comurl'><a href='".$url->URLC."' target='_blank'>".$url->NAME."</a><img 

align='right' src='redx.png' onClick='delete_url(\'".$url['ID']."\');'/></div>";

           /* echo "<script type='text/javascript'> alert('Node: ".$node['ID']." has URLS:".$url['ID']." ".$url->NAME." ".$url->URLC." 

'); </script>"; */
        }

        echo "</div> \n";

        echo "<script type='text/javascript'>\n";
        echo "  $('#".$node['ID']."').resizable();\n";
        echo "  $('#".$node['ID']."').draggable();\n";
        echo "  $('#".$node['ID']."').draggable('option', 'handle', '.comhdr');\n";
        echo "</script>\n";

}
        echo "<script type='text/javascript'>\n";
        echo "  $('.editableText').editableText();\n";
        echo "</script>\n";

   return;
}

echo get_nodes();

?>

Вот HTML. 

<body>

<div style="top:450px; width:120px; height:120px; left:800px; background:red;"></div>

<!-- THE ALERT BOX COMES UP IF I DRAG THIS DIV -->
<div id="editdiv" class="comdiv ui-widget-content" style="position: absolute; top: 150px; left: 850px; width:350px; height:250px; border:1px solid grey;">
    <p id="heading" class="comhdr editableText ui-widget-header">Editable</p>
</div>

<script type="text/javascript">

 $(document).ready(function() {
               //define php info and make ajax call to recreate divs from XML data
               $.ajax({
                   url: "get_nodes.php",
                   type: "POST",
                   data: { },
                   cache: false,
                   success: function (response) {

                       if (response != '') 
                       {
                          $(document.body).append(response);

                       }
                   }
               });
 });

</script>

<script type="text/javascript"> 

  $(document).ready(function() {

    $(".comdiv").draggable(

    {

      drag: function(event, ui) {

        $(".comdiv").css("opacity", "0.6"); // Semi-transparent when dragging

      },

      stop: function(event, ui) {

       alert ('Finished dragging!');

        $(".comdiv").css("opacity", "1.0"); // Full opacity when stopped

      },

    });

  });

</script> 

</body>
</html>

1 Ответ

0 голосов
/ 27 августа 2011

Права доступа должны быть установлены для папки, содержащей XML вместе с самим xml. Сделал это для владельца, системы, пользователя iis и пользователя.

...