WN
Sidan 1 av 2 1 2
Visa 40 inlägg från det här ämnet på en sida

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)

Kristoffer G 2008-07-22 02:49
Jag lyckas inte få följande att fungera i någon annan webbläsare än Firefox... Jag får inga felmeddelanden eller någontingm kan inte se vad som är fel. Webbläsaren kontrolleras ju trots allt.

Kod:
<script language="Javascript">
function xmlhttpPost(strURL) {
  var xmlHttpReq = false;
  var self = this;
  // Mozilla/Safari
  if (window.XMLHttpRequest) {
    self.xmlHttpReq = new XMLHttpRequest();
  }
  // IE
  else if (window.ActiveXObject) {
    self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
  }
  self.xmlHttpReq.open('POST', strURL, true);
  self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  self.xmlHttpReq.onreadystatechange = function() {
       
 
  if (self.xmlHttpReq.readyState == 1) {
      updatepage('<br /><br /><img src="loader.gif" border="0" alt="" style="margin-left:15px;" />');
    }

 
    if (self.xmlHttpReq.readyState == 4) {
      updatepage(self.xmlHttpReq.responseText);
    }
  }
  self.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;
}
</script>

hnn 2008-07-22 05:25
Använd ett bibliotek som Prototype, JQuery eller liknande. Onödigt att behöva uppfinna hjulet igen.

turboraketti 2008-07-22 07:42
Håller med om att jquery m.fl. med fördel kan användas till sånt här, men det är ju förstås värdefullt att kunna grunderna också, så jag föreslår att denna tråd ägnas åt att hitta felet i Brazzans kod.

Är du säker på att XMLHttpRequest-objektet skapas korrekt i MSIE (går den vidare till ActiveX-koden)? Om man kollar på Peter Paul-Kochs metod (http://www.quirksmode.org/js/xmlhttp.html) så anser han sig tydligen vara tvungen att använda try{}catch(){} och inte bara kolla ifall window.XMLHttpRequest finns. Kanske finns en anledning...

En fråga: Varför lägger du objektet i "this" ("self")? Det kan finnas problem med det beroende på hur funktionen anropas. Se http://www.quirksmode.org/js/events_advanced.html (under rubriken Drawbacks).
/C#

hnn 2008-07-22 07:47
om du byter ut POST mot GET?

Om du använder POST, kanske den förväntar sig att få data postat?

Kristoffer G 2008-07-22 14:02
Vill bara förklara att jag har nada koll på javascript/Ajax... denna koder är ihopklistrad... men fungerar med FF. Jag har provat byta ut POST mot GET... samma resultat... jag har provat ta bort self och kört med this...samma resultat.

Det måste ligga i webbläsarkontrollen. Jag har kikat på Peter Paul-Kochs sätt att kontrollera läsare, men jag får inte till det i min egen kod.

turboraketti 2008-07-22 14:10
Jag föreslår att du tar bort både self och this, dvs:
Kod:
xmlHttpReq = new XMLHttpRequest();
osv... Du gör ju "var xmlHttpReq = false;", så det känns ju vettigt att fortsätta använda den variabeln.

Du kan också skjuta in ett "alert('Hej MSIE');" i andra if-satsen för att kontrollera att MSIE kommer dit (alert gör en enkel popup med ok-knapp).

Kristoffer G 2008-07-22 15:06
Har provat det du säger... har plockat bort self och this.. fortfaranda samma sak (fungerar i FF men inte de andra).

Jag har även provat lägga till en alert i IE kontrollen... den ploppar inte upp... så det är väl där problemet ligger.

Men å andra sidan så fungerar det inte i Safari heller.

Kristoffer G 2008-07-22 15:09
Så här ser formuläret ut

Citat:

<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='JavaScript:xmlhttpPost("show_feed.php")'> Geiser.se</option>
<option value="http://feeds.feedburner.com/tkjblogg?format=xml" onclick='JavaScript:xmlhttpPost("show_feed.php")'> TkJ</option>
<option value="http://www.dan.se/feed" onclick='JavaScript:xmlhttpPost("show_feed.php")'> Dan.se</option>
</select>

<div id="result"></div>
</form>
</body>
</html>

turboraketti 2008-07-22 15:14
Ta bort "Javascript:" från onclick. Det ska bara finnas om du lägger javascript i href-attributet. Gissar att FF fattar vad du menar, men andra webbläsare genomskådar det inte (tror jag).

Kristoffer G 2008-07-22 15:20
Samma effekt... fungerar bara i FF.

Kristoffer G 2008-07-22 15:38
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.

tartareandesire 2008-07-22 16:44
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.

turboraketti 2008-07-22 16:54
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;
  }
  }

Jonas 2008-07-22 17:01
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.

Kristoffer G 2008-07-22 17:09
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 :)

turboraketti 2008-07-22 17:10
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...

Kristoffer G 2008-07-22 17:51
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.

