...

View Full Version : Resolved Javascript OOP question - Not able to use DOM to grab form name



qrubra
10-08-2008, 10:19 PM
I'm working on a multiple-choice question as a javascript OOP exercise, and hope to use it in some online courses being developed. I haven't done much OOP I'm having a problem figuring out, in Javascript, how to reference my written form from my checkitMC function. It's coming up NULL and I'm trying to grab the form name via DOM so I can check through the answers. I figure it's something easy that I've missed, but I've looked and tried several things which haven't worked.

I have attached my file (just change txt to html) and the issue is specifically with line 35, but calling the checkitMC() function is also probably an issue.

If anyone would be kind enough to check, I would appreciate comments. Thanks.

Basscyst
10-08-2008, 10:45 PM
Call the script from an onload event:



window.onload=function(){
var newTest = new test('quack', 'http://www.google.com', 'http://www.yahoo.com', 'this is correct');
newTest.writeQuestStart('this is a test');
newTest.writeChoice('choice 1', 'correct');
newTest.writeChoice('choice 2', 'wrong');
newTest.writeQuestEnd();
}

qrubra
10-08-2008, 11:39 PM
Thanks Basscyst, for your quick reply. I was hoping I could avoid using a window.onload event because in the pages I may use this in eventually, we have alot for our window.onload event to do already. Also, I would like the modularity to be able to place this object anywhere in a page and was hoping to avoid the onload event in general.

Any other thoughts? Thanks for your help.

Basscyst
10-08-2008, 11:47 PM
Well you can't access the DOM before it's loaded, so no not really any alternative. This bit of code will add a load event without removing existing load events. All load events are still fired just like they were all in a single window.onload, but you can keep this load event separate so that it can be placed into the JS file containing the script it is applicable to.



//*******************************************************
// Adds an onload event without removing declared load events
//*******************************************************
function addLoadEvent(func){
var oldonload=window.onload;
if(typeof window.onload!='function'){
window.onload=func;
}else{
window.onload=function(){
if(oldonload){
oldonload();
}
func();
}
}
}



addLoadEvent(function(){
var newTest = new test('quack', 'http://www.google.com', 'http://www.yahoo.com', 'this is correct');
newTest.writeQuestStart('this is a test');
newTest.writeChoice('choice 1', 'correct');
newTest.writeChoice('choice 2', 'wrong');
newTest.writeQuestEnd();
});

qrubra
10-09-2008, 12:05 AM
Basscyst, you're right of course and I appreciate your explanation. Sorry. However, I'm trying to get at the DOM from the check function which should be triggered when a user hits the "check" button. Shouldn't everything in the page be loaded already by that point? I guess my problem is really how to access the form through the check function.

Maybe I don't realize what I'm trying to ask...

Thanks for helping me with this.

rnd me
10-09-2008, 12:24 AM
you had a simple bug.

you were invoking the function as it was printing, not later when clicked.



this.writeQuestStart = function(quest){
document.write(quest + "<br /><form id='"+ this.formname +"' name='"+ this.formname + "' onSubmit='this.checkitMC()' action='OOP Test 2.html'><table border='0' cellspacing='6' cellpadding='0'>");
}

Basscyst
10-09-2008, 12:38 AM
Basscyst, you're right of course and I appreciate your explanation. Sorry. However, I'm trying to get at the DOM from the check function which should be triggered when a user hits the "check" button. Shouldn't everything in the page be loaded already by that point? I guess my problem is really how to access the form through the check function.

Maybe I don't realize what I'm trying to ask...

Thanks for helping me with this.

Nah, I just didn't look at your code very thouroughly and went off the description of the problem. Seems rnd may have you covered.

qrubra
10-09-2008, 12:43 AM
Thanks to you both. rnd me had it covered. Yes, it was a simple bug and i just didn't see it. Geez. Very silly, but I appreciate it.

Thanks.

qrubra
10-09-2008, 02:04 PM
Sorry to bother either of you again, while the problem found by rnd me was a mistake, it didn't solve my larger problem. Apparently, i'm just not creating the method checkitMC in the object correctly, because if I call it from anywhere in the object, it isn't recognized as a function. I've gotten everything to work correctly, except this.

Do I need to create this as a function outside of the object, or is there some way to encapsulate this within the object along with everything else? That's the goal anyway.

rnd me
10-09-2008, 03:59 PM
i was wondering about that.

the problem is that "this" in your object refers to the object, while "this" in the form's submit event refers to the form.

what to do about it?

well, since you print the form, you need to connect the object instance to the form.
you could tuck an array or instances into the constructor, or create an object link upon calling the start method.

my laptop battery is dying, so i have to go.
i can whip some code up for you when i get home.

qrubra
10-09-2008, 04:37 PM
rnd me,

Thanks, yes I see what you mean and understand what needs to happen now, but am confused on the syntax for javascript objects. I would appreciate your help. It seems really useful to use OOP in javascript, so thanks for helping me troubleshoot my learning.

The object link on starting the question seems the most understandable. I'll see what I can do.

qrubra
10-09-2008, 05:06 PM
rnd me,

Thanks, I think I got it. I just added the object name to the list of properties I read in when I define the new object instance. From there, I just attached that name to the checkitMC function. I didn't want to have an action for the whole page, so I put the link to the checkitMC function in the button using the javascript pseudo-protocol, and it seems to work just fine.

I consider this problem solved, but don't see a spot to mark this thread as such in the reply area...

Thanks!

rnd me
10-09-2008, 09:39 PM
hey, no prob. sorry i couldn't explain the solution further.

yeah, you need some way to refer to the function using the printed code.
sounds like you figured out a way.
glad to be of use.

cheers.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum