Перейти к содержимому

Сервис обмена электронных валют

Выбрать шаблон и создать сайт

Привязка по ID

#1 FordogeN

FordogeN
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0
0

Отправлено 26 Ноябрь 2008 - 22:25

Не знаю на чем это пишется, по этому пишу сюда...
Вобщем задача такова: есть к примеру таблица из 6ти ячеек.
И к примеру у каждой из этих ячеек стоит свой ID и содержимое к этой ячейке привязывается через DIV у которого тоже есть ID. Т.е. если ID ячеек совпадают - Тогда <div> c ID=4 встанет в ячейку с ID=4... Ну в этом роде...

Кароч как привязать DIV к ячейке в таблице... по ID или чему то еще???

 

 

  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



#2 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 27 Ноябрь 2008 - 00:24

Делается данная возможность с помощью JavaScript. Но тут важно какое-то действие, будь это загрузка страница, либо наведение на ячейку, либо нажатие на кнопку. Какое действие происходит в твоём случае?
Сначала хочу спросить по какому действию всё это будет происходить? Ведь до перенесения div'ов в ячейки, они должны где-то находиться на странице.

Ничего сложного в написании скрипта нет, тут надо либо использовать appendChild(), либо свойства объектов innerHTML, лучше воспользоваться первым вариантом, он кроссбраузерный 100% _http://www.dhtml.ru/ref/dom/methods/
Примерно...

Ставим обработчик на ячейку таблицы, в обработчике вызываем функцию с параметрами id div'a.


Вот ответишь мне на вопросы и я покажу тебе как это делается ;)
  • 0

#3 FordogeN

FordogeN
    Topic Starter
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0

Отправлено 27 Ноябрь 2008 - 12:03

с этим вопросом замяли, я придумал как эту весч по другому сделать...
К примеру возьмем этот скрипт - http://www.midorijs....riDragDrop.html
Когда перетягиваем элемент - у него меняется позиция. Нужно чтоб это можно было как то сохранить... Т.е. на пример был у нас APPLE первым, мы сделали его вторым и его ID сменился с 1, на 2.
  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



#4 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 27 Ноябрь 2008 - 16:49

Что ты понимаешь под словом сохранить?! Если ты хочешь, чтобы данное положение блоков сохранилось и после закрытия страницы, то тут невозможно обойтись без PHP. Тебе придётся запихнуть блоки в БД с контентом и сделать поле по каторому мы будем сортировать. Как только меняем блоки местами, с помощью AJAX посылаем запрос серверу, там стоит обработчик PHP который перезаписывает позиции блоков ;)
  • 0

#5 FordogeN

FordogeN
    Topic Starter
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0

Отправлено 27 Ноябрь 2008 - 17:28

я подразумеваю - нажать кнопочку "сохранить" и чтоб оно сохранилось в файле или БД. Т.е меняем блоки местами и сохнаняем... т.е. к примеру получается такое:

таблица из 3х ячеек... 1 и 2 с содержанием, а 3 пустая. Мы переместили из ячейки 1 в ячейку 3, сохраняем и у нас в БД происходит следущее:


Эт типо таблица:
Блок | Ячейка

Было:
b1 | t1
b2 | t2
b3 |

Стало:
b1 |
b2 | t2
b3 | t1
  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



#6 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 27 Ноябрь 2008 - 22:39

Сделал я тебе скрипт, правда он такой бадяжный из-за косяков данной либы midori. Там создаётся дополнительный объект, приходится его уничтожать. А теперь сам скрипт...
1) Главный файл index.php
<?php include "mysql.php"; //Подключаем файл с соединением к БД?>

<html>
<head>
<title>Меняющиеся блоки</title>
<!-- Подключаем библиотеку и добавляем нужные функции JS -->
<script type="text/javascript" src="./midori.js"></script>
<script type="text/javascript">

/* Обработчик Drag&Drop функция библиотеки */
midori.addEventListener(window, 'ready', function (e) {
   new midoriDragDrop('my-list');
} );

/* собираем id блоков */
function parseBlocks(id)
{
	var parse;
	var parent = document.getElementById(id);
	for (i = 0; i < parent.childNodes.length; i++)
	{
		parse += parent.childNodes.item(i).id;
		if(i != parent.childNodes.length-1)
			parse += ",";
   }
	return(parse);

}

/* Отправляем запрос на сервер с помощью Ajax, передавая id блоков в строке через "," */
function saveBlocks(parent)
{
	var param = parseBlocks(parent); /* Строка id блоков через "," */
	var blockCheck = new midoriAjax(function () {
   	if (blockCheck.responseText) /* Если запрос удался */
		alert(blockCheck.responseText); /* Возвращаем результат запроса */
	}, '', true );

   blockCheck.post('./event.php', 'do=check&param=' + param); /* Посылка запроса */

	
}

</script>
<link rel="stylesheet" href="./site.css" type="text/css">
</head>
<body>
<div id="my-list">
<?php
	$query = mysql_query("SELECT * FROM `blocks` ORDER BY `sort`"); /* Запрос к таблице блоков */
	while($array = mysql_fetch_array($query)) /* построчный разбор таблицы с формирование HTML */
	{
		echo "<div id='block{$array['id']}' class='draggable item'>{$array['text']}</div>";
	}
