Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Javascript OOP question - Not able to use DOM to grab form name

    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.
    Attached Files Attached Files
    Last edited by qrubra; 10-09-2008 at 08:20 PM.

  • #2
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    Call the script from an onload event:

    Code:
    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();
    }
    Helping to build a bigger box. - Adam Matthews

  • #3
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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.

  • #4
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    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.

    Code:
    //*******************************************************
    // 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();
    		}
    	}
    }
    Code:
    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();
    });
    Last edited by Basscyst; 10-08-2008 at 11:51 PM.
    Helping to build a bigger box. - Adam Matthews

  • Users who have thanked Basscyst for this post:

    qrubra (10-09-2008)

  • #5
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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.

  • #6
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,296
    Thanks
    10
    Thanked 584 Times in 565 Posts
    you had a simple bug.

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


    Code:
    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'>");
    	}
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • Users who have thanked rnd me for this post:

    qrubra (10-09-2008)

  • #7
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    Quote Originally Posted by qrubra View Post
    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.
    Helping to build a bigger box. - Adam Matthews

  • #8
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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.

  • #9
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Another question

    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.

  • #10
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,296
    Thanks
    10
    Thanked 584 Times in 565 Posts
    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.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #11
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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.

  • #12
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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!

  • #13
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,296
    Thanks
    10
    Thanked 584 Times in 565 Posts
    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.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •