X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Привязка по ID
FordogeN
FordogeN
Topic Starter сообщение 26.11.2008, 23:25; Ответить: FordogeN
Сообщение #1


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

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


--------------------
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 27.11.2008, 1:24; Ответить: ZiTosS
Сообщение #2


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

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


Вот ответишь мне на вопросы и я покажу тебе как это делается ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 27.11.2008, 13:03; Ответить: FordogeN
Сообщение #3


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


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 27.11.2008, 17:49; Ответить: ZiTosS
Сообщение #4


Что ты понимаешь под словом сохранить?! Если ты хочешь, чтобы данное положение блоков сохранилось и после закрытия страницы, то тут невозможно обойтись без PHP. Тебе придётся запихнуть блоки в БД с контентом и сделать поле по каторому мы будем сортировать. Как только меняем блоки местами, с помощью AJAX посылаем запрос серверу, там стоит обработчик PHP который перезаписывает позиции блоков ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 27.11.2008, 18:28; Ответить: FordogeN
Сообщение #5


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

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


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

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

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


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 27.11.2008, 23:39; Ответить: ZiTosS
Сообщение #6


Сделал я тебе скрипт, правда он такой бадяжный из-за косяков данной либы 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 килобайт ) Кол-во скачиваний: 175
 
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 28.11.2008, 1:18; Ответить: FordogeN
Сообщение #7


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


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 28.11.2008, 12:25; Ответить: FordogeN
Сообщение #8


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


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 28.11.2008, 23:29; Ответить: ZiTosS
Сообщение #9


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

Кстати, я сделал немножко не правильно, я не разбирался в либе, просто у меня не работал стандартный обработчик который там был, использовал простое обращение к функции по onClick.
Сразу скажу, данный скрипт подходит не подходит для крупномасштабного использования, так как писал на скорую руку, хотя на его основе можно сделать управление блоками на основе шаблона, перемещение из одного столбца в другой и их сохранение, с помощью Ajax ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 29.11.2008, 0:45; Ответить: FordogeN
Сообщение #10


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

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


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Форма регистрации вордпресс. Привязка ссылок
0 plscomeback 5592 29.3.2016, 19:29
автор: -plscomeback-


 



RSS Текстовая версия Сейчас: 29.3.2024, 18:30
Дизайн