Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

how do i make the page stay in same position 1

Status
Not open for further replies.

benedictbutlin

Technical User
Oct 12, 2012
16
GB
I'm not very knowledgeable with javascript.i'd found this code that allows me to add additional input fields to my form. works great but when i click the link to add fields the page scrolls goes back to the top and doesn't stay in it's same position. how would i modify the code to make the page stay where it is?

javascript...

Code:
<script type="[URL unfurl="true"]http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>[/URL]
<link rel="stylesheet" type="text/css" href="css/css.css" />
<script type="text/javascript">
var count = 0;
$(function(){
$('p#add_field').click(function(){
count += 1;
$('#container').append(
'<div id="field_holder">'
+ '<div id="field_name" <?PHP echo $form_lengthA; ?>>Parameter #' + count + '</div>' 
+ '<div id="field_input" <?PHP echo $form_lengthB; ?>><input <?PHP echo $form_lengthB; ?> type="text" id="field_' + count + '" name="fields[]' + '" ></div>' );
+'</div>'
});
});
</script>

here's the form input/ div
Code:
echo'<div id="container">';
echo '<div id="field_holder">';
echo '<div id="field_name" '.$form_lengthA.'>(empty fields are ignored)</div>';
echo '<div id="field_input" '.$form_lengthB.'>';
echo'<p id="add_field"><a href="#"><span>+ more fields </span></a><br></p>';
echo'</div>';
echo'</div>';
echo'</div>';
 
Don't use a anchor element to run the code.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
you could attach the event to the span?

Or if you really want it to be an anchor, turn the JQuery 'add click event' to a normal function and use the 'javascript' protocol for the anchor's href

Code:
<a href="javascript:myFunction();">

"In complete darkness we are all the same, it is only our knowledge and wisdom that separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"

Free Dance Music Downloads
 
Its bad practice to use the javascript protocol in a link.

Personally I would just remove the link. You really aren't using it anyway, and it just causes the page to move, because it executes the #.

This should work the same minus the page movement.
Code:
echo'<p id="add_field"><span style="cursor:pointer;">+ more fields </span><br></p>';


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
having done a quick Google,
It seems inline anything is now considered bad, so
Code:
style="cursor:pointer;"
should not be used either.

Everything should be in its own separate file:- JS / CSS / HTML!


"In complete darkness we are all the same, it is only our knowledge and wisdom that separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"

Free Dance Music Downloads
 
Since IE6. Because it caused some issues with it.

It also does not decay gracefully. so if Javascript is turned off your link will do nothing. Or open an error page.

Additionally the onclick event exists for just that purpose, and when correctly used can control whether the link is followed after the JS is done or not.

Basically, the pseudo protocol is just not a clean way of executing JS.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
You make a good point. [thumbsup] about the inline stylings. [blush]

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top