Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [AJAX][HTML][PHP]Funkcja .innerHTML ucina znacznik <option> w IE
Forum PHP.pl > Forum > Przedszkole
furious_knight
Witam, pracuję właśnie nad udoskonaleniem pewnej aplikacji i spotkałem się z pewnym problemem.... w pliku index.html z formularzem jest <select> który zawiera wygenerowane z bazy danych rekordy które za pomocą biblioteki SMARTY wyświetlam w tym pliku HTML.

Po wybraniu jakiejś opcji z tego pola dynamicznie za pomocą AJAXA i javascript jest pobierany id rekordu i wynik zapytania generowany w pliku dane.php w którym jest zapytanie o modele na podstawie ID pierwszego wybranego przez nas pola po czym za pomocą funkcji echo i pętli foreign jest wysyłany wynik składający się z kodu html i zmiennych php <option value="$zmienna z ID">&zmienna z NAZWĄ </option> i taki wynik jest wyświetlany w drugiej liście wyboru w formularzu.

Kod śmiga pięknie i gładko na FF i chrome ale gdy wklejam go do aplikacji opartej na IE (pewnie trochę starczej) to wyskakuje mi pusta lista.... na podstawie alertów udało mi się ustalić że zmienna w tekst tworzona w JS po dotarciu do index.html ma prawidłową postać czyli <option> dane </option> ale po użyciu funkcji dir.innerHTML jest obcinany pierwszy znacznik <option> i cały wynik szlak trafia....

Poniżej skrypty

INDEX.HTML

  1. <script type="text/javascript">
  2.  
  3. function pobierzDane()
  4. {
  5. if(XMLHttpRequestObject){
  6. var div = document.getElementById("warstwaDanych");
  7. var tekst = document.getElementById("tf1").value;
  8.  
  9. XMLHttpRequestObject.open("POST", "dane.php");
  10. XMLHttpRequestObject.setRequestHeader(
  11. 'Content-Type', 'application/x-www-form-urlencoded');
  12.  
  13. XMLHttpRequestObject.onreadystatechange = function()
  14. {
  15. if (XMLHttpRequestObject.readyState == 4){
  16. if(XMLHttpRequestObject.status == 200){
  17. var tekst = XMLHttpRequestObject.responseText;
  18. alert(tekst);
  19. tekst = unescape(tekst);
  20. alert(tekst);
  21. div.innerHTML = tekst;
  22. alert(div.innerHTML);
  23.  
  24. }
  25. }
  26. }
  27. tekst = escape(tekst);
  28. XMLHttpRequestObject.send("type=" + tekst);
  29. }
  30. }
  31.  
  32. var XMLHttpRequestObject = getXMLHttpRequestObject();
  33.  
  34.  
  35.  
  36. <div id='form'>
  37. <form action="index.php?action={$action}&page=new_sent" method="POST">
  38. <div id='page1'>
  39. <div class="column" style="width: 20%; border: 1px solid black;">
  40. <legend>Typ urządzenia:</legend>
  41. <select name="type" id="tf1" onchange="pobierzDane();">
  42. {foreach $types as $type}
  43. <option value="{$type.ID}">{$type.Type}</option>
  44. {/foreach}
  45. </select> <img src="img/faq.png" alt="faq" /></fieldset>
  46.  
  47. <legend>Model:</legend>
  48. <select id="warstwaDanych" >
  49. <option>Wybierz</option>
  50. </select>
  51.  
  52. </div>


DANE.PHP
  1. <?php
  2.  
  3. // połączenie z bazą danych
  4. global $user;
  5.  
  6. $wynik = mysql_query("SELECT CT_modele.id, CT_modele.nazwa FROM CT_modele WHERE kategoria_id='$loginy'")
  7. or die("Błąd w zapytaniu!");
  8. $string = "";
  9. while ($rek = mysql_fetch_array($wynik))
  10. {
  11. //echo ' <option value="'.$rek['id'].'"> '.$rek['nazwa'].'</option>';
  12. echo $rek['id'].':'.$rek['nazwa'].':';
  13. }
  14. ?>


Generalnie wyczytałem że jest problem z interpretacją .innerhtml przez przeglądarkę IE dla tego moje pytanie brzmi nie gdzie jest problem tylko jak go obejść.... liczę na pomoc doświadczonych forumowiczów dodatkowo dodam że PHP, HTML znam w miarę dobrze ale gorzej JS, kod podany w listingu to gotowe rozwiązanie jakie udało mi się znaleść w internecie dla tego jeżeli ktoś będzie miał jakieś uwagi albo pomysły związane z modyfikacją JS to łopatologicznie proszęsmile.gif

Wydaje mi się że najlepszym sposobem było by pobranie zawartości podzielonej jakimiś znakami np. ::NUMERID::NAZWA:: a potem za pomocą JS i wyrażeń regularnych wydobyć dane i powrzucać je w szablon zawarty w pętli. Gdybym miał to zrobić w php poradził bym sobie ale to musi być zrobione w JS i potrzebuję pomocy

Pozdrawiam

Dla dokładniejszego zrozumienia przedstawię jak wygląda kod po przejściu przez .innerHTML

POBRANE_DANE</option>
<option>POBRANE_DANE</option>
<option>POBRANE_DANE</option>
<option>POBRANE_DANE</option>
<option>POBRANE_DANE</option>
<option>POBRANE_DANE</option>
itd.......
SmokAnalog
Najprościej to by było użyć jQuery, które dobrze sobie radzi z tymi małymi dziwactwami IE.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.