We help IT Professionals succeed at work.

Disable <Select> box after onclick Javascript

Pigdogmonster
on
2,618 Views
Last Modified: 2008-01-09
Hi - Thanks for looking at my question.

I have a very simple form that consists of a select box and a button:

  <select name="USRMaterial_Type" id="USRMaterial_Type">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        </select>

<input type="button" value="Submit" onClick="BTN.value='Auto';SUBBTN.value='User';theform.USRMaterial_Type.disabled=true;subm(this.form,'HiddenSubmitFrame');javascript:form.submit();">
       
I want the SELECT box to diable once the user clicks the button which is does but when the form submits it does not pass the selected value because the element is disabled!

My issue is this part:
USRMaterial_Type.disabled=true;

Is there a way to do this?

Thanks

PDM
Comment
Watch Question

Simple, create a hidden input field and before submit() pass the selected value of select into hidden field value and use it into other page from the hidden input field

Commented:
Once s control is disabled, the value will not be sent with the form. Try creating a hidden control and then add a step to your onclick event to copy the value from the select to the hidden control BEFORE you disable.

Commented:
LOL: I type too slow.!!
<input type="hidden" name="hUSRMaterial_Type" value="">
<input type="button" value="Submit" onClick="BTN.value='Auto';SUBBTN.value='User';theform.USRMaterial_Type.disabled=true;subm(this.form,'HiddenSubmitFrame');theform.hUSRMaterial_Type.value=theform.USRMaterial_Type.value;javascript:form.submit();">
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION
Albert Van HalenAnalyst developer
CERTIFIED EXPERT

Commented:
Just enable the selectbox again when you post the form

Author

Commented:
Thanks gents :)
espeicially asvforce as that is the solution I used.

I do however have a second part to this question that I hope you can help me with.

I have a 4 text box's but I only want 1 to appear on the screen until the user enters something in that text box.
What is the best way to do this?  I was thinking onclick but the user may not enter any text in the box and the 2nd would appear?

Any ideas?

Thanks again

PDM

Commented:
try onchange, then in the function, check the control.value length to make sure it has content..


function unhide(oThis){
   if (oThis.length > 0)
       {   add your unhide code here }
  else
     { hide those suckers again }
 }

<input   id="text1" type=text  onchange="unhide(this);">
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a sample view!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.