Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   обновление списка select (https://javascript.ru/forum/misc/53808-obnovlenie-spiska-select.html)

kiberchainik 19.02.2015 12:25

обновление списка select
 
Здравствуйте уважаемые знатоки :) прошу помощи в следующем вопросе...
есть селект
<select name="filter" id="listFilter">
                    <option value="0" style="color: gray;">Seleziona...</option>
                    <?=тут вывод option?>
                </select>

и рядом с ним стоит такая вот кнопочка
<a href="?do=update" onclick="updateSelect();"><img src="/ad/img/refresh.png" title="Обновить список" class="icon" /></a>


мне нужно сделать чтоб по нажатию на эту кнопку селект обнавлялся без перезагрузки, я находил примеры в сети, НО, нулевой уровень знания явы не смог мне помочь разобраться пишу вам ...

вот что я начинаю писать в файле явы
function updateSelect() {
    Query.ajax ({
        url:post.php,
        success:function(response) {
            $("#listFilter").
        }
    });
}


как закончить не знаю.
заранее спасибо:)

laimas 19.02.2015 12:28

<a href="?do=update" onclick="updateSelect();return false"><img src="/ad/img/refresh.png" title="Обновить список" class="icon" /></a>


А вообще, щелкнуть можно по чему угодно, просто по этой же картиночке, и тега А, который собственно не ради "жамкунть по чем нить" придумали, совсем не нужно.

<img onclick="updateSelect()" src="/ad/img/refresh.png" title="Обновить список" class="icon" />

рони 19.02.2015 12:31

kiberchainik,
что возвращает сервер в response?

kiberchainik 19.02.2015 12:32

хорошо, спасибо, я исправлю, но самый главный вопрос у меня был как сделать чтоб по нажатию селект обновлялся без перезагрузки!

kiberchainik 19.02.2015 12:33

вот что ...
function selectFiltri() {
            $this->Connect();
            
            $select = mysql_query("select seo_name from filtri");
            $arraySel = mysql_fetch_array($select);
            $num = mysql_num_rows($select);
            
            if ($num == "0") {
                echo"Фильтров еще нет";
            } else {
                do {
                    echo "<option value='".$arraySel['seo_name']."'>".$arraySel['seo_name']."</option>";
                } while ($arraySel = mysql_fetch_array($select));
            }
        }


это обработчик

laimas 19.02.2015 12:35

Поместить ответ сервера в тело списка. А вот с чем вы работаете, это уже вам пояснять надо - если JSON, то строим по ним элементы списка не клиенте и помещаем в список, если готовый html, то замещаем им.

рони 19.02.2015 12:37

kiberchainik,
а json ? типа [{value : 0, text : "item1"},{value : 1, text : "item2"} ] тогда было бы значительно проще

kiberchainik 19.02.2015 12:47

Цитата:

Сообщение от laimas (Сообщение 357287)
Поместить ответ сервера в тело списка. А вот с чем вы работаете, это уже вам пояснять надо - если JSON, то строим по ним элементы списка не клиенте и помещаем в список, если готовый html, то замещаем им.

работаю с html, т.е. правильно будет если написать в клиенте ...
function updateSelect() {
    Query.ajax ({
        url:post.php,
        success:function(response) {
            $("#listFilter").$this('html')
        }
    });
}

рони 19.02.2015 12:48

kiberchainik,
$("#listFilter").append(response)

kiberchainik 19.02.2015 12:50

Цитата:

Сообщение от рони (Сообщение 357288)
kiberchainik,
а json ? типа [{value : 0, text : "item1"},{value : 1, text : "item2"} ] тогда было бы значительно проще

нет в моем случае передается готовый хтмл, потому что не молучается из класса передать массив чтоб сделать json если у Вас есть возможность, приведите полный пример как реализовать, потому что я в яве полный ноль

рони 19.02.2015 12:56

kiberchainik,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
     select{
       width: 200px;
     }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $(function() {
        var response = [{value : 0, text : "test1"},{value : 1, text : "test2"} ]
        function success(arr) {
            $.each(arr, function( i,el) {
                 $("<option/>", {
                       text: el.text,
                       value: el.value
                   }).appendTo("#listFilter")
            })
        }
        success(response)
           $("#listFilter").val(1); // test
    });
  </script>
</head>

<body>
   <select name="" id="listFilter">
       <option value="">item1</option>
       <option value="">item2</option>
       <option value="">item3</option>
   </select>
