Работа с Drag and Drop на jQuery

atach · 15.11.2009

Может кто нибудь подскажет, почему то при попытки присвоить изменению в массив через:

Код:

data: $('#sort').sortable('toArray')

выдает одни undefined=undefined

Код:

<script type="text/javascript">
$(function() {
	$("#sort").sortable({
			placeholder: 'ui-state-highlight',
			opacity: 1,
			axis: 'x, y',
			update: function(event, ui) { 
					$.ajax({
				       type: "GET",
				       url: "1.php",
				       data: $('#sort').sortable('toArray'),				       
				       success: function(msg){
					       alert( "Data Saved: " + msg );
					       }
						})				
				}
		});
			
	});
</script>

С синтаксисом JS плохо знаком ...

Creator · 15.11.2009

Какая версия jquery и плагина Sortable?

Возможно, ошибка в серверной части. Что возвращает 1.php?

atach · 15.11.2009

Creator сказал(а):
Какая версия jquery и плагина Sortable?

Возможно, ошибка в серверной части. Что возвращает 1.php?

jQuery - v1.3.2
Sortable - last version %)

1.php пока просто показывает передающию переменную (массив) для проверки ...
Дело в том что массив не формируется, точнее без ID формируется

Creator · 15.11.2009

Приведите html-код, который включает элемент с идентификатором #sort и результат, полученный из 1.php. Посмотрим, что получится.

atach · 15.11.2009

Creator сказал(а):
Приведите html-код, который включает элемент с идентификатором #sort и результат, полученный из 1.php. Посмотрим, что получится.

Вот сам html

Код:

<html>
<head>
	<title>jQuery UI Sortable - Drop placeholder</title>
	<link type="text/css" href="_adm/_inc/css/ui.all.css" rel="stylesheet" />
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/ui.core.js"></script>
	<script type="text/javascript" src="js/ui.sortable.js"></script>
	<style type="text/css">
	#sort { list-style-type: none; margin: 0; padding: 0; width: 60%; }
	#sort li  { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; }

	</style>
    
<script type="text/javascript">
$(function() {
	$("#sort").sortable({
			placeholder: 'ui-state-highlight',
			opacity: 1,
			axis: 'x, y',
			update: function(event, ui) { 
					$.ajax({
					   type: "GET",
					   url: "1.php",
					   data: $('#sort').sortable('toArray'),					   
					   success: function(msg){
						   alert( "Data Saved: " + msg );
						   }
						})				
				}
		});
			
	});
</script>

</head>
<body>
<ul id="sort">
	<li class="ui-state-default">Item 1</li>
	<li class="ui-state-default">Item 2</li>
	<li class="ui-state-default">Item 3</li>
    <li class="ui-state-default">Item 4</li>
	<li class="ui-state-default">Item 5</li>
	<li class="ui-state-default">Item 6</li>
</ul>
</body>
</html>

Да обработчика нету, я просто вывожу для пероверки что передается:

Код:

<?php
echo $_SERVER['QUERY_STRING'];
?>

А передаются одни undefined. Да тут можно и без отправки данных, просто не формируется массив после изменения

Creator · 15.11.2009

Помудрив, в итоге получилось:

Код:

...
<script type="text/javascript">
$(function() {
        $("#sort").sortable({
                        placeholder: 'ui-state-highlight',
                        opacity: 1,
                        axis: 'y',
                        update: function(event, ui) { 
                                        $.ajax({
                                           type: "GET",
                                           url: "1.php",
                                           data: $('#sort').sortable('toArray').join('&'),                                           
                                           success: function(msg){
                                                   alert( "Data Saved: " + msg );
                                                   }
                                                })                              
                                }
                });
                        
        });
</script>

</head>
<body>
<ul id="sort">
        <li class="ui-state-default" id="item_1">Item 1</li>
        <li class="ui-state-default" id="item_2">Item 2</li>
        <li class="ui-state-default" id="item_3">Item 3</li>
	<li class="ui-state-default" id="item_4">Item 4</li>
        <li class="ui-state-default" id="item_5">Item 5</li>
        <li class="ui-state-default" id="item_6">Item 6</li>
</ul>
</body>
</html>

Возвращает:

Data Saved: item_1&item_3&item_4&item_5&item_2&item_6

Ошибка была в отсутствии ID для элементов списка и неверной передаче параметров (data: $('#sort').sortable('toArray').join('&'))

P.S. Будут вопросы обязательно задавайте, всегда постараемся помочь)

atach · 15.11.2009

ХА !!! Спасибо большое ... Из-за такой ерунды пол дня потерял ...
Невнимательность !!! Спасибо!

Работа с Drag and Drop на jQuery

atach

Новичок

Creator

Administrator

atach

Новичок

Creator

Administrator

atach

Новичок

Creator

Administrator

atach

Новичок

Онлайн статистика

Статистика форума

Новые пользователи

Поделиться этой страницей