Temat: OnBlur vs IE

Witam,

Mam pewien problem z akcja onblur na inputtekście pod IE. Pod każdą inną przeglądarką rozwiązanie działa poprawnie czyli po wyjściu z inputtext'a następuje prawidłowe wywołanie funkcji.

<input type='text' name='costam[]' value='21' maxlength='4' OnBlur='some_func(this.value, 3)'>

Ktoś ma jakiś pomysł dlaczego pod IE OnBlur nie jest wywoływany w momencie opuszczania pola tekstowego?Michał Stachura edytował(a) ten post dnia 08.12.09 o godzinie 01:26

Temat: OnBlur vs IE

Pewnie się czepiam, że "OnBlur" to się pisze "onblur", ale to chyba nie ma większego znaczenia ;)

Sam event na 100% działa pod IE. Więc upatrywałbym problem gdzie indziej.

Temat: OnBlur vs IE

A może chodzi o to, że funkcja zmienia parametr this.value, a w IE jest on przekazywany jako wartość, zaś w innych przeglądarkach jako wskaźnik? Przekaż this a potem odwołaj się przez this.value

Nie, nie mam pojęcia, strzelam:)

Temat: OnBlur vs IE

Dariusz Wawer:
A może chodzi o to, że funkcja zmienia parametr this.value, a w IE jest on przekazywany jako wartość, zaś w innych przeglądarkach jako wskaźnik? Przekaż this a potem odwołaj się przez this.value

Nie, nie mam pojęcia, strzelam:)

Myślisz, że jakbym nadał id dla tego pola (id='costam') i przekazał w funkcji costam.value to zadziała?

Spróbuję.

Temat: OnBlur vs IE

Nie wydaje mi się by problem był w this.value. Może problem jest w samej funkcji? Prosty test:

<script type="text/javascript">

function some_func(value, n){

    alert(value);

}

</script>



<form id="test">

  <input type='text' name='costam' value='21' maxlength='4' onblur='some_func(this.value, 3)'>

</form>

Działa pod IE6, IE7, IE8. Może konsola coś Ci podpowie?

Temat: OnBlur vs IE

Olga Grabek:
Nie wydaje mi się by problem był w this.value. Może problem jest w samej funkcji? Prosty test:

Nie o to mi chodziło. Wykorzystam podany kawałek kodu.

<script type="text/javascript">

function some_func(value, n){

    value="wywolano blur"

}

</script>



<form id="test">

  <input type='text' name='costam' value='21' maxlength='4' onblur='some_func(this.value, 3)'>

</form>

metoda some_func się wywoła, parametr zostanie zmieniony, tyle, że nie będzie on wartością inputa, a zmienną lokalną w metodzie. Dlatego gdyby przekazać this a potem zmienic obj.value="wywołano blur" powinno zadziałać.

Temat: OnBlur vs IE

No to chyba powinno być tak:

<script type="text/javascript">



function some_func(obj, n){



    obj.value="wywolano blur"



}



</script>

<form id="test">



  <input type='text' name='costam' value='21' maxlength='4' onblur='some_func(this, 3)'>



</form>

Aczkolwiek nie sądzę, by to powodowało, że na zdarzeniu onblur nie wywołuje się cała funkcja.

Temat: OnBlur vs IE

Olga Grabek:
No to chyba powinno być tak:

dokładnie

Olga Grabek:
Aczkolwiek nie sądzę, by to powodowało, że na zdarzeniu onblur nie wywołuje się cała funkcja.

funkcja się wykonuje, ale jej efekty nie będą widoczne.

Autor wątku przedstawił trochę za mało informacji co do jej zawartości, żeby to stwierdzić.

Temat: OnBlur vs IE

Dariusz Wawer:

Autor wątku przedstawił trochę za mało informacji co do jej zawartości, żeby to stwierdzić.

Masz racje :)

Michał się nie odzywa więc możemy sobie dywagować :)

Temat: OnBlur vs IE

Krew mi sie gotuje jak ktoś eventy podpina inline. Jak ma działać ta magiczna funkcja some_func(this.value, 3) bo onblur napewno działą crossbrowser.

Gdyby ktoś miał jakieś wątpliwości co do kompatybilność event etc. odsyłam do bardzo ładnego porównania: http://www.quirksmode.org/dom/events/index.html

Temat: OnBlur vs IE

Hehe, Marek, Не паникуйте!

