Clever Geek Handbook

Javascript not working, no errors

I have the following javascript code that loads without error, however the refresh function doesn't actually look functional as get_Records.php never gets loaded. I cannot check if get_auction.php is loaded as it is being loaded from get_records.php

One of my main problems is that I am doing the wrong thing by having update () to input pk and query parameters, as only one of them will ever be used. This looks like a bad hack and bad logic, but I don't know a better way.

Here is the code

var xmlHttp
var layername
var url

function update(layer, part, pk, query) {
    alert ("update");
    if (part=="1") {
        alert ("part 1");
        url = "get_auction.php?cmd=GetAuctionData&pk="+pk+"&sid="+Math.random()
    } else if (part=="2") {
        alert ("part 2");
        url = "get_records.php?cmd=GetRecordSet&query="+query+"&sid="+Math.random()
    }
    xmlHttp=GetXmlHttpObject()
    if(xmlHttp==null) {
        alert("Your browser is not supported?")
    }
    xmlHttp.onreadystatechange = function() {
        if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
            document.getElementById(layer).innerHTML=xmlHttp.responseText
        } else if (xmlHttp.readyState==1 || xmlHttp.readyState=="loading") {
            document.getElementById(layer).innerHTML="loading"
        }
    };
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null)
}

function GetXmlHttpObject() {
    var xmlHttp=null;
    try {
        xmlHttp = new XMLHttpRequest();
    } catch (e) {
        try {
            xmlHttp =new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {}
    }
    return xmlHttp;
}

function makewindows() {
    child1 = window.open ("about:blank");
    child1.document.write(<?php echo htmlspecialchars(json_encode($row2["ARTICLE_DESC"]), ENT_QUOTES); ?>));
    child1.document.close(); 
}

I have placed alert statements in the update function and no one shows up indicates that the update function is never called?

I don't want and cannot use the framework, and I don't have access to using firebug, so please don't suggest these things. I know about them and use them when I can.

I would also like to know if calling php from within makewindows () is preferable so that makewindows just take a parameter .. is there any advantage or disadvantage for each approach?

I seem to get an error when I try to call a function, this is how I do it in PHP:

echo "<li><a href='#' onclick=update('Layer3','2','0','hello')'>Link 1</a></li>" .

which makes this html to be accurate? "\ n";

<li><a href='#' onclick='update('Layer3','2','0','hello')'>Link 1</a></li>

edit: I took tester101's advice and changed it to this:

echo '<li><a href="#" onclick="update(\'Layer3\',\'2\',\'0\',\'hello\')">Link 1</a></li>' . "\n";

Which still gives an error. I will probably go back to using toms answer, but would like to know why this is not working.

0


source to share


8 answers


You can just take Url as an update () parameter, then you don't need to create the url inside, and you don't need "optional" parameters

Edit (reply to comment)

If you have an update () function that just takes the url and element id (layer) and updates it based on the result of the AJAX call, you can do something like this to remove the need for additional parameters and use the function to do two different things.

function update(layer, url) {
    var xmlHttp=GetXmlHttpObject(); //you have this defined elsewhere

    if(xmlHttp==null) {
        alert("Your browser is not supported?");
    }

    xmlHttp.onreadystatechange = function() {
        if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
            document.getElementById(layer).innerHTML=xmlHttp.responseText;
        } else if (xmlHttp.readyState==1 || xmlHttp.readyState=="loading") {
            document.getElementById(layer).innerHTML="loading";
        }

       //etc
    }

    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);
}


function updateByPk(layer, pk) {
   url = "get_auction.php?cmd=GetAuctionData&pk="+pk+"&sid="+Math.random();
   update(layer, url);
}


function updateByQuery(layer, query) {
   url = "get_records.php?cmd=GetRecordSet&query="+query+"&sid="+Math.random();
   update(layer, url);
}

Then call either depending on what you want to do:

updateByPk('id_of_div', 2);


or

updateByQuery('id_of_div2', 'query');

eg. in HTML

<a href="#" onclick="updateByQuery('Layer3', 'hello');">Link 1</a>

or to create this in PHP

<?php echo '<a href="#" onclick="updateByQuery(\'Layer3\', ' . json_encode($query) . ');">Link 1</a>';
0


source


If you can use Firefox and reproduce the error, I would highly recommend using Firebug as it is very easy to use and scripting, set breakpoints, etc. Plus, instead of using "warning" statements, you can use things like console.info("unexpected value x=%o", some_object);

, and it will log the value to the console (including the # line), which you can check later without interrupting your script.



edit: in fact, if you are using PHP on the server, you can use FirePHP to help debug on the client.

+2


source


Have you verified that the PHP code is returning something sane? (I assume you can view your html source code.)

Use a good debug answer: embed warnings (for example windows.alert("GetXmlHttpObject started.");

) in your code to make sure you reach them.

JSLint can help you. I tried this and didn't find anything really wrong.

0


source


If you can open your page in Firefox I would check the error console (csJ). This helped me find many, many typos.

Also, your code is missing many semicolons. Maybe some of them are optional, but ...

0


source


As far as your problems go, as far as I know JavaScript doesn't complain unless you give it all the arguments.

eg

function myFunction(var1, var2, var3, var4){

calling this function, for example:

myFunction('test1','test2');

does not raise an error.

It's like setting the default next to the argument, default in javascript to null or undefined.

You can check this by checking the box:

if(null != var3){

Perhaps you clean up this function a bit; Also you can put together a little ajax class from the web that will strip your javascript a bit. There are many wrapping functions that encapsulate the xmlHttpRequest object, allowing cross-browser use with the same results.

Let me know if you need help. I have some confidence that if you find some pre-built ajax methods ( jQuery has great functionality!) The task you are trying to achieve will be much easier.

0


source


Incompatible parentheses in

child1.document.write(<?php echo htmlspecialchars(json_encode($row2["ARTICLE_DESC"]), ENT_QUOTES); ?>));
0


source 



onclick=update('Layer3','2','0','hello')'>Link 1

I don't know if this is a typo, but this line should be


onclick="update('Layer3','2','0','hello')">Link 1



 This code will throw errors and never trigger an update, because the single quote after onClick = ends in ("Use double quotes".


onclick='update('Layer3','2','0','hello')'>Link 1
0


source


Maybe too many new lines?

In most languages, you have either a newline as a command separator or ";". In JavaScript, you have both: a newline sometimes works like ";"

Try this, see if it helps:

function update(layer, part, pk, query) {
   alert ("update");
   if (part=="1") {
      alert ("part 1");
      url = "get_auction.php?cmd=GetAuctionData&pk="+pk+"&sid="+Math.random()
   } else if (part=="2") {
      alert ("part 2");
      url = "get_records.php?cmd=GetRecordSet&query="+query+"&sid="+Math.random()
   }
   // and so on...
}

The only difference is the formatting: the opening of curly is on the same line as its construct ("if", "else", "function", ...).

0


source






More articles:


All Articles