jQuery с возможностью добавления и сортировки с помощью PHP идентификаторов - PullRequest
Новая
       20

jQuery с возможностью добавления и сортировки с помощью PHP идентификаторов

0 голосов
/ 18 апреля 2011

Я пытаюсь внедрить пример jQuery UI для отбрасывания и сортировки в один из моих PHP-скриптов ...

Идея состоит в том, чтобы пользователь перетаскивал и сортировал все, чтобы экспортировать идентификаторы плейлистов в отсортированном порядке и обрабатывать их в PHP ... Я нашел этот пример , но я застрял в точке, где я должен передать playlist_id в jQuery. До сих пор я играл с некоторыми вещами, но каждый раз, когда мой recordsArray [] содержит «неопределенные» значения или я испортил полный вывод:)

Пожалуйста, помогите мне с этим простым:)

Моя часть jQuery выглядит так: 

<script> 
    $(function() {
        $( "#playlist li" ).draggable({
            appendTo: "body",
            helper: "clone"
        });
        $( "#export ol" ).droppable({
            activeClass: "ui-state-default",
            hoverClass: "ui-state-hover",
            accept: ":not(.ui-sortable-helper)",
            drop: function( event, ui ) {
                $( this ).find( ".placeholder" ).remove();
                // GET ID SOMEHOW HERE!
                $( "<li id='???'></li>" ).text( ui.draggable.text() ).appendTo( this );
            }
        }).sortable({
            items: "li:not(.placeholder)",
            sort: function() {
                $( this ).removeClass( "ui-state-default" );
            },
            update: function() {
                var order = $(this).sortable("serialize");
                $.post("<?php echo site_url('export/all/'); ?>", order);
            }
        });
    });
</script>

и PHP-часть: 

echo "<div id=\"playlists\">";
    echo "<h3>PLAYLISTS</h3>";
    echo "<div id=\"playlist\">";
        echo "<div>";
            echo "<ul>";
                foreach ($all_playlists as $playlist) {
                    echo "<li id=\"recordsArray_&lt;".$playlist['playlist_id']."&gt;\">";
                    echo "<font size=\"1\">".getFormattedDateAndTime($playlist['time'])."</font> ".br();
                    echo "<font size=\"2\"><b>".$playlist['playlist_name']."</b></font>";
                    echo "</li>";
                }
            echo "</ul>";
        echo "</div>";
    echo "</div>";
echo "</div>";

echo "<div id=\"export\">"; 
    echo "<h3>EXPORT</h3>";
    echo "<div class=\"ui-widget-content\">"; 
        echo "<ol>";
            echo "<li class=\"placeholder\">DRAG HERE...</li>"; 
        echo "</ol>";
    echo "</div>"; 
echo "</div>";

Заранее спасибо !!

Ответы [ 2 ]

2 голосов
/ 18 апреля 2011

Ваш объект пользовательского интерфейса в событии перетаскивания является фактическим удаляемым элементом, поэтому для получения идентификатора 

ui.draggable.attr('id')
0 голосов
/ 18 апреля 2011

Я думаю, вы должны сделать две вещи:

  • вместо $( "#playlist li" ).draggable({ должно быть $( "#playlist ul" ).draggable({
  • запустить код JavaScript через $ (document) .ready (function () {})
...