HTML doesn't call javascript function with required arguments

Question

JavaScript I call from HTML file doesn't work correctly.

Here is code from html file:

<li><a href="#" class="decorNavi" onclick ="xmlRequest('about')" >ABOUT</a></li>

And here is my script:

function xmlRequest(target){
    var targetClick;
    targetClick = target;

    if (window.XMLHttpRequest) {
        xmlRequest = new XMLHttpRequest();
    }
    else{
        xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlRequest.open("GET", "targetClick"+".html?="+Math.random() , true);

    xmlRequest.onreadystatechange = function(){
    if (xmlRequest.readyState == 4 && xmlRequest.status ==200) {
            document.getElementById("midContainer").innerHTML = xmlRequest.responseText;
        }
    }

    xmlRequest.send();
}

Can anyone explain me my mistakes? Keep in mind that i'm junior Web Designer, so sorry for lame question.

xmlRequest(about) what do you expect about to be ? a string ? than it must be xmlRequest('about') — john Smith, Mar 01 '14 at 11:59
Stand on the shoulders of giants. Use a Javascript framework to protect your from these sorts of errors etc. jQuery is a fine example of one that helps you make AJAX calls and so so much more... A game changer. — Ted Johnson, Mar 01 '14 at 12:01
@TedJohnson: No. Neither does jQuery help you to prevent errors, nor is it necessary here. — Bergi, Mar 01 '14 at 12:01
@johnSmith Sure, i posted and didn't saw that, but in my code there is no such mistake. Here is bugreport: `XMLHttpRequest cannot load file:///C:/xampp/htdocs/fgtest/experimentals/zxc/about.html?=0.3899174148682505. Cross origin requests are only supported for HTTP. ` — Amal.A, Mar 01 '14 at 12:02
http://stackoverflow.com/questions/8449716/cross-origin-requests-are-only-supported-for-http-but-its-not-cross-domain in case it helps — juanrpozo, Mar 01 '14 at 12:04
@Amal.A you need to run this on a webserver, when using the "file://" protocoll youl get this error, additionally the url needs to be on the same host — john Smith, Mar 01 '14 at 12:08
@johnSmith i'm using XAMPP as webserver, for example if i call from html `xmlRequest()` without arguments and in javascript `xmlRequest.open("GET", "about.html?="+Math.random() , true);` error doesn't occur. So i don't think it is webserver error =/ — Amal.A, Mar 01 '14 at 12:12

score 0 · Answer 1 · answered Mar 01 '14 at 12:02

0

in you javascript call from HTML, about has to be defined as a String. So enclose it with signle quotes like this :

<li><a href="#" class="decorNavi" onclick ="xmlRequest('about')" >ABOUT</a></li>

Like you made it, about is supposed to be a JS variable, so it is undefined.

answered Mar 01 '14 at 12:02

Pascal Le Merrer

5,883
20
35

That was grammar mistake in question, in my code i did use single quotes. =) – Amal.A Mar 01 '14 at 12:04
check my answer, theres another error in your script – john Smith Mar 01 '14 at 12:05

score 0 · Answer 2 · answered Mar 01 '14 at 12:02

0

I'm pretty sure you've got an error because about is not defined. Shouldn't it be a string?

<li><a href="#" class="decorNavi" onclick ="xmlRequest('about');" >ABOUT</a></li>

answered Mar 01 '14 at 12:02

Oscar Paz

18,084
3
27
42

john Smith · Accepted Answer · 2014-03-01T12:09:11.037

you mixed up variables and string represantations of them, heres a corrected version

<li><a href="#" class="decorNavi" onclick ="xmlRequest('about')" >ABOUT</a></li>

so now youre passing a string as argument

function xmlRequest(target){

        var targetClick;

        //here you say the string argument now is called targetClick
        targetClick = target;

        if (window.XMLHttpRequest) {

            xmlRequest = new XMLHttpRequest();
        }

        else{
            xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
        }

        //in this line you concatinate the variable with another string, result is a string so you dont need to quote the variable, this wouldnt work
        xmlRequest.open("GET", targetClick+".html?="+Math.random() , true);


        xmlRequest.onreadystatechange = function(){

            if (xmlRequest.readyState == 4 && xmlRequest.status ==200) {

                document.getElementById("midContainer").innerHTML = xmlRequest.responseText;
            }
        }

    xmlRequest.send();
}

you need to run this on a webserver, when using the "file://" protocoll youl get a cross origin error, additionally the url needs to be on the same host

You were correct, my webserver went down, and sublimeText started to open files locally. Thanks a lot. — Amal.A, Mar 01 '14 at 12:19

score 0 · Answer 4 · answered Mar 01 '14 at 12:04

0

targetClick is variable now, it's not string so you sholud do

xmlRequest.open("GET", targetClick+".html?="+Math.random() , true);
//---should be without quotes--^

instead of

 xmlRequest.open("GET", 'targetClick'+".html?="+Math.random() , true);

answered Mar 01 '14 at 12:04

Suman Bogati

6,289
1
23
34

score 0 · Answer 5 · answered Mar 01 '14 at 12:05

0

You can't load a local file with XmlHttpRequest. Put those files in a local web server. Browsers won't allow this because, using this way, a remote site could access your local files, which can't be allowed.

answered Mar 01 '14 at 12:05

Oscar Paz

18,084
3
27
42

Your bug error says that you're attempting to load ile:///C:/xampp/htdocs/fgtest/experimentals/zxc/about.html?=0.3899174148682505. This is a local file. The browser only knows it is in a folder named 'xampp'. It won't load it using HTTP, so the call fails. – Oscar Paz Mar 01 '14 at 12:09
You were correct, i didn't do it manually but IDE i'm using did open it as local file and not as a file on server, thank you for your help – Amal.A Mar 01 '14 at 12:22

score 0 · Answer 6 · answered Mar 01 '14 at 12:17

0

Have you defined the about-object? Or do you wanted to give over a string like this:

<li><a href="#" class="decorNavi" onclick ="xmlRequest('about')" >ABOUT</a></li>

Note the calling of xmlRequest('about') with ' ' instead of xmlRequest(about).

answered Mar 01 '14 at 12:17

Andi

224
2
10

HTML doesn't call javascript function with required arguments

6 Answers6