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 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Jan 2010
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Setting the Hash Location of a Web Page with the onkeyup() event

    What I want is a textbox that the user can enter information into. When they press a key the onkeyup event will simulate a function. All that I can do. The function needs to automatically scroll down the page to the anchor that corresponds to the number the user entered.
    The web page is a factor finding program. You can enter 2 numbers and it finds all the factors of all the numbers between the 2 you entered. Here is the link: http://factorfinder.tumblr.com/
    As you can see, when you try to find factors of numbers a new window opens and there is a search box in the top left. Unfortunately, it doesn't work.
    If you want to check out the code look at the web page but here is the bit that creates the new window
    Code:
    function DisplayFactors(FactorsFound, Input, Maximum, ShowFactors, ShowPrimeFactors){
    FactorsWindow = window.open("", "", "location = no, menubar = no, personal = no, scrollbars = yes, status = no, toolbar = no, resizable = no, width = 580%, height = 600%, left = 720%, top = 100%")
    	FactorsWindow.document.write("<div id = 'TheHeader' style = 'position: fixed; left: 0; top: 0; width: 100%; height: 15%; z-index: 2; background-color: white; border-bottom: 3px dashed black;'><table style = 'position: relative; left: 2%; top: 25%; font-size: 24px; font-weight: bolder; text-decoration: underline;'><tr><td>The Factor Finding Window</td></tr></table><table align = 'right' style = 'position: relative; top: -25%;'><tr><td>Search For The Number:</td></tr><tr><td><input type = 'text' id = 'SearchNumber_txt' maxlength = '12' onkeyup = 'opener.Search()'/></td></tr></table></div>")
    	FactorsWindow.document.write("<div id = 'TheBody' style = 'position: absolute; left: 0; top: 20%; width: 100%; height: 80%; z-index: 1; background-color: white;'>")
    }
    function Search(){
    	FactorsWindow.location.hash = "#Factor" + FactorsWindow.document.getElementById("SearchNumber_txt").value
    	//This is the bit I need to change because it currently doesn't work
    }
    also, this is the bit where I place the anchors in the array
    Code:
    FactorsFound.push("<a name = 'Factor'" + Input2 + "><b>The Factors of " + Input2 + " are:</b></a><p style = 'margin: 0, 0, 25px, 0; position:relative; left:20px;'>")
    Ultimately I need it so that when the onkeyup event is triggered it scrolls down the window to the anchor that corresponds to the number entered.

    I will validate the numbers entered after I find out how to do it. I mean, If the user enters the number 9 and the Factor Window is only displaying numbers 2 - 6, then I'll add an alert message or something. I'll cross that bridge when I get to it.

    I couldn't find this anywhere on the internet.
    Last edited by Michael_; 08-10-2010 at 10:58 PM.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Pure guess.

    Try this:
    Code:
    function Search(){
    	location.href = "#Factor" + document.getElementById("SearchNumber_txt").value
    }
    Put that code into the popup, not the main window, and try it.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    New to the CF scene
    Join Date
    Jan 2010
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    location.href = "#Factor" + document.getElementById("SearchNumber_txt").value
    didn't work
    But maybe it's because I can't put it in the pop up window. I tried placing some Javascript in the pop up window and the whole web page crashed. I can still refer to it using the opener method though.
    Is my problem something to do with the code I use to set the anchor? I use:
    Code:
    FactorsFound.push("<a name = 'Factor'" + Input2 + "><b>The Factors of " + Input2 + " are:</b></a><p style = 'margin: 0, 0, 25px, 0; position:relative; left:20px;'>")
    Does this definately create an anchor with the name "#Factor" + Input2
    Input2 is a number that increments by 1 each time the loop is executed.

    I don't think it is the creating of the anchors, but could someone please confirm that thought for me.
    Also, I tried reloading the page, but that doesn't work because the page was created by javascript. Would reloading the page, by running the DisplayFactors function work because then I could link to the anchor. I have made links before that do this.
    Here is the full DisplayFactors function.
    Code:
    function DisplayFactors(FactorsFound, Input, Maximum, ShowFactors, ShowPrimeFactors){
    	//                        Instead of opening the window here, could I open it at the end after everything has been placed in the window, then I could open it to the anchor.
    	FactorsWindow = window.open("", "", "location = no, menubar = no, personal = no, scrollbars = yes, status = no, toolbar = no, resizable = no, width = 580%, height = 600%, left = 720%, top = 100%")
    	FactorsWindow.document.write("<div id = 'TheHeader' style = 'position: fixed; left: 0; top: 0; width: 100%; height: 15%; z-index: 2; background-color: white; border-bottom: 3px dashed black;'><table style = 'position: relative; left: 2%; top: 25%; font-size: 24px; font-weight: bolder; text-decoration: underline;'><tr><td>The Factor Finding Window</td></tr></table><table align = 'right' style = 'position: relative; top: -25%;'><tr><td>Search For The Number:</td></tr><tr><td><input type = 'text' id = 'SearchNumber_txt' maxlength = '12' onkeyup = 'opener.Search()'/></td></tr></table></div>")
    	FactorsWindow.document.write("<div id = 'TheBody' style = 'position: absolute; left: 0; top: 20%; width: 100%; height: 80%; z-index: 1; background-color: white;'>")
    	FactorsWindow.location.hash += "#Top"
    	if(ShowFactors){
    		if(Input == Maximum){
    			FactorsWindow.document.write("<title>Factors of " + Input + "</title>")
    		}else{
    			FactorsWindow.document.write("<title>Factors of Numbers Between " + Input + " and " + Maximum +"</title>")
    		}
    		FactorsWindow.document.write(FactorsFound.join("<br />"))
    	}else{
    		if(ShowPrimeFactors){
    			FactorsWindow.document.write("<title>Prime Factors Of " + Input + "</title>")
    			FactorsWindow.document.write(FactorsFound.join(""))
    		}else{
    			FactorsWindow.document.write("<title>Prime Numbers Between " + Input + " and " + Maximum + "</title>")
    			FactorsWindow.document.write(FactorsFound.join("<br />"))
    		}
    	}
    	FactorsWindow.document.write("</div>")
    }
    I'm as confused as my answer is to read.

  • #4
    New to the CF scene
    Join Date
    Jan 2010
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have to use location.hash = whatever because the window that opens doesn't have it's own web address. Is it possible to give it one? With
    Code:
    //                                         In one of these two?
    FactorsWindow = window.open("", "", "location = no, menubar = no, personal = no, scrollbars = yes, status = no, toolbar = no, resizable = no, width = 580%, height = 600%, left = 720%, top = 100%")
    If it is please say how

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    I guess what I would do is completely change how you are doing this.

    Instead of creating the contents of the popup from the main window, I'd create a *SEPARATE* HTML page for the popup and I would *PASS* the arguments from the main window to it, in the query string as part of its URL. Then in the popup I parse the arguments and create the contents. This means that all the needed JS code can already be there in the HTML for the popup.

    Though it means a rewrite, it's actually a much simpler rewrite.

    Up to you.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #6
    New to the CF scene
    Join Date
    Jan 2010
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    So if I do make the pop up window a html file how would I add to it. Also, I will have to upload the html to a different site and then load it from that because the thing I use .tumblr, it's more of a blogging thing. But I like it because it's easy and there's no ads. I think it would just be easier to do the javascript.

  • #7
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Ugh...that last requirement (that the page be hosted elsewhere) is a real killer. It means you can use cross-page scripting because it would then be cross-site.

    I'm not sure where to go with this. Sorry.

    Best I could suggest would be to have a series of <a> links, one per number, and let the user click on them to jump to the appropriate spot.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Tags for this Thread

    Posting Permissions

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