Click to See Complete Forum and Search --> : Button Type And Submit Button Question


mike@spb
August 27th, 2002, 01:38 PM
I want to be able to do two things on a form depending on what button is pressed. Here's what I have.


//The Javascript

function addEvent(){
var EventName = MediaInfo.EventName.value;
var url = MediaInfo.url.value;
var live = MediaInfo.live.value;
var event_key = MediaInfo.event_key.value;
var action = MediaInfo.addEvent.value;
var EventAdd="true";

URL="http://ip/folder/fiilename.php?action=" + action + "&EventName=" + EventName + "&event_key=" + event_key + "&url=" + url + "&live=" + live + "&EventAdd=" + EventAdd;

window.location=URL;
}

//The form
<FORM Name='MediaInfo' Method='post' Action='eventws.php?action=ChangeMediaInfo'>
...

<Input Type='image' src='icons/add.gif' Alt='Add' onclick='addEvent()'>
<Input Type='image' src='icons/edit.gif' Alt='Edit'>




When I click on the 'add' image, I want to go to a different url.
When I click on the 'edit' image. I want to go where the action takes me.

Currently, regardless of what image I click, it takes me to the url of the 'action' of the form.

Any help would be appreciated.

Also, if I make the first input type a button, it works; however, I want to be able to have an image as a button instead of the default button.



Mike@spb

anupam kant
August 28th, 2002, 11:32 PM
if you want to call the function addEvent() on click of the image then instead of:

<Input Type='image' src='icons/add.gif' Alt='Add' onclick='addEvent()'>
<Input Type='image' src='icons/edit.gif' Alt='Edit'>

you should use
<img src='icons/add.gif' Alt='Add' onclick='addEvent()'>

because <input type=Image >works like submit button

and if you want to change the action dynamically simply do this:
1. add the ids to the images, and call the same function on both images.

<img id="imgAdd" src='icons/add.gif' Alt='Add' onclick='addEvent()'>

<img id="imgEdit" src='icons/edit.gif' Alt='Edit' onclick='addEvent()'>
.....................
................
2. in function check the event source
function addEvent()
{
var url;
//check the event originator

if(event.srcElement.id=="imgAdd")
url ="add.asp"; //action for add button
else
url = "edit.asp"; //action for edit button
...................
.............
}

hope this helps:)