Hi
My page includes some lists.
It works very well on: Chrome, Firefox6, IE9.
On IE8 the lists remain empty, see attachment. Seems like the content does not make it into the DOM.
Log in using user z and password z - never mind mingling in the data, it is only a still incomplete development version.
The listview is built up with this code:
- function refreshBeobListe(Pfad) {
- $("#beobachtungen").empty();
- $db.view("evab/BeobListe",
- {success: function(data) {
- var i;
- var anzBeob = 0;
- var beob;
- var ListItemContainer = "";
- for(i in data.rows) { //Beobachtungen zählen. Wenn noch keine: darauf hinweisen
- key = data.rows[i].key;
- if (key[0] == User) { //nur eigene Beobachtungen zählen!
- anzBeob = anzBeob + 1;
- }
- }
- //Im Titel der Seite die Anzahl Beobachtungen anzeigen
- var Titel2 = " Beobachtungen";
- if (anzBeob==1){
- Titel2 = " Beobachtung";
- }
- $("#BeobListePageHeader .BeobListePageTitel").text(anzBeob + Titel2);
- if (anzBeob == 0) {
- $("#beobachtungen").append("<li>Sie haben noch keine Beobachtung erfasst</li>");
- } else {
- data.rows.reverse(); //zuletzt erfasste sind zuoberst
- for(i in data.rows) //Liste aufbauen
- {
- beob = data.rows[i].value;
- key = data.rows[i].key;
- if (key[0] == User) { //nur eigene Beobachtungen anzeigen!
- var Datum = beob.zDatum;
- var Zeit = beob.zZeit;
- var ArtGruppe = beob.aArtGruppe;
- ImageLink = Pfad + "Artgruppenbilder/" + ArtGruppe + ".png";
- var ArtName = beob.aArtName;
- var externalPage = "_show/BeobEdit/" + beob._id;
- var listItem = "<li class=\"beob ui-li-has-thumb\" id=\"" + beob._id + "\">" +
- "<a href=\"" + externalPage + "\" rel=\"external\">" +
- "<img class=\"ui-li-thumb\" src=\"" + ImageLink + "\" />" +
- "<h3 class=\"aArtName\">" + ArtName + "<\/h3>" +
- "<p class=\"zZeit\">" + Datum + " " + Zeit + "<\/p>" +
- "<\/a> <\/li>";
- ListItemContainer = ListItemContainer + listItem;
- }
- }
- }
- ListItemContainer = ListItemContainer + "<\/ul>";
- $("#beobachtungen").append(ListItemContainer);
- $("#beobachtungen").listview();
- $("#beobachtungen").listview("refresh");
- }
- });
- }
I have added this in the header to make it work in IE7 and IE8 but it does not help:
- <script type="text/javascript">
- //customize jQuery Mobile to let IE7+ in (Mobile IE)
- //run this script after jQuery loads, but before jQuery Mobile loads
- $(document).bind("mobileinit", function(){
- $.extend( $.mobile , {
- //extend gradeA qualifier to include IE7+
- gradeA: function(){
- //IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683
- var ie = (function() {
- var v = 3, div = document.createElement('div'), a = div.all || [];
- while (div.innerHTML = '<!--[if gt IE '+(++v)+']><br><![endif]-->', a[0]);
- return v > 4 ? v : !v;
- }());
-
- //must either support media queries or be IE7+
- return $.support.mediaquery || (ie && ie >= 7);
- }
- });
- });
- </script>
Thanks for help!
Alex