Dzięki temu łatwiej pokazać przykłady :) A to, że nieestetycznie wygląda.... Bez przesady. Czy tak czy tak onblur powinno działać :D

Temat: OnBlur vs IE

Witam.
Przepraszam, że się nie odzywam ale... praca :)
Niestety nadal jestem w kropce ale nie wydaje mi się już, że to kwestia onblura. Bardziej chyba coś z przekazywaniem zmiennych. Poniżej opisuję cały proces może to rzuci nieco światła i pomoże rozwiązać problem.

1. W pliku func.php mam zdefiniowaną funkcję rysującą zawartość koszyka draw_table($db). Funkcja jak funkcja - normalna - koszyk oparty na sesji z uwzględnieniem kilku zmiennych.
Jest tam też moje nieszczęsne

<input type='text' name='ilosc[]' value='21' onblur='mod_basket(this.value, 3)'>

Gdzie 21 to ilość danego towaru w koszyku a 3 to miejsce w tablicy z ilościami przypisane do danego towaru. Czyli mamy dwie tablice jedna z id towaru druga z ilościami. Funkcja ta (draw_table($db)) jest wywoływana 'po raz pierwszy' na stronie głównej koszyka.

2. mod_basket wywołuje (teoretycznie) funkcje ajaxową mająca na celu odświeżenie ilości towarów ich wartości (cena towaru*ilosc) oraz sumy końcowej wartości całego koszyka. Funkcja mod_basket znajduje się w pliku ajax_basket.js i poniżej prezentuje ją w całości.

function mod_basket(ilosc, i)

{

		// kodujemy wartości, żeby zabezpieczyć je na czas transmisji HTTP

		ilosc = encodeURIComponent(ilosc);

		i = encodeURIComponent(i);

		// dodajemy wartości do kolejki

		cache.push("ilosc=" + ilosc +"&i=" + i + "&type=mod");

		// kontynuuje jesli obiekt XMLHttpRequest jest wolny a pamięć podręczna nie jest pusta

		if ((xmlHttp.readyState == 4 || xmlHttp.readyState == 0) && cache.length > 0)

		{

			// pobiera parametry z pamięci

			var cacheEntry = cache.shift();

			// wysyła żądanie dodania na serwer

			xmlHttp.open("POST","data/ajax_basket.php",true);

			xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

			xmlHttp.onreadystatechange=f_basket_table_refresh;

			xmlHttp.send(cacheEntry);		}

}



function f_basket_table_refresh() 

{ 

	if (xmlHttp.readyState==4)

{ 

	document.getElementById("koszyk_table").innerHTML=xmlHttp.responseText;

}

}

3. Jak widzicie mod_basket odwołuje się do pliku ajax_basket.php gdzie przekazuje POSTem nową ilość dla danego towaru.

4. Plik ajax_basket.php robi niewiele bo jedynie aktualizuje zmienną sesji z ilością na odpowiednim rekordzie

$ilosc = (!ereg('[0-9]', $_POST['ilosc']) || empty($_POST['ilosc']) ? '1' : $_POST['ilosc']);

		$i = (!ereg('[0-9]', $_POST['i']) ? '0' : $_POST['i']);

		$_SESSION['ilosc'][$i] = $ilosc;

i następnie ponownie wywołuje funkcję php odświeżającą koszyk draw_table($db) z pliku func.php. Już na nowych zmiennych sesji koszyk jest (powinien być) poprawnie odświeżany z nowymi wartościami.

5. Kolejny krok to wywołanie funkcji f_basket_table_refresh, która jak widzicie w pkt 2. po otrzymaniu nowego koszyka

if (xmlHttp.readyState==4)

przesyła go i odświeża w id='koszyk_table'

document.getElementById("koszyk_table").innerHTML=xmlHttp.responseText;

.

Zaktualizowany koszyk jest odświeżany i wyświetlany klientowi. Przynajmniej pod FF, Operą, Safari ale nie pod IE.
W Internet Explorerze po zmianie ilości towaru i wyjściu z pola koszyk pozostaje ten sam. Dopiero odświeżenie strony (F5) powoduje wyświetlenie nowej zawartości koszyka, ale wtedy już działa mechanizm wywołania funkcji 'po raz pierwszy' opisany w pkt 1.
Ponieważ po odświeżeniu są już prezentowane nowe wartości ilościowe w koszyku wnioskuję, że dochodzi do prawidłowej modyfikacji zmiennej sesji, czyli teoretycznie wywolanie funkcji onblur działa prawidłowo. Pytanie tylko dlaczego pod IE nie działa mechanizm odświeżenia nowej zawartości koszyka.
Dodam tylko, że podobny mechanizm, ale nie na input tekście tylko na przycisku z akcją onclick działa poprawnie w innej części serwisu.