</body>

</html>

laimas 19.02.2015 12:57

Цитата:

Сообщение от kiberchainik (Сообщение 357284)
вот что ...
function selectFiltri() {
            $this->Connect();
            
            $select = mysql_query("select seo_name from filtri");
            $arraySel = mysql_fetch_array($select);
            $num = mysql_num_rows($select);
            
            if ($num == "0") {
                echo"Фильтров еще нет";
            } else {
                do {
                    echo "<option value='".$arraySel['seo_name']."'>".$arraySel['seo_name']."</option>";
                } while ($arraySel = mysql_fetch_array($select));
            }
        }


это обработчик

Это не обработчик, это нет слов...

Фильтр по английски - filter, а не filtri, ну отвыкайте вы от этого жаргона, полусмеси непонятно чего с чем.

Функция mysql_fetch_array() без указания вторым аргументом типа возвращаемых данных, возвращает два идентичных набора, один индексный, второй ассоциативный. А вам это нужно? Зачем напрягать SQL пустыми задачами? Изучать, или эту использовать как необходимо, или именно ту, что возвращает необходимое (есть кроме нее).

if ($num == "0")... вообще оригинально. И прежде чем проверять количество полученных рядов, нужно проверить удачно ли вообще завершился запрос, если ошибки SQL у вас не обрабатываются глобально.

do ... while вообще не к месту. И где вы это только выкапываете, уже на стольких форумах эту пакость вижу, но до сих пор не знаю где вы ее черпаете.

Коли html, значит изменить список выгоднее так:

$("#listFilter").html('<option value="" style="color:gray">Seleziona...</option>'+response)

PS. Изменил value="0", на value="", проверять не пустое ли проще будет, а такая проверка желательна.

рони 19.02.2015 13:03

Цитата:

Сообщение от laimas
hrml

:-? так веть и напишет

laimas 19.02.2015 13:06

Да не исключено :)

рони 19.02.2015 13:10

:write:
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
     select{
       width: 200px;
     }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $(function() {
        var response = '<option value="0">test1</option><option value="1">test2</option>';
        function success(arr) {
            $(arr).appendTo("#listFilter")
        }
        success(response)
           $("#listFilter").val(1); // test
    });
  </script>
</head>

<body>
   <select name="" id="listFilter">
       <option value="">item1</option>
       <option value="">item2</option>
       <option value="">item3</option>
   </select>
</body>

</html>

kiberchainik 19.02.2015 13:28

не получается :( :-/ :cray:

kiberchainik 19.02.2015 13:34

Цитата:

Сообщение от laimas (Сообщение 357293)
Это не обработчик, это нет слов...

Фильтр по английски - filter, а не filtri, ну отвыкайте вы от этого жаргона, полусмеси непонятно чего с чем.

Функция mysql_fetch_array() без указания вторым аргументом типа возвращаемых данных, возвращает два идентичных набора, один индексный, второй ассоциативный. А вам это нужно? Зачем напрягать SQL пустыми задачами? Изучать, или эту использовать как необходимо, или именно ту, что возвращает необходимое (есть кроме нее).

if ($num == "0")... вообще оригинально. И прежде чем проверять количество полученных рядов, нужно проверить удачно ли вообще завершился запрос, если ошибки SQL у вас не обрабатываются глобально.

do ... while вообще не к месту. И где вы это только выкапываете, уже на стольких форумах эту пакость вижу, но до сих пор не знаю где вы ее черпаете.

Коли html, значит изменить список выгоднее так:

$("#listFilter").html('<option value="" style="color:gray">Seleziona...</option>'+response)

PS. Изменил value="0", на value="", проверять не пустое ли проще будет, а такая проверка желательна.

:D какая разница вообще на ошибки))) и filtri это на итальянском а не на аншлийском ))) главное ведь код!

а насчет do ... while это все евгений попов виноват его школа ))))

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

рони 19.02.2015 13:35

kiberchainik,
success:function(response) {
            $(response).appendTo("#listFilter")
        }

если так не работает - покажите что в response на самом деле

kiberchainik 19.02.2015 13:57

Цитата:

Сообщение от рони (Сообщение 357309)
kiberchainik,
success:function(response) {
            $(response).appendTo("#listFilter")
        }

если так не работает - покажите что в response на самом деле

