Diskuze: Problém s XMLHttpRequestem

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Člen

:13.5.2015 20:57

Ahoj, mám malý problém s tou šíleností v názvu. Načítám si soubor size.txt, ve kterém je maximální povolená velikost souboru. Ve firefoxu mi ale pořád vypisuje too large, ale potom se to odešle. Když si alertnu proměnnou size, vyskočí na mě tři alerty, jeden prázdný a dva s hodnotou size.txt. Nevíte, co to je? V JS sice dělám pokroky, ale pořád mu moc nerozumím, proto bych poprosil i o odpuštění toho, že je to prasárna.
Kód:

var sizeclient = new XMLHttpRequest();
    sizeclient.open('GET', 'size.txt');
    sizeclient.onreadystatechange = function() {
        var size = sizeclient.responseText;
        if (document.getElementById('file').size <= size && document.getElementById('terms').checked && document.getElementById('file').value != '') {
            var formData = new FormData($('#upload')[0]);
            $.ajax({
                url: 'upload.php',
                type: 'POST',
                data: formData,
                async: false,
                success: function (data) {
                    window.location.href = 'file.php?id=' + data;
                },
            cache: false,
            contentType: false,
            processData: false
        });
    } else if (document.getElementById('file').value == '') {
        $('button').html('No file :(');
        $('button').addClass('error');
        setTimeout(function() {
            $('button').removeClass('error');
            $('button').html('Upload');
        }, 3000);
    } else if (!document.getElementById('terms').checked) {
        $('button').html('Terms!');
        $('button').addClass('error');
        setTimeout(function() {
            $('button').removeClass('error');
            $('button').html('Upload');
        }, 3000);
    } else if (document.getElementById('file').size > size) {
        $('button').html('Too large :(');
        $('button').addClass('error');
        setTimeout(function() {
            $('button').removeClass('error');
            $('button').html('Upload');
        }, 3000);
    }
        }
    sizeclient.send();
    return false;

Odpovědět

13.5.2015 20:57

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:13.5.2015 21:00

vyskočí na tebe 3× protože onreadystatechange se volá několikrát. Volá se vždycky když se mění hodnota readyState. 2/3 pokusu ti vyhodí chybu nebo nějak null a undefined, protože prohlížeč ještě nedostal odpověď. Musíš si v tom onreadystatechange podmínkou ověřit jestli to volání je už konečné. toho docílíš podmínkou.

if (sizeclient.readyState == 4)
    // ...

ideálně ověřit i stavový kód

if (sizeclient.readyState == 4 && sizeclient.status == 200)
    // ...

Editováno 13.5.2015 21:01

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

13.5.2015 21:00

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:13.5.2015 21:02

btw. proč jednou používáš nativní XHR a jednou používáš XHR s jQuery?

Nahoru Odpovědět

13.5.2015 21:02

Člen

:13.5.2015 21:06

Na druhou otázku ti odpovím tak, že v tom mám bordel a jsem rád, pokud to funguje. Za řešení děkuju, funguje!

Nahoru Odpovědět

13.5.2015 21:06

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.

Nejčastěji vyhledáváné

Diskuze: Problém s XMLHttpRequestem