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
    Regular Coder
    Join Date
    Jul 2003
    Posts
    600
    Thanks
    17
    Thanked 0 Times in 0 Posts

    Check Value / Set HTML Anchor on Page Load

    Hey All,

    I've got an older JS page that has several buttons on it to dynamically add and remove sections to a page for editing. Each button click for this submits the form and reloads the page, to the top - well off where the section was just added or deleted. What I want to do is have the page go down to that new section once the page is loaded, which I anticipate doing with anchors. However with the page loading/refreshing every time a section is added or deleted, this makes things a little more difficult.

    The JS functions I have now look something like this:

    Code:
    function add(){
    		document.forms[0].process.value = 'add';
    		document.forms[0].submit();
    	}
    
    function delete(){
    		document.forms[0].process.value = 'delete';
    		document.forms[0].submit();
    	}
    On the page load, I could check what value was submitted ('add' or 'delete' here) and then based on that, move the page down to where an anchor is set on it. Does that seem feasible?

    There are a number of functions like this scattered throughout multiple pages, so I can't redo it all, adding and removing sections dynamically, unfortunately.

    Any suggestions would be greatly appreciated.

    Thanks.

  • #2
    Regular Coder
    Join Date
    Mar 2008
    Location
    London
    Posts
    152
    Thanks
    4
    Thanked 42 Times in 42 Posts
    try to set focus on the element that has been added dynamically. It should work...

  • #3
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    If you're using jQuery, you can dynamically find the last element and scroll to it.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #4
    Regular Coder
    Join Date
    Jul 2003
    Posts
    600
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by WolfShade View Post
    If you're using jQuery, you can dynamically find the last element and scroll to it.
    The page isn't using jQuery, that's part of the problem. It would have to be rewritten otherwise.

    The page reloads after something has been added/removed, so checking the status on the reload is the tricky part.

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,592
    Thanks
    0
    Thanked 644 Times in 634 Posts
    Simply give each form an id - that makes it easier to reference the fields in the form and also provides an anchor point to link back to afterwards.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #6
    Regular Coder
    Join Date
    Jul 2003
    Posts
    600
    Thanks
    17
    Thanked 0 Times in 0 Posts
    Okay, thanks so far guys. With using old-school Javascript, window.hash doesn't work in IE7 which is a problem. So I'm trying to do this in Prototype now (still can't use jQuery). I have a function that will scroll on click, but I can't get it working dynamically when the page loads. Does anyone see what I might need to make this work?

    Code:
    Event.observe(window, 'load', function() {
    	$$('a[href^=#]:not([href=#])').each(function(element) {
    		element.observe('click', function(event) {
    			new Effect.ScrollTo("newID_1");
    			Event.stop(event);
    		}
    		.bindAsEventListener(element))
    	})
    })
    Thanks a bunch for any suggestions.

  • #7
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,592
    Thanks
    0
    Thanked 644 Times in 634 Posts
    There's no such thing as window.hash = the field you are after is location.hash
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

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