я так понимаю что он даже не обращается к ajax потому что перезагружает страницу и пишет только № ответ из одного данного

рони 19.02.2015 13:59

kiberchainik,
тогда убирайте вплытие по клику на ссылку

рони 19.02.2015 14:01

kiberchainik,
function updateSelect(event) { event.preventDefault()

kiberchainik 19.02.2015 14:07

я пойду с самого начала и по порядку...
1 есть хтмл
<select name="filter" id="listFilter">
                    <option value="0" style="color: gray;">Seleziona...</option>
                    <?=$query->selectFiltri()?>
                </select>
<a href="?do=updateselect" onclick="updateSelect();return false"><img src="/ad/img/refresh.png" title="Обновить список" class="icon" /></a>


по логике если я верно ее понимаю, после клика на ссылку рефреш мы отправляемся в этот скрипт
function updateSelect() {
    Query.ajax ({
        type:html,
        url:post.php,
        success:function(response) {
            alert(response);
        }
    });
}


а он от себя посылает нас в файл пост.пхп где есть вот это чудо
if ($_GET['do'] == "updateselect") {
        
        $query->selectFiltri();
    }


с этого файла, это самое чудо запускает функцию из класса обработчика в котором описано следующее заклинание
function selectFiltri() {
            $this->Connect();
            
            $select = mysql_query("select seo_name from filtri");
            $arraySel = mysql_fetch_array($select);
            $num = mysql_num_rows($select);
            
            if ($num == "0") {
                echo"Фильтров еще нет";
            } else {
                do {
                    echo "<option value='".$arraySel['seo_name']."'>".$arraySel['seo_name']."</option>";
                } while ($arraySel = mysql_fetch_array($select));
            }
        }


вот от всей этой волшебной сказки я ожидал результата а его нет!

laimas 19.02.2015 15:48

Перепишите этот, слов нет назвать классом, так:

$select = mysql_query("SELECT uid, seo_name FROM filter");
if($selec) {
    if(mysql_num_rows($select)) {
         while ($r = mysql_fetch_object($select)) $opt .= '<option value="'.$r->uid.'">'.$r->seo_name.'</option>';
         echo $opt; 
    } else //вывод сообщения об отсутствии записей в базе, и это должно как-то определяться в рамках единого диалога
} else //действие - ошибка запроса


Пояснение о uid. Ваш список в качестве и текста опций, и их значений использует одно и тоже - текст seo_name. Это не смертельно, но и не лучшее, что можно придумать. Я не знаю назначение вашего списка, но обычно такие вещи как-то связаны с другими таблицами, где этот список используется. И такая связь зачастую осуществляется посредством ID - уникальных идентификаторов. Уникальность достигается полем с автоинкрементом. Вот в моем запросе я как бы подразумеваю, что такой идентификатор есть и у вашего списка, именно его значение будет иметь опции в качестве значений, а не строки описания этого списка. Можете это удалить, но обдумайте прежде хорошо структуру своих данных.

Как вставить этот html я уже показывал, а если не получается, то проверяйте запросы, передается ли $_GET['do'] == "updateselect", GET ли метод у вашего запроса и т.п.

PS. Тут тема уже не поянть что к чему ) Как в массив строки из базы, а не в html? Вместо этого:
while ($r = mysql_fetch_object($select)) $opt .= '<option value="'.$r->uid.'">'.$r->seo_name.'</option>';
         echo $opt;

это:
while ($r = mysql_fetch_assoc($select)) $opt[] = $r;
         echo json_encode($opt);


Если скрипт пишется под РНР версию не ниже 5.4, то можно использовать опцию JSON_UNESCAPED_UNICODE в json_encode().

kiberchainik 19.02.2015 16:33

Цитата:

Сообщение от laimas (Сообщение 357329)
Перепишите этот, слов нет назвать классом, так:

$select = mysql_query("SELECT uid, seo_name FROM filter");
if($selec) {
    if(mysql_num_rows($select)) {
         while ($r = mysql_fetch_object($select)) $opt .= '<option value="'.$r->uid.'">'.$r->seo_name.'</option>';
         echo $opt; 
    } else //вывод сообщения об отсутствии записей в базе, и это должно как-то определяться в рамках единого диалога
} else //действие - ошибка запроса