Kristoffer G 2008-07-22 18:22
Blir så ledsen.. ingenting fungerar :(

tartareandesire 2008-07-22 18:27
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

Kristoffer G 2008-07-22 18:30
Samma resultat.. perfekt i FF, nada i IE och Safari

tartareandesire 2008-07-22 18:46
Denna kod fungerar felfritt i både FF och IE:

Citat:

function GetXmlHttpObject()
{
var xmlHttpReq=null;
try
{
xmlHttpReq=new XMLHttpRequest();
alert("Hej Mozilla!");
}
catch (e)
{
try
{
xmlHttpReq=new ActiveXObject("Msxml2.XMLHTTP");
alert("Hej IE!");
}
catch (e)
{
xmlHttpReq=new ActiveXObject("Microsoft.XMLHTTP");
alert("Hej IE!");
}
}
return xmlHttpReq;
}

var xmlHttp = GetXmlHttpObject();
Felet ligger sannolikt senare i koden. Felsök mer noggrant steg för steg så hittar du det säkert.

Kristoffer G 2008-07-22 19:13
well... precis samma resultat som tidigare.... alert fungerar i FF, men inte IE.

tartareandesire 2008-07-22 19:36
Testade du att köra enbart instantieringen utan någonting annat?

Kristoffer G 2008-07-22 19:39
hehe... "Hej mozilla" får jag i alla browsers...

tartareandesire 2008-07-22 19:50
Citat:
Originally posted by Brazzan@Jul 22 2008, 19:39
hehe... Hej mozilla får jag i alla browsers...
Du använder IE7 förmodar jag? Där används inte ActiveX längre så allt är som det ska och objektet har skapats. Felet ligger som sagt var senare i din kod.

Jonas 2008-07-22 19:52
Kod:
function updatepage(str) {
 document.getElementByIdresult.innerHTML = str;
}
emot

Kod:
function updatepage(str) {
 document.getElementByIdresult.innerHTML = str.responseText;
}
hur fungerar det då?

Kristoffer G 2008-07-22 20:02
Citat:
Originally posted by Jonas@Jul 22 2008, 19:52
Kod:
function updatepagestr {
 document.getElementByIdresult.innerHTML = str;
}
emot
Kod:
function updatepagestr {
 document.getElementByIdresult.innerHTML = str.responseText;
}
hur fungerar det då?
Fungerar inte alls

Kristoffer G 2008-07-22 20:05
Jag testar i FF 3, IE 7 och Safari 3.1.2

turboraketti 2008-07-22 20:21
Citat:
Ursprungligen postat av Brazzan
Citat:
Ursprungligen postat av Jonas
Kod:
function updatepagestr {
 document.getElementByIdresult.innerHTML = str;
}
emot
Kod:
function updatepagestr {
 document.getElementByIdresult.innerHTML = str.responseText;
}
hur fungerar det då?
Fungerar inte alls
Det är lite många versioner av koden i den här tråden... Ovanstående funkar med Paul-Kochs metod som Jonas föreslog tidigare, om man nu inte valt att modifiera callback-anropet istället...

Kristoffer G 2008-07-22 20:27
Så här ser det ut nu och fungerar i FF

fetch.js
Kod:
function xmlhttpPost(strURL) {
  var xmlHttpReq = null;
try
 {
 xmlHttpReq=new XMLHttpRequest();

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

  }
 catch (e)
  {
  xmlHttpReq=new ActiveXObject("Microsoft.XMLHTTP");

  }
 }
       
  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>
Jag har testat att lägga in lite alerts överallt för att se hur långt IE kommer... den enda gången alert fungerar i IE är när jag lägger den längst ner på sidan.

tartareandesire 2008-07-22 20:37
Det fungerar inte så bra att skriva ut vad som helst med alert i IE för att veta var felet ligger.

Du bör ändra form.feed.value i getquerystring (samt ta bort raden ovanför) till document.getElementById('feed').value och lägga på id i formuläret.

Kristoffer G 2008-07-22 20:51
Citat:
Originally posted by tartareandesire@Jul 22 2008, 20:37
Det fungerar inte så bra att skriva ut vad som helst med alert i IE för att veta var felet ligger.
Du bör ändra form.feed.value i getquerystring (samt ta bort raden ovanför) till document.getElementById(feed).value och lägga på id i formuläret.

Fungerar inte alls...

hehe.. lite spännande att se vem som kommer på lösningen :) Själv har jag noll koll.

tartareandesire 2008-07-22 21:08
Citat:
Ursprungligen postat av Brazzan
Citat:
Ursprungligen postat av tartareandesire
Det fungerar inte så bra att skriva ut vad som helst med alert i IE för att veta var felet ligger.
Du bör ändra form.feed.value i getquerystring (samt ta bort raden ovanför) till document.getElementById(feed).value och lägga på id i formuläret.
Fungerar inte alls...
hehe.. lite spännande att se vem som kommer på lösningen Själv har jag noll koll.
Vad menar du med "fungerar inte alls"? Inte i FF heller?

Kristoffer G 2008-07-22 21:14
nope.. inte i FF heller.

tartareandesire 2008-07-22 21:17
Då har du gjort något galet =) Lade du på feed-id:t i index.html?

Kristoffer G 2008-07-22 21:27
alltså.. jag har id="feeds" på formuläret och id="feed" på select... hur ska då


function getquerystring() {
var word = document.getElementById(feed).value
qstr = 'feed=' + escape(word);

return qstr;
}

Se ut?

Edit...

Jag har id="feeds" på formuläret och name="feed" på select

Kristoffer G 2008-07-22 21:39
Den skickar ingenting till show_feed.php i varken IE eller safari... jag har medvetet laggt till en felaktig url i <select> som genererar ett fel tillbaka...

Antingen det eller att den inte kan ta emot och skriva ut.

tartareandesire 2008-07-22 22:05
Du måste ha id på select (antar du har med citattecken även om de faller bort i texten).

Kristoffer G 2008-07-22 22:08
Kod:
<form name="feeds" action="index.html" method="POST">
 *<select id="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>
Kod:
function getquerystring() {
var word = document.getElementById(feed).value
qstr = 'feed=' + escape(word);
return qstr;
}
Så här uppfattar jag det du säger... och det fungerar inte i någon webbläsare.


EDIT: Jupp.. la till citattecken :) Det fungerar i FF nu, men inte någon annanstans.

tartareandesire 2008-07-22 22:52
Citattecknen kring feed i getquerystring också?


Alla tider är GMT +2. Klockan är nu 07:19.
Sidan 1 av 2 1 2
Visa 40 inlägg från det här ämnet på en sida

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson