2013-07-06 2 views
0

Вот страница (и демо) JQuery Chosen Plugin. Это очень удобно.JQuery Chosen Plugin Styling Lost After Ajax Call

http://harvesthq.github.io/chosen/


Так что мой вопрос заключается в том, что я использую форму ввода в 2 этапа с целью сбора информации о местоположении. Первое меню выбора для стран. Когда страна выбрана, второе поле ввода показывает только варианты для страны в поле 1. Neato!

вот живая демонстрация моей проблемы.

http://globatum.com/admin/

Вы заметите, что работы Ajax вызова, но как только второе поле возвращается, моделирование теряется! = (

Согласно плагином

меню выбора должно быть в пределах определенного HTML кадра

<select data-placeholder="Select City" class="chzn-select" style="width:350px;" tabindex="2" name="city"> 
<? while($row=mysql_fetch_array($result)) { ?> 
<option class="active-result option" 
style="padding: 5px 0px 5px 0px; font-family:arial; font-size:12px;" 

><?=$row['city']?></option> 
<? } ?> 
</select> 

Это технически должно работать, но не делает. Любые подсказки о том, как сохранить стиль после вызова?

здесь страница PHP возвращается

<!--//---------------------------------+ 
// Developed by Roshan Bhattarai | 
// http://roshanbh.com.np   | 
// Contact for custom scripts  | 
// or implementation help.   | 
// [email protected]  | 
//---------------------------------+--> 
<? 
#### Roshan's Ajax dropdown code with php 
#### Copyright reserved to Roshan Bhattarai - [email protected] 
#### if you have any problem contact me at http://roshanbh.com.np 
#### fell free to visit my blog http://php-ajax-guru.blogspot.com 
?> 

<? $country = $_GET['country']; 
$link = mysql_connect("SNIP"); 
if (!$link) { 
    die('Could not connect: ' . mysql_error()); 
} 
mysql_select_db('SNIP'); 
$query="SELECT city FROM location WHERE country='$country' ORDER BY `city` ASC"; 
$result=mysql_query($query); 

?> 
<div class="x"> 
<br> 
<select data-placeholder="Select City" class="chzn-select" style="width:350px;" tabindex="2" name="city"> 
<? while($row=mysql_fetch_array($result)) { ?> 
<option class="active-result option"><?=$row['city']?></option> 
<? } ?> 
</select> 
</div> 
+0

Примечание. Элементы HTML заменяются так, что вы css стили перестаете работать – raam86

+0

@ raam86 есть способ обновить css для работы над магией над новым HTML? –

+0

CSS всегда работает, это волшебство. У вас новые элементы не имеют одинаковых классов и т. Д., Поэтому CSS не работает на них – raam86

ответ

0

Вы пытались запустить событие liszt:updated, когда перезагрузите второй список? Из DOCO

Обновления Избранных Динамического Если вам необходимо обновить параметры в вашем поле выбора и хотите Избранный, чтобы забрать изменения, вам необходимо вызвать «Лист: обновленное» событие на поле. Выбранный будет перестраиваться на основе обновленного контента.

Edit: в ответ на замечание о том, где поставить его, я думаю, что вам нужно изменить функцию getcity в заголовке документа, чтобы быть что-то вроде:

function getCity(country) { 
    var strURL="findCity.php?country="+ country; 
    var req = getXMLHTTP(); 
    if (req) { 
     req.onreadystatechange = function() { 
      if (req.readyState == 4) { 
       // only if "OK" 
       if (req.status == 200) {       
        document.getElementById('citydiv').innerHTML=req.responseText;      
        $("#citydiv select").trigger("liszt:updated"); 
        ///rest of function 

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

+0

Я понятия не имею, как правильно это реализовать. Я видел это в документе и общался с ним, но ничего не придумал. Я добавил, что страница php возвращается. Добавить его там или на индексной странице? –

+0

Пробовал это и нет bueno = ( –

+0

У меня нет идей –

Смежные вопросы