Пояснение о uid. Ваш список в качестве и текста опций, и их значений использует одно и тоже - текст seo_name. Это не смертельно, но и не лучшее, что можно придумать. Я не знаю назначение вашего списка, но обычно такие вещи как-то связаны с другими таблицами, где этот список используется. И такая связь зачастую осуществляется посредством ID - уникальных идентификаторов. Уникальность достигается полем с автоинкрементом. Вот в моем запросе я как бы подразумеваю, что такой идентификатор есть и у вашего списка, именно его значение будет иметь опции в качестве значений, а не строки описания этого списка. Можете это удалить, но обдумайте прежде хорошо структуру своих данных.

Как вставить этот html я уже показывал, а если не получается, то проверяйте запросы, передается ли $_GET['do'] == "updateselect", GET ли метод у вашего запроса и т.п.

спасибо за помощь, нужно перехватить это и заменить этим ду и вайл))) самого достали )) и да в таблице id есть, в общем спасибо буду пробовать

kiberchainik 19.02.2015 23:46

все правки сделаны, работать работает а вот обновлять без перезагрузки хоть убей не хочет (((

function updateSelect(event) {
    event.preventDefault();//отмена действия клик    
    Query.ajax ({
        type:'html',        
        url:'post.php',
        success:function(response) {
            $("#listFilter").html(response);
        }
    });
}

laimas 20.02.2015 02:26

Работает что и как вы определили это, если перегружается, а не должно?

Вам показывали два способа предотвращения действия по умолчанию элемента и вы их кучей используете, а не работает? Самый правильный же, это выбросить тег А из кода, в данном случае он вообще не к месту.
Для чего он у вас? Для хранения "do=updateselect"? Ну вроде бы как список у вас один, параметр запроса ключ-значение вам никто не мешает прописать сразу в методе .ajax(). Может потому, что при теге А "красивую ручку" курсор имеет? Открываем CSS и прописываем классу icon стиль курсора pointer, и :hover тоже не проблема.

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

kiberchainik 20.02.2015 10:21

Цитата:

Сообщение от laimas (Сообщение 357409)
Работает что и как вы определили это, если перегружается, а не должно?

Вам показывали два способа предотвращения действия по умолчанию элемента и вы их кучей используете, а не работает? Самый правильный же, это выбросить тег А из кода, в данном случае он вообще не к месту.
Для чего он у вас? Для хранения "do=updateselect"? Ну вроде бы как список у вас один, параметр запроса ключ-значение вам никто не мешает прописать сразу в методе .ajax(). Может потому, что при теге А "красивую ручку" курсор имеет? Открываем CSS и прописываем классу icon стиль курсора pointer, и :hover тоже не проблема.

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

я с Вами согласен и это знаю, и метод отмены клика я так же делал, селект не обновлялся все равно, я не знаю как обратиться к обработчику без тега а, т.е. я думаю сделать так...
<img src="/ad/img/refresh.png"onclick="updateSelect();return false;" title="Обновить список" class="icon" />


function updateSelect() {   
    $.get ({
        type:'html',        
        url:'post.php?do=update',
        success:function(response) {
            $("#listFilter").html(response);
        }
    });
}

laimas 20.02.2015 10:56

Нет не знаете, вы копируете то, что вам пишут, но вряд ли анализируете это. Вот попробуйте перейти по этой ссылке:
Код:

<a href="http://javascript.ru/forum/" onclick="return false">GO</a>
Здесь return false не позволяет тегу А действие по умолчанию, а что у него является действием по умолчанию - переход по url. А какое у изображения действие по умолчанию? Да никакого, вы можете ногами его топтать, а не только щелкать, но перехода по url он не совершит, нет по умолчанию у него такой задачи, и return false для него не к чему.

Читайте здесь еще, пробуйте, будете задумываться над тем, что делаете, обязательно будет работать.

kiberchainik 24.02.2015 13:49

Цитата:

Сообщение от laimas (Сообщение 357425)
Нет не знаете, вы копируете то, что вам пишут, но вряд ли анализируете это. Вот попробуйте перейти по этой ссылке:
Код:

<a href="http://javascript.ru/forum/" onclick="return false">GO</a>

здравствуйте, помогите еще вот с таким вопросом http://javascript.ru/forum/misc/5388...ez-ajax-2.html
там уже несколько другая идея, с прошлым вопросом разобрался!

kiberchainik 24.02.2015 14:54

большое спасибо я разобрался можно закрыть тему ))):dance:


Часовой пояс GMT +3, время: 07:57.