Temat: OnBlur vs IE

Mam nadzieje ze xmlHttp jest crossbrowserem tzn. wyglada jakos tak:

var xmlHttp;

if (XMLHttpRequest) { 

    xmlHttp= new XMLHttpRequest();

} else if (ActiveXObject) { 

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

}

oczywiscie powinno to być ladniejsze... ale to taki skrót myslowy...Marek Pawłowski edytował(a) ten post dnia 08.12.09 o godzinie 23:06

Temat: OnBlur vs IE

może xmlHttp jest używane wcześniej i problem jest w czymś podobnym do http://www.coderanch.com/t/121740/HTML-JavaScript/IE-W... ?

Temat: OnBlur vs IE

Używam takiej konstrukcji:

function createXmlHttpRequestObject()

{

  // przechowa odwołanie do obiektu XMLHttpRequest

  var xmlHttp;

  // powinno działać dla wszystkich przeglądarek z wyjątkiem IE6 i starszych

  try

  {

    // próbuje stworzyć obiekt XMLHttpRequest

		xmlHttp = new XMLHttpRequest();

	}

	catch(e)

	{

		// zakładając, że IE6 lub starsza

		var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",

																		"MSXML2.XMLHTTP.5.0",

																		"MSXML2.XMLHTTP.4.0",

																		"MSXML2.XMLHTTP.3.0",

																		"MSXML2.XMLHTTP",

																		"Microsoft.XMLHTTP");

		// sprawdza każdy prog id aż któryś zadziała

		for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)

		{

			try

			{

				// próbuje stworzyć obiekt XMLHttpRequest

				xmlHttp = new ActiveXObject(XmlHttpVersions[i]);

			}

			catch (e) {} // ignoruje potencjalne blędy

		}

	}

	// zwraca stworzony obiekt albo wyświetla komunikat o błędzie

	if (!xmlHttp)

		displayError("Błąd podczas tworzenia obiektu XMLHttpRequest.");

	else

		return xmlHttp;

}



function GetXmlHttpObject()

{

var xmlHttp=null;

try

  {

  // Firefox, Opera 8.0+, Safari

  xmlHttp=new XMLHttpRequest();

  }

catch (e)

  {

  // Internet Explorer

  try

    {

    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

    }

  catch (e)

    {

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

    }

  }

return xmlHttp;

}

.

Raczej nie podejrzewam xmlHttp bo w akcji na przycisku działa poprawnie niezależnie od tego ile razy kliknę.

Temat: OnBlur vs IE

Dobra inaczej spreparowałem sobie odwzorowanie twojego kodu.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

        <title>Untitled Document</title>

    </head>

    <script>

    	//Global var sucks! =]

    	var cache = [];

	        function createXmlHttpRequestObject(){

            // przechowa odwołanie do obiektu XMLHttpRequest

            var xmlHttp;

            // powinno działać dla wszystkich przeglądarek z wyjątkiem IE6 i starszych

            try {

                // próbuje stworzyć obiekt XMLHttpRequest

                xmlHttp = new XMLHttpRequest();

            } 

            catch (e) {

                // zakładając, że IE6 lub starsza

                var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0", "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP");

                // sprawdza każdy prog id aż któryś zadziała

                for (var i = 0; i < XmlHttpVersions.length && !xmlHttp; i++) {

                    try {

                        // próbuje stworzyć obiekt XMLHttpRequest

                        xmlHttp = new ActiveXObject(XmlHttpVersions[i]);

                    } 

                    catch (e) {

                    } // ignoruje potencjalne blędy

                }

            }

            // zwraca stworzony obiekt albo wyświetla komunikat o błędzie

            if (!xmlHttp) 

                displayError("Błąd podczas tworzenia obiektu XMLHttpRequest.");

            else 

                return xmlHttp;

        }

        

		//Global var sucks! =]

		var xmlHttp = createXmlHttpRequestObject();

	        function mod_basket(ilosc, i){

		            // kodujemy wartości, żeby zabezpieczyć je na czas transmisji HTTP

            // ilosc = encodeURIComponent(ilosc);

            // i = encodeURIComponent(i);

            // dodajemy wartości do kolejki

            cache.push("ilosc=" + ilosc + "&i=" + i + "&type=mod");

	            // kontynuuje jesli obiekt XMLHttpRequest jest wolny a pamięć podręczna nie jest pusta

            if ((xmlHttp.readyState == 4 || xmlHttp.readyState == 0) && cache.length > 0) {

                // pobiera parametry z pamięci

                var cacheEntry = cache.shift();

                // wysyła żądanie dodania na serwer

                xmlHttp.open("POST", "data/ajax_basket.php", true);

                xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

                xmlHttp.onreadystatechange = f_basket_table_refresh;

                xmlHttp.send(cacheEntry);

            }

        }

        

        function f_basket_table_refresh(){

            if (xmlHttp.readyState == 4) {

                document.getElementById("koszyk_table").innerHTML = xmlHttp.responseText;

            }

        }

    </script>

    <body>

    	<div id="koszyk_table"></div>

        <input type='text' name='ilosc[]' value='21' onblur='mod_basket(this.value, 3)'>

    </body>

