15.04.2012, 15:01
|
Интересующийся
|
|
Регистрация: 15.04.2012
Сообщений: 12
|
|
Заменить select данными из mysql при помощи javascript.
Доброго времени суток!
В базе данных есть некая таблица. Так же есть две страницы (код - ниже). Чтобы не "метаться" между мелкими файлами - объединил html+js+css в index.php.
Что есть сейчас:
1 - Кнопка "Text" добавляет в .Container текст, который в данный момент выбран в select'е.
2 - Кнопка "Test" добавляет три предопределённых значения (в теге sсript)в select, затем обращается при помощи XHR в js к файлу test.php. Test.php обращается к базе за списком значений первого столбца (рандомны, уникальны), отдаёт результат обратно и добавляет ответ в .Container без перезагрузки страницы (при помощи innerHTML).
3 - Кнопка "^W" очищает .Container.
Что нужно:
При нажатии кнопки "Test" скрипт должен добавлять в список select значения, полученные из базы.
Т.е., если select был вначале таким:["text1", "text2", "text3"], то после нажатия должен стать таким:["a","b","c","d","e"].
Как?
Спасибо.
---------------------------------------------------------------------------
Таблица в mysql выглядит так (ключ - первый столбец):
+-------+
| a | 1 |
| b | 2 |
| c | 3 |
| d | 4 |
| e | 5 |
+-------+
index.php:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<sсriрt>
function Test() {
Container = document.getElementById('Container');
Selector = document.getElementById('Selector');
Selector.options[0] = new Option('text0','value0');
Selector.options[1] = new Option('text1','value1',false,true);
Selector.options[2] = new Option('text2','value2');
req = new XMLHttpRequest();
req.open('POST','/test/test.php',true);
req.onreadystatechange = processRequestChange;
req.send(null);
function processRequestChange() {
if (req.readyState == 4) {
if (req.status == 200) {
Container.innerHTML = req.responseText;
}
} else {
Container.innerHTML = 'Error!<br/>'+'req.readyState: '+req.readyState+'<br/>'+'req.statusText: '+req.statusText+'<br/>'+'req.status: '+req.status;
}
}
Container.innerHTML = req.responseText;
}
function Text() {
Container.innerHTML = Selector.options[Selector.selectedIndex].text;
}
function Clear() {
Container.innerHTML = '';
}
</sсriрt>
<style>
html{
background:#e7f6fd;
padding:0;
margin:0;
}
</style>
</head>
<body>
<select id="Selector">
<option>WUT?!</option>
</select>
<span><br/>What do you want to see?</span>
<input type="button" value="Text" onclick="Text()"/>
<input type="button" value="Test" onclick="Test()"/>
<input type="button" value="^W" onclick="Clear()"/>
<div id="Container"></div>
</body>
</html>
test.php:
<?php
header("Content-type: text/html; charset=utf-8");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
$db_username = 'username';
$db_password = 'password';
$db_host = 'host';
$db_database_name = 'database';
$connection = mysql_connect($db_host, $db_username, $db_password);
$db_select = mysql_select_db($db_database_name);
$query = "SELECT * FROM projects";
$result = mysql_query($query);
echo $result;
?>
Последний раз редактировалось TrogWar, 15.04.2012 в 15:09.
Причина: Корректировка форматирования и очепяток
|
|
16.04.2012, 13:27
|
Аспирант
|
|
Регистрация: 08.02.2012
Сообщений: 34
|
|
ну во первых, у тебя test.php смешной. запусти его отдельно в окне - наверняка поймешь что к чему!
$result - массив объектов. так его не вывести.
если чё, погугли как выводить инфу с базы средствами php. тема избита...
во вторых: может имеет смысл забирать данные посредством JSON,
мне однажды эту тему популярно разжевали:
Сколько объектов/массивов содержит JSON
и соответственно вставлять данные в selectы с возвращенного JSON (ассоциативный массив)
то бишь в test.php:
$rows = array();
while($r = mysql_fetch_assoc($result)) {
$rows[] = $r;
}
print json_encode($rows);
ну а в Javascript работаешь как с любым другим массивом.
НО: если будешь так делать, сначала просто выведи полученный JSON, дабы изучить его строение, шоб правильно обращаться к паре ключ:значение, а то я тогда лоханулся... часа 2 искал баг, которого не было
и еще: не забудь кодировать в utf8 и не выводи массив с тысячами записей, а то нарвешься вот на это -
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 22806573 bytes).
ну или не кодируй, и выводи сколько хош... пока не нарвешься..)))
Последний раз редактировалось Le-mark43, 16.04.2012 в 13:51.
Причина: правка
|
|
16.04.2012, 13:36
|
|
Аспирант
|
|
Регистрация: 05.10.2011
Сообщений: 85
|
|
Запросы с json ответами можно смотреть в firebug-е, и прочих инспекторах (хром, опера).
|
|
16.04.2012, 21:33
|
Интересующийся
|
|
Регистрация: 15.04.2012
Сообщений: 12
|
|
Конечно же смешной - я и не собираюсь открывать test.php, иначе бы дописал остальную html-заглушку и переделал массив в строку текста через mysql_fetch_array() и цикл. Но мне-то нужно передать обратно массив, а не строку.
За инфу про JSON спасибо про такой метод я как раз не задумался.
У меня кириллицы практически никакой нет и не будет - все в utf-8, так что минус проблема.
Про выделение памяти это очень важное дополнение! Как тогда быть, если в перспективе из мускула будут таким образом вытаскиваться по 7-10 столбцов по 3000-4000 значений в каждом? Должна быть возможность выведения всех этих строк сразу на страницу.
Что-нибудь можете посоветовать чтобы избежать той ошибки с памятью?
|
|
16.04.2012, 23:15
|
Аспирант
|
|
Регистрация: 08.02.2012
Сообщений: 34
|
|
насчет этого не парься пока, практика показывает, что такое появляется, в основном при выводе в кодировке в utf8, ты как нить посмотри, Json строк на 10 при хотя бы 5 столбцах (записи в базе в кириллице), ужаснёшься.
да поправят меня профессора, но utf8 кодирует кириллические символы длинной аж до 6 байт, для сравнения омериканские символы и символы unicode как и asci - до 2 байт.
поэтому если выводишь в кодировке 1251, можно особо не париться, 3000 строк на 15 столбцов, нихрена не пустых - выводятся за милую душу...
но на всякий пожарный, дабы не переборщить делают через try{}catch{}, как не знаю, скоро предстоит и мне с этим разбираться.
|
|
16.04.2012, 23:23
|
Аспирант
|
|
Регистрация: 08.02.2012
Сообщений: 34
|
|
Да, кстати, кто-то говорил, что объем памяти можно выставить в профайле Apache, (denwer)... погугли! вдруг тебе больше повезёт.
|
|
19.04.2012, 06:17
|
Интересующийся
|
|
Регистрация: 15.04.2012
Сообщений: 12
|
|
Le-mark43, спасибо за информацию! Объём можно, а я и позабыл об этом..
Таблица из 4х столбцов: один char и три float'а. char будет только где-то в ~10% случаев (не более) написан кириллицей. Апач, мускул, пхп, все страницы принудительно настроены на работу в utf-8 (general).
Насколько я читал, между cp1251 и utf-8 только в кириллице - на каждую букву юник выделяет два байта вместо одного как в 1251, а вот для латиницы всё одинаково.
То бишь, если передаётся много кириллицы в utf-8, то, фактически, увеличивается весь трафик в два раза, что не есть гуд.
Плюс надо учитывать момент, что при урезании кириллической (и только!) строки (например, "text.length-1") будет отрезан только один из двух бит буквы. Последствия очевидны (:
Но это всё лирика.. Вот чего я боюсь - переполнения памяти, слишком сильного пожирания трафика или урезания данных при передаче на узком месте между test.php и index.php по XHR'у.
Есть ли разница - передавать с помощью JSON или тупо строкой (echo в test.php и req.responseText в test.js)? Пока что ничего конкретного, чтобы всё в одном месте собрано было, не нашёл =/
|
|
20.04.2012, 20:11
|
Аспирант
|
|
Регистрация: 08.02.2012
Сообщений: 34
|
|
как передавать лично я разницы не видел, главное, чтоб на выходе из php у тебя был массив, дабы потом в js его можно было свободно обработать.
просто массив формировать гораздо удобнее JSONом, он для этого походу и создан был
по поводу утф8 и кириллицы, я, чем больше нарывался на ошибку с памятью, тем больше понимал, что память тут вообще не причем.
Allowed memory size of 134217728 bytes exhausted (tried to allocate 22806573 bytes).
если перевести, то это означает:
допустимый размер памяти 134217728 байт исчерпан (попытка выделить 22806573 байта),
первая цифра всегда больше второй, зависит она от настрйки профиля в апаче, максимум 128 метров, как и говорится в сообщении об ошибке.
вопрос: если максимально можно использовать 128 метров, то какого хрена не можешь выделить 21,7 метра?
хотя возможно цифра в скобках означает на сколько превышен лимит...
Причем, я заметил, что так бывает не всегда, иногда при выводе этого же объема информации (не такого же, а именно этого же), такой штуки не вылезает, а почему?
вообщем, что бы там не говорили, не верю я в нехватку памяти для обработки скрипта, ну а поскольку предложений по решению у меня нет, то и говорю, аккуратнее с количеством записей в утф8.))
Последний раз редактировалось Le-mark43, 20.04.2012 в 20:15.
|
|
20.04.2012, 20:18
|
Аспирант
|
|
Регистрация: 08.02.2012
Сообщений: 34
|
|
и кстати, вместо char делай лучше varchar, база меньше занимать будет
|
|
21.04.2012, 21:14
|
Интересующийся
|
|
Регистрация: 15.04.2012
Сообщений: 12
|
|
Спасибо за развёрнутый ответ и предостережение Когда решу проблемы типа asap, займусь этой.
Пользуюсь "char" потому, что это БД для тестов, а не рабочая. Тестовые таблицы бессмысленно делать большими (если конечно, это не тесты на скорость БД) => место совершенно некритично, а поиск и фрагментация уменьшаются.
|
|
|
|