?>
</div>
<!-- Кнопка, Нажатие - Сохранение -->
<form>
	<input type="button" onClick="saveBlocks('my-list');" value="Сохранить">
</form>
</body>
</html>

2) Файл для работы с Ajax запросом event.php

<?php
include "mysql.php"; //Подключаем файл с соединением к БД

if(isset($_POST['param'])) //Если param существует(в данном случае это строка с id через ",")
{
	$array = explode(",", $_POST['param']); //Режем строку по "," и помещаем данные в массив
	foreach($array as $key => $value) // Цикл обхода id элементов
	{
		if(eregi("midori", $array[$key])) // Если в id элемента содержится подстрока "midori"
		{
			unset($array[$key]); // Удаляем элемент
		} else {
		$array[$key] = preg_replace("#\w+(\d+)#iU", "$1", $value); // Заменяем строку числом в ID
		if(intval($array[$key]) == 0) // Если приведённое к целому = 0
			unset($array[$key]); // Удаляем элемент
		}
	}

	$i = 0; // Счётчик(нужен для обновления сортировки)
	foreach($array as $key => $value)
	{
		$i++;

				/*Обновляем ячеку sort строки где id = id блока со страницы*/
		mysql_query("UPDATE `blocks` SET `sort`={$i} WHERE `id`={$value}");
	}

	echo "Save"; // Печатаем "Сохранено"
} else {
	echo "Not save"; // Печатаем "Не сохранено"
}

?>

3) файл подключения к БД mysql.php
<?php

/* настройки подключения к БД */
$DB_host = "localhost"; // имя сервера MySQL
$DB_user = "root"; // имя пользователя MySQL
$DB_pass = ""; // пароль на сервере MySQL
$DB_name = "fordogen"; // имя базы данных

$link = mysql_connect($DB_host, $DB_user, $DB_pass) or die("Ошибка в подключении к серверу");
mysql_select_db($DB_name, $link) or die("Ошибка в подключении к БД");

?>

4) файл midori.js
Взять код тут http://www.midorijs.com/midori.js

5) файл site.css(стили)
.draggable{ cursor: move; }

.item
{
	  width: 200px; padding: 4px; border: 1px solid #DDD;
	  background-color: #EEE;
}

.midori-dd-spacer 
{
	  width: 200px; padding: 0px 4px 0px 4px;
	  border: 1px dotted #BBB;
}

6) файл c таблицей БД
-- 
-- Структура таблицы `blocks`
-- 

CREATE TABLE `blocks` (
  `id` int(11) NOT NULL auto_increment,
  `text` text NOT NULL,
  `sort` int(11) NOT NULL default '0',
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=cp1251;

-- 
-- Дамп данных таблицы `blocks`
-- 

INSERT INTO `blocks` VALUES (1, 'Блок 1', 2);
INSERT INTO `blocks` VALUES (2, 'Блок 2', 3);
INSERT INTO `blocks` VALUES (4, 'Блок 4', 1);

Все файлы лежат в одном каталоге, можно сделать и в разных, надо менять пути в файлах ;)
Скрипт рабочий, проверял на FF
zip-архив прилагаю

Прикрепленные файлы

  • Прикрепленный файл  blocksDrag.zip   13,58К   Количество загрузок: 146

  • 0

#7 FordogeN

FordogeN
    Topic Starter
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0

Отправлено 28 Ноябрь 2008 - 00:18

ух ты... спасибо огромное...
утром затестим))
  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



#8 FordogeN

FordogeN
    Topic Starter
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0

Отправлено 28 Ноябрь 2008 - 11:25

офигеть... работает просто супет!
зы. Ща пробую на еще один JS прикрутить твою схему.
http://olegpage.ru/c...cksDrag/nav.php - вот сам скрипт.
Я сам по пытаюсь сделать, на основе твоего...
  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



#9 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 28 Ноябрь 2008 - 22:29

Как я понял это твой домен... По ссылке выдало страницу, есть информация, что данный ресурс атакует ;)
Я думал ты хочешь прикрутить данную фичу для управления блоками CMS, даже собственной.
Сказать честно я бы за основу библиотеки взял бы одну из этих двух jQuery, mootools

Кстати, я сделал немножко не правильно, я не разбирался в либе, просто у меня не работал стандартный обработчик который там был, использовал простое обращение к функции по onClick.
Сразу скажу, данный скрипт подходит не подходит для крупномасштабного использования, так как писал на скорую руку, хотя на его основе можно сделать управление блоками на основе шаблона, перемещение из одного столбца в другой и их сохранение, с помощью Ajax ;)
  • 0

#10 FordogeN

FordogeN
    Topic Starter
  • Пользователь
  • 1 414 сообщений
  • Репутация: 0

Отправлено 28 Ноябрь 2008 - 23:45

ты все правильно понял - для своей CMS:)
зы. Я знаю что атакует, но не знаю в чем проблема - остальные сайты на этом серваке норм работают...
я пока только учусь и от ошибок не застрахован, но кто не рискует - тот не пьет;)

И еще вопрос по поводу кодировки в MySQL - у ми там выдает вопросительные знаки, в место русского текста. Что делать?
зы. К админке хотелось бы приспособить эти 2 скрипта http://www.artlebede...grette/etc/adm/
  • 0

Как настроить выдержку и диафрагму зеркального фотоаппарата



robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru