Using image as a submit button

Craig82

Hi,

I changed a submit button to an image type and it seems to have broken my jump box function.

Example:

<script type="text/javascript">
function LinkUp() 
{
var number = document.jump.user_site.selectedIndex;
location.href = document.jump.user_site.options[number].value;
}
</script>

<form name="jump" action="">
<p>
<select name="user_site">
<option value="index.php" selected>Jump to...</option>
<option value="index.php#area1">Area 1</option>
<option value="index.pho#area2">Area 2</option>
</select>

<input type="image" src="../images/input.png" style="border:0;width:24px;height:24px;background-color:transparent;padding:0;margin-bottom:-0.6em" alt="Go" name="Go" title="Go" onClick="LinkUp()">
</form>

I'm pointless at javascript 😕, can anyone help? Would greatly appreciate it.

Thanks.
Craig.

johanafm

And it has nothing to do with index.pho?

<option value="index.pho#area2">Area 2</option>

Craig82

johanafm;10928342 wrote:
And it has nothing to do with index.pho?
<option value="index.pho#area2">Area 2</option>

No. That was a typo lol I have php code in my option values and they're correct. I simply used area for easier viewing here.

Here's what is put into the browser when you click:

http://www.example.com/?user_site=index.php%3Fpage%3D1%26sort%3D%23area1&x=15&y=15

Any ideas? 😕 It was fine when I had a submit button.

Thanks
Craig.

Craig82

...?user_site=index.php%3Fpage%3D1%26sort%3D%23area1&x=15&y=15

No edit button :glare:

johanafm

I don't know what you're trying to achieve since it seems to be working fine to me.

If you'd add this to the end of your script

if (isset($_GET['user_site'])) {
	if ($_GET['user_site'] == 'index.php#area1')
		echo "area 1";
	if ($_GET['user_site'] == 'index.php#area2')
		echo "area 2";
}

you'd see "area 1" or "area 2" on the screen if either of those was selected when hitting the button, and no output if neither was selected.

Craig82

Hi,

Thanks for your reply. It's a URL jump box. So basically, you select a program from the drop down menu and when you press submit it takes you to that program on the page. It broke since I changed the submit button to an image submit and I don't know why.

Thanks.
Craig.

Craig82

Sorry for extra post, if it's allowed you can see the Jump Box on this page:

h**p://denarnovice.si/en/

Where it says 'Jump to...'

Thanks again.
Craig.

johanafm

Oh, that's because an image works like a submit input element. They both normally submit the form, as opposed to a button which doesn't.

<form ... onsubmit="return false;">

Also, you don't have to get the selectedIndex of the select box and then use options[] with that. The value of the select element is always the same as the value of the selected option. At least when not dealing with multiple select boxes.

location = document.jump.user_site.value;

Craig82

Thanks johanafm, I made the changes you suggested and it now works.

Appreciate your help thanks again 😉😃

Craig.

johanafm;10928397 wrote:
Oh, that's because an image works like a submit input element. They both normally submit the form, as opposed to a button which doesn't.
<form ... onsubmit="return false;">
Also, you don't have to get the selectedIndex of the select box and then use options[] with that. The value of the select element is always the same as the value of the selected option. At least when not dealing with multiple select boxes.
location = document.jump.user_site.value;