0

I am working on a page that is basically a long form, with tables of info followed by a submit button after each table.

The form submits to itself and changes the info in the tables based on user input.

What I would like to do is have the page jump to "Section X" if "Submit Button X" is pressed, jump to "Section Y" if "Submit Button Y" is pressed, etc.

I'm currently using this Javascript in the head of the doc to try and accomplish this:

<script type="text/javascript">

var anchors = new Array(

<?php 
for($i = 0; $i < 13; $i++) {
    $anchors =  "\"$divTag[$i]\"";
    if($i < 12) {
        $anchors .= ", ";
    }
    echo $anchors;
} ?>

)

function jumpToAnchor() {

    <?php if(isset($_POST["submit_fjw"])) { ?>

    window.location = String(window.location).replace(/\#.*$/, "") +
    "#" + anchors[0];

    <?php } if(isset($_POST["submit_jwl"])) { ?>

    window.location = String(window.location).replace(/\#.*$/, "") +
    "#" + anchors[1];

    <?php } ?>
}

It works... kinda. It doesn't jump on the first press of the Submit button, but the second.

I'm open to suggestions... less Javascript is better, because my Javascript skills are weak at best. Could I use a variable tied to the submit button that will pass a value to the PHP script and correctly jump to the right section?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Tim Andrick
  • 51
  • 1
  • 5
  • Did you try wrapping your logic inside `window.onload = function(){ ... };`? – Salman A Sep 09 '12 at 19:04
  • @Salman A No I had not tried that... just did it and it works well. thank you for pointing a JS hack like me in the right direction. Perfect! – Tim Andrick Sep 09 '12 at 19:11
  • Take a look at the answer here: http://stackoverflow.com/questions/8731653/submit-form-to-another-page-which-is-different-from-the-page-used-in-action – besimple Aug 17 '15 at 20:38

2 Answers2

1

Have you tried something like this?

<form action="thisfile.php#section2" name="form1" ... >
....
</form>

<a name="section2">
<form action="thisfile.php#section3" name="form2" ... >
....
</form>

<a name="section3">
<form ....

when form1 is submitted, file reloads and automaticly goes to anchor named section2, when form2 is submitted, it scrolls to section3, etc

Ian
  • 21
  • 2
  • Thanks Ian. I had thought of that, but the page is one long form. Do not really want to split it into multiple forms. – Tim Andrick Sep 09 '12 at 19:10
0

May be you find more convenient to use http://www.w3schools.com/html/html_links.asp (section HTML Links - The name Attribute) instead javascript? Just a suggestion.

Max Kuznetsov
  • 156
  • 4
  • Hmm ... wikipedia uses the neat little trick of providing the id in the url to "jump" to a certain section. Not names though as they are not unique. – TigOldBitties Sep 09 '12 at 18:58
  • @TigOldBitties That's basically what I am doing. each table on the form is inside a div with an id that is the same as corresponding array index in the anchors var in the javascript. – Tim Andrick Sep 09 '12 at 19:05
  • 1
    Then you don't need any javascript. Adding #comment-16569568 to the url of this page will set your comment into view. It's a browser feature implemented since html has been around – TigOldBitties Sep 09 '12 at 19:09
  • Tim, you can put a hidden anchor like in a place where you want to send user to and then use or just "a"-tag without "button"-tag. – Max Kuznetsov Sep 09 '12 at 19:16
  • @TigOldBitties Yes, if I wanted to hard code 13 submit buttons, I could easily append the #bluh to the end of the URL. All of my submit buttons are created by calling one PHP function though, so the point was to know "where" in the form the click came from w/out hard coding a bunch of submits. Sorry I probably should have been more specific. – Tim Andrick Sep 09 '12 at 19:25