jQuery, jSon and IE8, don't work 100% correctly

I use a backend PHP file to gather my data from the database and use jquery to display the information.

All goes well in Firefox and IE9, but in IE8, the first result is not displayed 100%, just the half of the information is being display without any markup.

I checked all the quotes, comma's and other characters on which IE trips, but nothing so far. The question is, why doesn't below code doesn't work a 100% on IE8?

JS code:

function addInfo(data) { var x = 0; var content = ''; var land; $.each(data.gebieden, function(i,info){ y = info.id; land = landen_array[info.lid]; content += '<li>'; content += '<a class="price" href="' +info.url+'" target="_blank">'; content += '&euro; '+info.prijs+''; content += '</a>'; content += '<img src="/images/accommodatie/small/'+ info.image +'.jpg" alt="'+info.naam+'" class="result_image"/>'; content += '<h3>'+info.naam+'</h3>'; content += '<h4 class="au"><img src="/images/'+land+'.png" class="flag_small"> | '+info.gebied+' | '+info.dorp+'</h4>'; content += '<dl>'; content += '<dt>Gebied</dt>'; content += '<dd>'; content += '<ul>'; content += '<li>'+info.min_hoogte+' - '+info.max_hoogte+'m</li>'; content += '<li>'+info.pistes+' km pistes</li>'; content += '<li>Gaaf gebied</li>'; content += '</ul>'; content += '</dd>'; content += '<dd>'; content += '<details>'; content += '<summary>'; content += '<a class="leesmeer" id="detail_layer1_'+ y +'">Lees Meer</a>'; content += '</summary>'; content += '<div class="gebiedinformatie" id="layer1_'+ y +'">'; content += '</div>'; content += '</dd>'; content += '</dl>'; content += '<dl>'; content += '<dt>Dorp informatie</dt>'; content += '<dd>'; content += '<ul>'; content += '<li>'+info.afstand_utrecht+' km tot Utrecht</li>'; content += '<li>Retourneren</li>'; content += '<li>Klachten</li>'; content += '<li>Contact</li>'; content += '</ul>'; content += '</dd>'; content += '<dd>'; content += '<details>'; content += '<summary>'; content += '<a class="leesmeer" id="detail_layer2_'+ y +'">Lees Meer</a>'; content += '</summary>'; content += '<div class="dorpinformatie" id="layer2_'+ y +'">'; content += '</div>'; content += '</dd>'; content += '</dl>'; content += '<dl>'; content += '<dt>Accomodatie</dt>'; content += '<dd>'; content += '<ul>'; content += '<li>Dorp id '+ y +'</li>'; content += '<li>Privacystatement</li>'; content += '<li>Algemene voorwaarden</li>'; content += '</ul>'; content += '</dd>'; content += '<dd>'; content += '<details>'; content += '<summary>'; content += '<a class="leesmeer" id="detail_layer3_'+ y +'">Lees Meer</a>'; content += '</summary>'; content += '<div class="accomodatieinformatie" id="layer3_'+ y +'">'; content += '</div>'; content += '</dd>'; content += '</dl>'; content += '</li>'; x = x+1; }) $("#results").empty(); // update pagination information // var pagina_info = data.pagina; if (pagina_info.aantal_resultaten > 0) { var tot_aantal = pagina_info.max_per_page * pagina_info.current_pag; var vanaf_aantal = ((pagina_info.current_pag-1) * pagina_info.max_per_page) + 1; var pag = '<div id="Pagination" class="pagination">'; for(i=1;i<=pagina_info.totaal_aantal_pag;i++) { if (i != pagina_info.current_pag) { pag += '<a href="#" id="pag_'+i+'" class="page_no">'+i+'</a>'; } else { pag += '<span class="current">'+ i +'</span>'; } } pag += '</div><br>'; } else { var tot_aantal = 0; var vanaf_aantal = 0; } info = "Resultaat "+ vanaf_aantal+ " tot "+ tot_aantal +" van "+pagina_info.aantal_resultaten+" resultaten."; $("#results").append(info).append(pag); $("#resultaten").append(content);


The Json information that is send back to populate the above:

{ "gebieden": [{ "id":"19", "naam":"Appartementen Gletscherpanorama", "lid":"1", "min_hoogte":"753", "max_hoogte":"3029", "prijs":"79.00", "url":"http:\/\/ds1.nl\/c\/?wi=127251&amp;si=2374&amp;li=146991&amp;dl=oostenrijk\/zell_am_see-kaprun\/kaprun\/appartementen_gletscherpanorama.htm&amp;ws=", "pistes_groen":"0", "pistes_blauw":"57", "pistes_rood":null, "pistes_zwart":null, "pistes":"138", "gebied":"Zell am See - Kaprun", "gid":null, "dorp":"Kaprun", "afstand_utrecht":"966", "image":"accom_small_19" }, { "id":"30", "naam":"Appartementen Mariandl & Dependance", "lid":"1", "min_hoogte":"753", "max_hoogte":"3029", "prijs":"94.00", "url":"http:\/\/ds1.nl\/c\/?wi=127251&amp;si=2374&amp;li=146991&amp;dl=oostenrijk\/zell_am_see-kaprun\/piesendorf\/appartementen_mariandl__dependance.htm&amp;ws=", "pistes_groen":"0", "pistes_blauw":"57", "pistes_rood":null, "pistes_zwart":null, "pistes":"138", "gebied":"Zell am See - Kaprun", "gid":null, "dorp":"Piesendorf", "afstand_utrecht":"966", "image":"accom_small_30" }], "pagina": { "pages_before":"1", "pages_after":0, "max_per_page":"10", "current_pag":1, "totaal_aantal_pag":4, "aantal_resultaten":33 } }

And as last, the HTML coding:

<ul class="resultaten" id="resultaten"></ul>

Any additional questions/information needed, please let me know.

P.s. any improvements to the code are always welcome.

-------------Problems Reply------------

Are you using something to activate HTML5?

Tags like: <details>, <summary> are not yet supported and will not be shown correctly in <=IE8

See the following link for more information and you can find a HTML5 activator for browsers that do not yet support the tags: http://html5doctor.com/how-to-get-html5-working-in-ie-and-firefox-2/

Category:jquery Views:0 Time:2011-11-25

Related post

  • JQuery + form fields not inserting to database 100% correctly 2009-08-18

    I have a complex form which uses blur events to trigger updating to mysql. There is validation which disables the submit button until all required fields are completed. The problem is, users are managing to submit the form even though they haven't co

  • call jQuery JSON function and pass back resulting payload 2010-02-16

    I would like to call jQuery JSON function and pass back results as JSON object (Javascript array?), but I am not quite understanding dynamics of what is happening here. myJSON = myFunction(productNo) $.each(myJSON, function(i,user){ alert (user.descr

  • jQuery, JSON and Apache problem 2010-03-07

    I have an jQuery JSON request, that loads some JSON from another server (ex. foo.com): $.getJSON("http://foo.com/json.php",function(data) { alert(data); }); But I receive data as null. This is not cross-domain issue, I tried following: $.getJSON("htt

  • Using jQuery, JSON and AJAX to populate a drop down 2010-08-25

    like the title says, I am trying to create a drop down menu using jQuery, JSON and AJAX, although I am familiar with the theory I have yet to put it into practice, any advice, demo code snippets or tutorials would be appreciated, since I would like t

  • jquery json to string? 2010-08-29

    Instead of going from a json string and using $.parseJSON, I need to take my object and store it in a variable as string representing json. (A library I'm dealing with expects a malformed json type so I need to mess around with it to get it to work.)

  • Why does the jQuery JSON parser need double escaping for backslashes? 2010-09-27

    I have trouble wrapping my head around a peculiar feature of the JSON data format. The situation is as follows: I have a string containing a Windows (sigh) directory path, backslashes escaped. For some reason, the jQuery JSON parser thinks that a sin

  • JSON2 vs. jquery-json 2010-10-20

    Probably, a simple question, which I can't seem to find a solid answer to. Why would one choose JSON2 over jquery-json plugin ( http://code.google.com/p/jquery-json/)? Given that a web application is using jQuery to begin with. Everyone's writing abo

  • Send JQuery JSON to WCF REST using date 2010-12-17

    I know that are a lot of posts about consuming a WCF REST through JQuery/JSON, but I can't get it to work. I'm currently stuck at a date parameter. Below is my C# method: [OperationContract] [WebInvoke] [TransactionFlow(TransactionFlowOption.Allowed)

  • JQuery JSON read and print $.getJSON 2011-01-26

    This is something new to me so please be patient. JQuery & json - I have been using json & serialize for "ages" in php but just getting into JQ. I want to pass data cross domain- so json array seems best to me but how to I display it e.g. say

  • Basic Simple Asp.net + jQuery + JSON example 2011-04-22

    I'm trying to learn how to make a simple call to the server from Javascript/jQuery. I've been trying to learn and could not find a tutorial with those simple steps. I want to send a message to the server with two parameters (a DateTime and a String)

  • jquery json post return whole page html 2011-05-10

    I have two pages, one posts value to another, then it makes a mysql query and returns the data to the first one. If I use jquery json post, instead of jquery ajax post, how to get back the whole page back? (I want get back the mysql query results). T

  • jQuery JSON request not loading 2011-05-27

    I am new to using the jQuery JSON request method, and I have a feeling I am making a really silly mistake with it. For some reason, the following is not being called. The alert box never opens, and the html variable never is populated. Any Ideas? $.g

  • CodeIgniter jQuery JSON libraries 2011-12-26

    Are there any CodeIgniter libraries that help simplify the process of using jQuery JSON with Ci? --------------Solutions------------- Well, there is an ajax helper: http://codeigniter.com/wiki/jQuery_Ajax_Helper But why do you really need it? What I

  • Long Polling: Best practices using php/Jquery/json 2012-01-15

    guys i am planning to show my user live a flash message, whenever they get a new private message into their inbox. What is the best way to do it, using php 5.3, jquery,json and stuff like that? My favorite php framework is Symfony2 and javascript:Jqu

  • how to get image size from a jquery json parse? 2012-04-07

    how to get image size from a jquery json parse? I put a each function, first download all the images to the html part then try to use width() & height() to the the image size, but I met some trouble in getting width() & height() are ahead of

  • Getting Response From Jquery JSON 2012-04-08

    I'm having trouble getting a response from my php jquery / json / ajax. I keep combining all these different tutorials together but I still can't seem to pull it all together since no one tutorial follow what I'm trying to do. Right now I'm trying to

  • jQuery jsonrpc 2.0 call via .ajax() gets correct response but does not work? 2011-11-16

    A jsonrpc 2.0 call via jquery to a Tornado web server gets a "200 OK" http response and my network sniffer shows the decoded response as containing {"jsonrpc":"2.0","error":null,"result":3500,"id":"jsonrpc"} i.e a valid jsonrpc 2.0 response. 3500 is

  • jquery json ie8 and lower not updating script 2012-02-29

    I'm having an issue where my json script is not updating on ie8 and lower. I guess its a caching problem. How would i go about fixing this? This is the page where it is running. http://www.roofracks.co.uk/thule/Roof+Mounted+Bikes+and+Cycles+Racks+and

  • Font anti-aliasing issues with jQuery.fadeIn in IE8? 2009-07-03

    I'm banging my head against the wall with an issue I'm having in IE8. I am using the fadeIn function on jQuery to make the site content fade in. This works perfectly fine in all of the other browsers, but when the fadeIn finishes in IE8 the font anti

Copyright (C) dskims.com, All Rights Reserved.

processed in 0.240 (s). 11 q(s)