Γιατί τρέχει μόνο σε IE;

bill@ki · 5 Δεκεμβρίου 2011

καλησπέρα παιδιά,

Εχω το παρακάτω html, αλλά τρέχει μόνο σε IE.Οτι εχω δοκιμάσει να αλλαξω στη συναρτηση για να παιζει και σε άλλους φυλλομετρητες δεν κατάφερα τίποτα. Απ ότι ξέρω το XMLHttpRequest χρησιμοποιείται για αυτό το σκοπό. Γιατι συμβαίνει αυτό; Καμιά συμβουλή;

>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
   
<script type="text/javascript">

   function fetchMessage(el) {
if (window.XMLHttpRequest)
 {// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// code for IE6, IE5
 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
       
       xmlhttp.open("GET","numbers.xml",false);
       xmlhttp.send();
       xmlDoc = xmlhttp.responseXML;


       // var items = xmlDoc.getElementsByTagName('chapter');
       var item = xmlDoc.selectSingleNode("//" + el.value).text;


       document.getElementById("lesson").value = item;


   }
</script>
</head>
<body>
<form id="form1" name="form1" action="" method="get">
<input style="border-style: inset" maxlength="70" size="90" type="text" name="" id="lesson" />
</form>
<table>
   <p style="font-family: 'Monotype Corsiva'" align="right">
       chapter
       <select style="width: 100px" name="lessons" onchange="fetchMessage(this);">
           <option>lesson_1</option>
           <option>lesson_2</option>
           <option>lesson_3</option>
           <option>lesson_4</option>
           <option>lesson_5</option>
           <option>lesson_6</option>
           <option>lesson_7</option>
           <option>lesson_8</option>
           <option>lesson_9</option>
           <option>lesson_10</option>
           <option>lesson_11</option>
       </select>
    </p>
</table>
</body>
</html>

το xml που τραβάει δεδομένα:

>
<?xml version="1.0" encoding="utf-8"?>
<root>
<chapter>
    <lesson_1>message 1</lesson_1> 
    <lesson_2>message 2</lesson_2>
    <lesson_3>message 3</lesson_3>
    <lesson_4>message 4</lesson_4>
    <lesson_5>message 5</lesson_5>
    <lesson_6>message 6</lesson_6>
    <lesson_7>message 7</lesson_7>
    <lesson_8>message 8</lesson_8>
    <lesson_9>message 9</lesson_9>
    <lesson_10>message 10</lesson_10>
    <lesson_11>message 11</lesson_11>
</chapter>
</root>

defacer · 5 Δεκεμβρίου 2011

Αυτό που πρέπει να κάνεις λέγεται debugging. Όταν κάνεις την send() (υποθέτω ότι μέχρι εκεί φτάνει έτσι κι αλλιώς, αν και θα πρέπει να το σιγουρέψεις και αυτό) τι βλέπεις στα developer tools του browser σχετικά με το HTTP request που γίνεται; Πετυχαίνει; Επιστρέφει δεδομένα;

Οδηγίες για το πώς να δεις το τι γίνεται π.χ. σε Chrome.

bill@ki · 6 Δεκεμβρίου 2011

Φίλε μου πολλες πληροφορίες και νεα πραγματα μου ειπες. Παρ'όλα αυτά με το πχ που εδωσες και αρκετό γκουγκλαρισμα διαπίστωσα το εξης. Τουλαχιστον για τον chrome σε πρώτη φάση. Τα request που κανω στο xml γίνονται. Στο html τώρα μου βγαζει ότι σταματησε στο send(), καθως και ενα typeError: object #<document> has no method 'selectSingleNode'. Υπάρχει περιπτωση να μην αναγνωριζεται αυτη η εντολή απο τον φυλλομετρητη;

ΠάρηςΓ · 6 Δεκεμβρίου 2011

http://wordsfromgeek.blogspot.com/2008/11/xml-dom-in-chrome.html

Μαλλον θελει αλλο τροπο για parsing. Εχω καιρο να ασχοληθώ με το θεμα. Γενικα νομιζω πως χειριζονται αλλιως το parsing εχουν αλλη μεθοδο. Αν χρησιμοποιήσεις Jquery θα εχεις πολυ μεγαλυτερη συμβατότητα.

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

}

Αυτο θεωρείται παλαιατζούρα πχ. Με jquery αυτα δε σε νιαζουν γιατι τα εχουν ψαξει αλλοι ωστε να ειναι συμβατα!

bill@ki · 6 Δεκεμβρίου 2011

http://wordsfromgeek.blogspot.com/2008/11/xml-dom-in-chrome.html

Μαλλον θελει αλλο τροπο για parsing. Εχω καιρο να ασχοληθώ με το θεμα. Γενικα νομιζω πως χειριζονται αλλιως το parsing εχουν αλλη μεθοδο. Αν χρησιμοποιήσεις Jquery θα εχεις πολυ μεγαλυτερη συμβατότητα.

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

}

