therschbach Posted March 7, 2009 Share Posted March 7, 2009 I noticed that the middle argument has to have quotations. What if I want the document to be a variable depending on what button I push? Let's say I have 10 buttons that will load different stuff into the page via AJAX, I dont' want to have to make 10 different functions that basically do the same thing.So when I do.... <img id="button1" src="pictures/button1.jpg" alt="Home" onClick = "ajaxFunction()"> ...in my html, I was thinking I could pass a variable..... <img id="button1" src="pictures/button1.jpg" alt="Home" onClick = "ajaxFunction(archive)"> and then do this in the script.... ajaxFunction(buttonID){etc etc...AJAX: xlmHTTP.open("GET", buttonID+".html", true); The problem is, it seems that the middle argument that points to the file to be loaded, has to be in quotations. If I put buttonID in quotations, then it will try to load buttonID.html. So how can I get the buttonID variable into the argument? Link to comment Share on other sites More sharing options...
jeffman Posted March 7, 2009 Share Posted March 7, 2009 I'm a little confused. You literally want the button id (a useful way to do something) or something to do with this 'archive' word? If the former, try this:onclick = "ajaxFunction(this.id)"The middle parameter is just a string. You can pass it as a variable, a string literal (in quotes), or a combination -- so the way you're building the string will work just fine. Link to comment Share on other sites More sharing options...
therschbach Posted March 7, 2009 Author Share Posted March 7, 2009 I'll try to clarify.I have a button that, when pressed, I want it to run ajaxFunction(page1). Another button I want to run ajaxFunction(page2). This way, each button is running the same script, but with a different variable which would call different pages. So if ajaxFunction() recieves the variable page1 or page2 as pageID, then I can use xlmHTTP.open("GET", pageID+".html", true); and it will call up page1.html or page2.html.However, using your method of passing this.id works as well. I just have to id the button as the page I want to pull up which is no big deal. However, I cannot substitue this.id for page1 or "page1". Both give different errors. I think I understand why page1 doesn't work, because I haven't declared it as anything. But I don't know why I can't pass "page1" as it's just a string. Link to comment Share on other sites More sharing options...
jeffman Posted March 7, 2009 Share Posted March 7, 2009 If I understand, there's always this:onclick = "ajaxFunction('page1')"It's not my preference, because I don't like passing literals if I can help it. For that matter, I don't like assigning handlers in the tag. But that's me.If it doesn't work, post more code? There's something I'm missing. Link to comment Share on other sites More sharing options...
therschbach Posted March 7, 2009 Author Share Posted March 7, 2009 Ok, here's the snippet of code for my menu bar that contains the buttons using your method. function ajaxFunction(buttonID){var xmlHttp;try{ // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest();}catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); }catch (e) { try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser does not support AJAX!"); return false; } } } xmlHttp.onreadystatechange=function() { if(xmlHttp.readyState==4) { document.getElementById("main").innerHTML = xmlHttp.responseText; } } xmlHttp.open("GET",buttonID+".html",true); xmlHttp.send(null); } The pages to be loaded, current.html and december08.html are just text with some html tags.As it stands, this code works as I want it to. However, I do need to understand why my other method wouldn't work too because from what I understand from your input, it should. I cannot pass a string or a variable using the onclick. For example, instead of onclick="ajaxFunction(this.id)", I tried onclick="ajaxFunction("december08")" and it didn't work.Also, as it is, nothing is in the main page until I click a button to populate it. So at the top of the javascript I added... window.onload="ajaxFunction("december08")";function ajaxFunction(buttonID){var xmlHttp;tryetc..... This also seems like it should work but it doesn't. So there is something fundamentally wrong with the way I understand how to pass variables into functions. Link to comment Share on other sites More sharing options...
jeffman Posted March 7, 2009 Share Posted March 7, 2009 onclick="ajaxFunction("december08")"window.onload="ajaxFunction("december08")";I copied and pasted those right out of your message. Assuming they're accurate, your double quotations are nested. You need "ajaxFunction('december08')" . I'm just reminding you of this, right? :)There is nothing in this that shouldn't work, if buttonID is a correctly formed string.xmlHttp.open("GET",buttonID+".html",true);What kind of error messages have you been getting? Any hints there? Link to comment Share on other sites More sharing options...
therschbach Posted March 8, 2009 Author Share Posted March 8, 2009 Ok, IE7 can die.window.onload = ajaxFunction("current");This works in Opera and FF. It does not work in IE7 and I get a "Done but with errors on page."You can look at it at Dirtjournal2. I really need this to be IE7 compliant as well. Any ideas? Link to comment Share on other sites More sharing options...
jeffman Posted March 8, 2009 Share Posted March 8, 2009 Hah! The funny thing is that it does work in FF etc. It shouldn't, but maybe those guys have loosened this thing up.You can assign an event handler a reference to a function, or a string of javascript that includes a function. Normally, when you pass a function and some parameters in the parentheses, you have to pass it in a string, not by reference. Passing by reference looks like this:window.onload = ajaxFunction;Try this: window.onload = 'ajaxFunction("current")'; Link to comment Share on other sites More sharing options...
therschbach Posted March 8, 2009 Author Share Posted March 8, 2009 Hmm, that broke it completely in all 3 browsers. I'm looking at Firebug but I don't know what it's supposed to tell me. I don't see any red flashing lights or hear any klaxon horns indicating a problem. Link to comment Share on other sites More sharing options...
jeffman Posted March 8, 2009 Share Posted March 8, 2009 I don't know either. I'm addicted to beta versions, and Firebug doesn't work in Firefox beta.Anyway, I downloaded all your stuff. I'm really not sure why the onload handler isn't working with the string. The good news is that it still works with a function pointer. So pass it this anonymous function, and you should be good. It works in FF, Safari, and Opera. I haven't tested in in IE, but I have confidence, because this is my habitual way of assigning event handlers that require arguments. window.onload = function () { ajaxFunction("current");} Link to comment Share on other sites More sharing options...
therschbach Posted March 8, 2009 Author Share Posted March 8, 2009 Yup, that works! Thanks! I'm sure I'll be back soon with another Q & A session. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.