</html>

Zauważ ze zakomentowalem linijki z encodeURIComponent gdyż nie mialem implementacji tej funkcji ale ona raczej nie powinna nic psuć.

I mam dla ciebie złą wiadomość gdyż ten kod działa na wszystkich posiadanych przeze mnie przegladarkach oprócz ie6. Bo w ie6 odpowiedz przychodzi pusta strasznie dziwne.

WinXP:
IE 5.5 (5.51.4807.2300)
IE 6.0 (6.00.2900.2180) sucks!
IE 7.0 (7.00.5730.13)
IE 8.0 (8.00.6001.18702)
Zciekawości sprawdziłem reszte normalnych przegladarek i smiga gra i trąbi ;)Marek Pawłowski edytował(a) ten post dnia 09.12.09 o godzinie 01:16

Temat: OnBlur vs IE

WinXP:
IE 5.5 (5.51.4807.2300)
IE 6.0 (6.00.2900.2180)
IE 7.0 (7.00.5730.13)
IE 8.0 (8.00.6001.18702)

Z ciekawości :) czego używasz do symulowania wersji IE? IETester?

Pozdrawiam

Temat: OnBlur vs IE

Z ciekawości odpowiadam nie symuluje wersji :)

IETester - ja nie potrafiłem wytrzymać dłużej niż do drugiego crasha ;)

Zobacz sobie http://codecpack.nl/iecollection1603.exe. Nie wszystko działa jak powinno ale to i tak lepsze od IETestera. Tzn. wiekszość wersji IE działa jest troche nie stabilności. Natomiast jak chcesz stabilności to zostaje ci chyba wirtualizacja systemu per IE :)
Dla mnie ta kombilacja oferuje to co potrzebuje.

BTW Nawet udało mi sie spiąć ie6 z debugerem z aptany wiec wydaje misie dość dobra. Bo czego wiecej do szczęscia trzeba jak masz IDE spięte z debugerem pod konkretną przegladarką. =]Marek Pawłowski edytował(a) ten post dnia 09.12.09 o godzinie 01:32

Temat: OnBlur vs IE

No i ruszyło nareszcie. Przyczyna... jak zwykle prozaiczna.

Funkcję draw_table($db), która rysuje tabelkę z koszykiem przy jej pierwszym wywołaniu na stronie głównej koszyka zamknąłem w tabelce z id='koszyk_table'. czyli mam coś takiego:

echo '<div id='koszyk_table'>';

draw_table($db);

echo '</div>'

Przy pierwszym przebiegu ajaxowym po akcji onblur zapomniałem już wstawić tej tabelki przez co de facto tabelka z koszykiem nie miała już swojego id bo zaczynała się od pierwszego wiersza <tr>.
Kwas.

Teraz już nie dziwi mnie dlaczego pod IE nie działa, teraz dziwi mnie dlaczego pod innymi działa skoro nie powinno?

Anyway. Ostatecznie zapakowałem wszystko do diva z id='koszyk_table' i śmiga tak jak chciałem.
Dziękuje wszystkim zaangażowanym za pomoc.Michał Stachura edytował(a) ten post dnia 09.12.09 o godzinie 21:24