How to use 2 submit buttons & remove hidden field value if 2nd 1 selec

Forum Moderators: open

Message Too Old, No Replies

How to use 2 submit buttons & remove hidden field value if 2nd 1 selec

selected

Clark

3:40 am on Mar 23, 2006 (gmt 0)

Here's my form.


<form action="someurl">
<input type=hidden name=guns value=butter>
<input type=submit name=submit value="Search">
<input type=submit name=advanced value="Advanced">
</form>

What I'd like to see happen is that clicking "Search" will work normal and clicking "Advanced" will cause the
<input type=hidden name=guns value=butter>
line to disappear i.e. not get sent to the result page.

Is this possible?

Clark

3:44 am on Mar 23, 2006 (gmt 0)

Forgot to add. If possible using inline javascript as opposed to sticking a subroutine at the top of the page.

Clark

4:52 am on Mar 23, 2006 (gmt 0)

I just thought of a potential solution, though don't know what browsers support this if any? Never heard anyone talk about this, but what's the status of nested forms?

It would be nice if this could work but I bet it's not valid


<form action="someurl">
 <input type=submit name=submit value="Search">
 <form action="someurl">
 <input type=submit name=advanced value="Advanced">
 </form>
 <input type=hidden name=guns value=butter>
</form>

Clark

4:55 am on Mar 23, 2006 (gmt 0)

Damn, I totally forgot to add there's an input text field in there too!

Bernard Marx

9:05 am on Mar 23, 2006 (gmt 0)

I only have IE to test on here. Should be OK though.

<script type="text/javascript"> 
function testRemove(name) 
{ 
    var elm = document.forms[0].elements[name]; 
    elm.parentNode.removeChild(elm); 
} 
</script> 
</head> 
<body> 
    <!- Changed names of submit buttons. 
      Not good to have an element named, "submit" --> 
    <form action="x.htm" method="get"> 
        <input type=hidden name=guns value=butter> 
        <input type=submit name=subSearch value="Search" onclick="testRemove('guns')"> 
        <input type=submit name=subAdvanced value="Advanced"> 
    </form> 
</body>

Clark

10:46 am on Mar 23, 2006 (gmt 0)

Thanks Bernard. I know the way I asked it was confusing because I was confused myself. Thanks for seeing through it :)

I meant that the advanced submit should remove the hidden input. I'm assuming I need to switch the function call to the advanced, correct?

Also, is there no way to do this inline without a function in the header (since I use templates and mix and match headers, that function complicates matters for my implementation). It would have been perfect if I could make the hidden value part of the submit. Something like

But unfortunately there is no such thing as a "textonthesubmitbutton" :)
But maybe there is an inline javascript to change only the value of the Submit when clicked (without the text appearing on the button)?

Hopefully my question is clear?

Bernard Marx

1:21 pm on Mar 23, 2006 (gmt 0)

er... ish!


<input type="submit" name="advancedsubmit" value="Advanced" 
       onclick="var e=this.form.elements.guns;e.parentNode.removeChild(e);">

Would it not be easier to simply set the value of "guns" to ""?
Then detect that on the receiving end.

onclick="this.form.elements.guns.value=''"

..or remove the name attribute, so that the field isn't submitted at all:

onclick="this.form.elements.guns.removeAttribute('name')"

If your form has a text field, then it will be possible, and very likely, that the user will submit by pressing <return>. Neither submit button will be clicked. What is the default state of "guns" in this case?

Clark

6:00 pm on Mar 23, 2006 (gmt 0)

Ah, good point. In any event, I wanted to get this code done last night so I finally figured out the easiest way. I used irfanview to turn a screen capture of both buttons into image and made the hidden field one image <input type="image" .... and not the other. This way if advanced is clicked, the other doesn't get submitted.

Thanks for the help! One day I will master javascript.

I hope...