WN - Ajax fungerar endast i FF

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Ajax fungerar endast i FF (https://www.wn.se/forum/showthread.php?t=30684)

Så här ser allting ut nu (lite bättre översyn)

fetch.js

Kod:

function xmlhttpPost(strURL) {

  var xmlHttpReq = false;



  // Mozilla/Safari

  if (window.XMLHttpRequest) {

    xmlHttpReq = new XMLHttpRequest();

  }

  // IE

  if (window.ActiveXObject) {

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

 alert('Hej MSIE');

  }

  xmlHttpReq.open('POST', strURL, true);

  xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

  xmlHttpReq.onreadystatechange = function() {

        

  

  if (xmlHttpReq.readyState == 1) {

      updatepage('<br /><br /><img src="loader.gif" border="0" alt="" style="margin-left:15px;" />');

    }



 

    if (xmlHttpReq.readyState == 4) {

      updatepage(xmlHttpReq.responseText);

    }

  }

  xmlHttpReq.send(getquerystring());

}



function getquerystring() {

  var form   = document.forms['feeds'];

  var word = form.feed.value;

  qstr = 'feed=' + escape(word);

  return qstr;

}



function updatepage(str){

  document.getElementById("result").innerHTML = str;

}

index.html

Kod:

<html>

<head>

<script type="text/javascript" src="js/fetch.js"></script>

</head>

<body>

<form name="feeds" action="index.html" method="post">

 <select name="feed"> 

 <option value="">Välj</option>

 <option value="http://www.geiser.se/feed" onclick='xmlhttpPost("show_feed.php")'>Geiser.se</option>

 <option value="http://feeds.feedburner.com/tkjblogg?format=xml" onclick='xmlhttpPost("show_feed.php")'>TkJ</option>

 <option value="http://www.dan.se/feed" onclick='xmlhttpPost("show_feed.php")'>Dan.se</option>

 </select><br />

 <div id="result"></div>

</form>

</body>

</html>

show_feed.php

Kod:

<?php

$url = $_POST['feed'];

        if(isset($_POST['feed']))

        {

 if(preg_match("/http:/", $url))

 {

         require_once("class_rss.php"); //Hämtar klassen

         $rss = new rssHandler();         //Skapar instans till klassen



  //Här anger du RSS-feedens url

         $antal = 20;   //Här anger du hur många inlägg du vill skriva ut

         

         //Här skickar du in datan som klassen behöver och skriver ut den

         echo $rss->show_feed($url, $antal);

 }

        }

?>

Jag har provat utan kontrollerna i show_feed.php.. samma resultat.

Testa att sätta xmlHttpReq till null istället för false och kör en try..catch-struktur istället vid skapandet av objektet.

Hm...
Först av allt vet vi inte om det blir något XMLHttepRequest-objekt överhuvudtaget. Du borde ta och lägga till en else-sats före xmlHttpReq.open(...):

Kod:

else {

  alert('Failed to create request object.');

  return false;

}

Får du fortfarande samma resultat, testa att byta

Kod:

  // Mozilla/Safari

  if (window.XMLHttpRequest) {

    xmlHttpReq = new XMLHttpRequest();

  }

  // IE

  if (window.ActiveXObject) {

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

    alert('Hej MSIE');

  }

mot

Kod:

  // Mozilla/Safari

  try {

    xmlHttpReq = new XMLHttpRequest();

  } catch (e) {

  // IE

  try {

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

    alert('Hej MSIE');

  } catch (e) {

   alert('Failed to create request object.');

   return false;

  }

  }

fetch.js

Kod:

function sendRequest(url,callback,postData) {

        var req = createXMLHTTPObject();

        if (!req) return;

        var method = (postData) ? "POST" : "GET";

        req.open(method,url,true);

        req.setRequestHeader('User-Agent','XMLHTTP/1.0');

        if (postData)

 req.setRequestHeader('Content-type','application/x-www-form-urlencoded');

        req.onreadystatechange = function () {

 if (req.readyState != 4) return;

 if (req.status != 200 && req.status != 304) {

//         alert('HTTP error ' + req.status);

         return;

 }

 callback(req);

        }

        if (req.readyState == 4) return;

        req.send(postData);

}



var XMLHttpFactories = [

        function () {return new XMLHttpRequest()},

        function () {return new ActiveXObject("Msxml2.XMLHTTP")},

        function () {return new ActiveXObject("Msxml3.XMLHTTP")},

        function () {return new ActiveXObject("Microsoft.XMLHTTP")}

];



function createXMLHTTPObject() {

        var xmlhttp = false;

        for (var i=0;i<XMLHttpFactories.length;i++) {

 try {

         xmlhttp = XMLHttpFactories[i]();

 }

 catch (e) {

         continue;

 }

 break;

        }

        return xmlhttp;

}



function updatepage(str){

  document.getElementById("result").innerHTML = str;

}

html-sida

Kod:

<html>

<head>

<script type="text/javascript" src="js/fetch.js"></script>

</head>

<body>

<form name="feeds" action="index.html" method="post">

 <select name="feed" onchange="sendRequest('show_feed.php?feed=' + this.options[this.selectedIndex].value, updatepage)"> 

 <option value="">Välj</option>

 <option value="http://www.geiser.se/feed">Geiser.se</option>

 <option value="http://feeds.feedburner.com/tkjblogg?format=xml">TkJ</option>

 <option value="http://www.dan.se/feed">Dan.se</option>

 </select><br />

 <div id="result"></div>

</form>

</body>

</html>

Hur fungerar denna koden?
Detta är koden ifrån: http://www.quirksmode.org/js/xmlhttp.html med modifikationer i din html-kod för att passa scriptet.

Det ska fungera som så att man i drop down listan väljer en feed... den skickar url'en till show_feed.php som tar emot det, skickar in den i klassen rss_class.php som i sin tur behandlar rss-feeden och återger det jag vill att den ska återge.

Jag ska testa det ni föreslår om ett litet tag.. återkommer.

EDIT: hehe, missuppfattade det du skrev... jag ska testa den koden du skickade :)