Αυτο θεωρείται παλαιατζούρα πχ. Με jquery αυτα δε σε νιαζουν γιατι τα εχουν ψαξει αλλοι ωστε να ειναι συμβατα!

Ξερω ότι αυτός ο τρόπος ειναι όντως αρχαιος που χρησιμοποιησα και ότι υπάρχουν σίγουρα πιο συγχρονοι μεθοδοι. Απλα βρισκω μπροστα μου πολλα καινουργια πραγματα. Μου προτίνεις δηλαδή να ψαξω προς jquery; Περα απο τα διαφορα tutorial που μπορω να βρω, μπορεις να με κατατοπίσεις λίγο περισσότερο με το θέμα; πχ ο κωδικας θα ειναι ο ίδιος τόσο σε διάφορους φυλλομετρητές, όσο και στις διάφορες εκδόσεις;

defacer · 6 Δεκεμβρίου 2011

Να τα πετάξεις όλα κατά μέρος και αμέσως να βάλεις jQuery, για το λόγο που είπε ο Πάρης.

Λοιπόν έψαξα λίγο τον κώδικά σου. Δες αυτή τη γραμμή:

>xmlDoc = xmlhttp.responseXML;

Χμμ... τι είναι αυτό το "responseXML" property? Γιατί στον IE προφανώς έχει με τη σειρά του μια property "selectSingleNode", ενώ στον Chrome δεν έχει και απλά δεν δουλεύει το script (είδες πως βοηθάει το Javascript console?).

Είναι αυτό. Στη σελίδα που έκανα link, γράφει εκτός των άλλων

responseXML was introduced in Windows Internet Explorer 7.

Από την άλλη το script σου γράφει

>else
{// code for IE6, IE5
 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

See the problem? Το script σου τελικά δεν έτρεχε ποτέ ούτε σε ΙΕ < 7, αλλά δεν το ήξερες. Για το λόγο αυτό κράζω και γω με κάθε ευκαιρία "αφήστε τα homebrew και χρησιμοποιήστε jQuery που έχει μια άλφα γνωστή ποιότητα".

Πέραν τούτου να σου πω ότι όπως αποδεικνύεται, η selectSingleNode είναι Microsoft extension και επομένως δεν παίζει σε ο,τιδήποτε άλλο. Για συμβατότητα, θα πρέπει να "πλοηγηθείς" μέσα στην XML με XPath. Επειδή αυτό σημαίνει ότι θα χρειαστεί να μάθεις κι άλλα πράγματα, ίσως προς το παρόν θα ήταν καλύτερα να το γυρίσεις σε δεδομένα JSON αντί για XML (για να κάνεις τη δουλειά σου σωστά και εύκολα) και σε δεύτερο χρόνο μαθαίνεις XPath.

ΥΓ: Δεν το λέω για να σε αποπάρω, αλλά RTFM. Νομίζω βλέπεις στην πράξη πόσα πράγματα είναι πάρα μα πάρα πολύ απλά αν διαβάσεις το manual.

bill@ki · 12 Δεκεμβρίου 2011

Τελικά παιδιά κατευθύνθηκα προς jquery. Και όντως διαπίστωσα μεγαλύτερη συμβατότητα όσο αφορά τους browsers. Αυτό που κατάφερα να κάνω είναι να φορτώνω το xml αρχείο και να περνάω το πρώτο στοιχείο του xml στην φόρμα, χρησιμοποιώντας τη val(). Μάλλον στην περίπτωση μου θα χρειαστώ και την change() γιατί θέλω να αλλάζω το περιεχόμενο της φόρμας ανάλογα με την επιλογή που θα κάνω από το dropdown μενού.

Με λίγο ψάξιμο εδώ Link και εδώ Link το σκέφτομαι κάπως έτσι:

>
$("#dropdownlist").change(function() {
.......
}

Κώδικας:

>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>  
<script type="text/javascript" src="java/jquery.js"></script>  
<script type="text/javascript">
$(document).ready(function()
{
 $.ajax({
   type: "GET",
   url: "xml/numbers.xml",
   dataType: "xml",
   success: parseXml
 });
function parseXml(xml) {
 
 $(xml).find("chapter").each(function()  {
   	 	
$("#dropdownlist").val($(this).find("askisi_1").text());

});
}
});
</script>  
</head>
 
<body>  
<div>
<form id="myform" name="form1" action="" method="get">
<input style="border-style: inset" maxlength="70" size="90" type="text" id="dropdownlist" />
</form>
</div>
<table>
   <p style="font-family: 'Monotype Corsiva'" align="right">
       chapter
       <select style="width: 100px" name="lessons" id="dropdownlist">
           <option value="1">lesson_1</option>
           <option value="2">lesson_2</option>
           <option value="3">lesson_3</option>
           <option value="4">lesson_4</option>
           <option value="5">lesson_5</option>
           <option value="6">lesson_6</option>
           <option value="7">lesson_7</option>
           <option value="8">lesson_8</option>
           <option value="9">lesson_9</option>
           <option value="10">lesson_10</option>
           <option value="11">lesson_11</option>
       </select>
   </p>
</table>
</body>  
</html>

Το θέμα είναι τα παραδείγματα αυτά δεν με βοήθησαν ιδιαίτερα. Εχει να μου προτείνει κανείς κανένα άλλο παράδειγμα; Η τι πρέπει να γράψω στο google για να βρώ;

bill@ki · 14 Δεκεμβρίου 2011

Εχω φτιάξει κάπως τον κώδικα, αλλά μου δείχνει μόνο την πρώτη επιλογή ρε παιδιά. Καμιά ιδέα κανείς;

Αυτός είναι ο κώδικας:

>
<script type="text/javascript">
$(document).ready(function()
{
 $.ajax({
   type: "GET",
   url: "xml/numbers.xml",
   dataType: "xml",
   success: parseXml
 });
function parseXml(xml) {
 
     $(xml).find("chapter").each(function()  {

         $(this).find("lesson").each(function()  {


         $("#dropdownlist").val($(this).text());
		 
		 $("select").change(function () {          
var str = "";          
$("select option:selected").each(function () {                
str += $(this).val().text() + " ";              
});         
$("#dropdownlist").val(str);        
})        
.change();

	  });
	  });
}



});
</script>

Τροποποίησα λίγο και το xml:

>
<?xml version="1.0" encoding="utf-8"?>
<root>
  <chapter>
        <lesson>message 1</lesson> 
 <lesson>message 2</lesson>
 <lesson>message 3</lesson>
 <lesson>message 4</lesson>
 <lesson>message 5</lesson>
 <lesson>message 6</lesson>
 <lesson>message 7</lesson>
 <lesson>message 8</lesson>
 <lesson>message 9</lesson>
 <lesson>message 10</lesson>
 <lesson>message 11</lesson>
  </chapter>
</root>

defacer · 14 Δεκεμβρίου 2011

Όσον αφορά την ερώτησή σου, διάβασε το documentation για τη val() και πες μας τι καταλαβαίνεις ότι κάνει.

Κατά τα άλλα, ο κώδικας της parseXml είναι πολύ μακριά από το ιδανικό. Γράψε μας τι θέλεις να κάνεις ακριβώς -- σα να γράφεις διαγώνισμα (δε θέλεις να πρήξεις αυτόν που διορθώνει αλλά δε θα έχεις και ευκαιρία για διευκρινίσεις) για να το πιάσουμε απο κει να το πάμε σε jQuery να δεις και πως "θέλει" το jQuery να κάνεις κάποια πράγματα.

bill@ki · 14 Δεκεμβρίου 2011

Όσον αφορά την ερώτησή σου, διάβασε το documentation για τη val() και πες μας τι καταλαβαίνεις ότι κάνει.

Κατά τα άλλα, ο κώδικας της parseXml είναι πολύ μακριά από το ιδανικό. Γράψε μας τι θέλεις να κάνεις ακριβώς -- σα να γράφεις διαγώνισμα (δε θέλεις να πρήξεις αυτόν που διορθώνει αλλά δε θα έχεις και ευκαιρία για διευκρινίσεις) για να το πιάσουμε απο κει να το πάμε σε jQuery να δεις και πως "θέλει" το jQuery να κάνεις κάποια πράγματα.

Αν η τιμή της συνάρτησης στην παρένθεση βρίσκεται μέσα σε " " αλλάζει, διαφορετικά όχι. Προφανώς έχει γίνει μπέρδεμα με το τι θέλω να κάνω. Ανάλογα με την επιλογή που θα κάνω από το dropdown μενού, θέλω να "τραβάω" το αντίστοιχο μήνυμα από το xml αρχείο. Παράδειγμα, αν επιλέξω την πρώτη επιλογή από το μενού, θέλω να μου εμφανίσει το "message 1". Ιδανικό κώdικα εννοείς σωστό κώδικά; Αυτό που έκανα απέχει απο αυτό που θέλω να κάνω δηλαδή; Δεν σε κατάλαβα...

Υ.Γ τη value τιμή από το dropdown την έχω αφαιρέσει στο καινούργιο κώδικα αν η απορία σου ήταν αυτή

Σύνδεση

Γιατί τρέχει μόνο σε IE;

Προτεινόμενες αναρτήσεις

bill@ki

defacer

bill@ki

ΠάρηςΓ

bill@ki

defacer

bill@ki

bill@ki

defacer

bill@ki

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Δημιουργία λογαριασμού

Σύνδεση

Σύνδεση