Jag uppskattar all hjälp ni ger mig :)

Det ser väl bra ut, men updatepage() kommer inte gilla att den får ett objekt och inte en sträng.

Två alternativ:
1) Ändra i sendRequest så callback() anropas med argumentet req.responseText (istället för bara req).
2) Ändra i updatepage() så den lägger in str.responseText i innerHTML (istället för bara str).

Smaksak...

Citat:

Ursprungligen postat av turboraketti

Hm...
Först av allt vet vi inte om det blir något XMLHttepRequest-objekt överhuvudtaget. Du borde ta och lägga till en else-sats före xmlHttpReq.open(...):

Kod:

else {

 alertFailed to create request object.;

 return false;

}

Får du fortfarande samma resultat, testa att byta

Kod:

 // Mozilla/Safari

 if window.XMLHttpRequest {

  xmlHttpReq = new XMLHttpRequest;

 }

 // IE

 if window.ActiveXObject {

  xmlHttpReq = new ActiveXObjectMicrosoft.XMLHTTP;

  alertHej MSIE;

 }

mot

Kod:

 // Mozilla/Safari

 try {

  xmlHttpReq = new XMLHttpRequest;

 } catch e {

 // IE

 try {

  xmlHttpReq = new ActiveXObjectMicrosoft.XMLHTTP;

  alertHej MSIE;

 } catch e {

  alertFailed to create request object.;

  return false;

 }

 }

Jag får upp en alert i FF, men inte i IE och Safari. Jag testade din try, catch... fungerade inte i någon.

Citat:

Ursprungligen postat av Jonas

fetch.js

Kod:

function sendRequesturl,callback,postData {

        var req = createXMLHTTPObject;

        if req return;

        var method = postData ? POST GET;

        req.openmethod,url,true;

        req.setRequestHeaderUser-Agent,XMLHTTP/1.0;

        if postData

 req.setRequestHeaderContent-type,application/x-www-form-urlencoded;

        req.onreadystatechange = function {

 if req.readyState = 4 return;

 if req.status = 200 req.status = 304 {

// alertHTTP error + req.status;

 return;

 }

 callbackreq;

        }

        if req.readyState == 4 return;

        req.sendpostData;

}

var XMLHttpFactories = 

        function {return new XMLHttpRequest},

        function {return new ActiveXObjectMsxml2.XMLHTTP},

        function {return new ActiveXObjectMsxml3.XMLHTTP},

        function {return new ActiveXObjectMicrosoft.XMLHTTP};

function createXMLHTTPObject {

        var xmlhttp = false;

        for var i=0;iXMLHttpFactories.length;i++ {

 try {

 xmlhttp = XMLHttpFactoriesi;

 }

 catch e {

 continue;

 }

 break;

        }

        return xmlhttp;

}

function updatepagestr{

 document.getElementByIdresult.innerHTML = str;

}

html-sida

Kod:

html

head

script type=text/javascript src=js/fetch.js/script

/head

body

form name=feeds action=index.html method=post

 select name=feed onchange=sendRequestshow_feed.php?feed= + this.optionsthis.selectedIndex.value, updatepage 

 option value=Välj/option

 option value=http//www.geiser.se/feedGeiser.se/option

 option value=http//feeds.feedburner.com/tkjblogg?format=xmlTkJ/option

 option value=http//www.dan.se/feedDan.se/option

 /selectbr /

 div id=result/div

/form

/body

/html

Hur fungerar denna koden?
Detta är koden ifrån: http://www.quirksmode.org/js/xmlhttp.html med modifikationer i din html-kod för att passa scriptet.

Detta fungerade inte alls... det enda som hände var när jag provade köra allt i IE.. då ploppade [object] när den skriver ut result.

Blir så ledsen.. ingenting fungerar :(

Använd denna instantiering istället:

Citat:

try
*{
* xmlHttpReq=new XMLHttpRequest();
*}
catch (e)
*{
*try
* *{
* *xmlHttpReq=new ActiveXObject("Msxml2.XMLHTTP");
* *}
*catch (e)
* *{
* *xmlHttpReq=new ActiveXObject("Microsoft.XMLHTTP");
* *}
*}

Edit: bytte till ditt variabelnamn

Samma resultat.. perfekt i FF, nada i IE och Safari