JavaScript - Button Disabled By Default, Enable When Press Another One
Hello,
I have a script that enables a certain button when some conditions are met. I'm having an issue with it, so I made a simple script to get to the core of what I'm trying to do. This is the script that I'm using: Code: function disable() { document.form.button2.disabled='false'; } Code: <form name="form"> <input type="button" name="button1" value="Enable Button 2" onclick="disable()" /> <input type="button" name="button2" value="Button 2" disabled="true" /></form> Basically when you press button 1, button 2 enables. If I reverse it (button 2 enabled by default, pressing button 1 enables it) it is fine. But for some reason this way round nothing happens when I press button 1. What am I doing wrong? Similar TutorialsThe Combo box which contains 10 elements with an attribute of 'multiple' and the size is 4 and in disabled mode. I need to display the 8th element in the viewing position or enable the scroll bar which is to view the 8th element ie combo box should be in disabled mode.
I have a form with 3 fields that will allow a user to search a database of clients by either name, email, or client id number. However, I would like the user to only be able to put information in one field. It can be done be either deleting the other two fields when the user inputs information into a different field, or by disabling the other two fields when the user enters information in one (and also frees up all fields if the user ends up deleting what they entered). I've searched and found several helps that were close to what I need but not exactly. I was wondering if anyone would be able to help. Below is a start of what I had. Basically, it will disable the fields when I mouse out of them but won't re-enable them when I mouse back in. As you can see, I tried various combinations of events. (My code below also doesnt null out the other fields when the user opts to use a different field than the one they first began to enter info in). Any help is much appreciated and if this needs more explanation I will try to clarify better. Thanks Code: <html> <head> <script type="text/javascript"> function makeDisable($ID){ var x=document.getElementById($ID) x.disabled=true } function makeEnable(){ var x=document.getElementById($ID) x.disabled=false } </script> </head> <body> <form name='selectclient' action='client_edit.php' method='get'> <table> <tr> <td align='right'>Client ID:</td> <td><input id='id' type='text' size='20' name='client_id' onmouseout="makeDisable('id')" onmouseover="makeEnable('id')" value='' /></td> </tr> <tr> <td align='right'>Client Email:</td> <td><input id='email' type='text' size='20' name='client_email' onblur="makeDisable('email')" onfocus="makeEnable('email')" value='' /></td> </tr> <tr> <td align='right'>Client Name:</td> <td> <select id='name' name='client_name' onblur="makeDisable('name')" onmouseover="makeEnable('id')"> <option value=''>-- Select --</option> <option value='1' >Ted</option> <option value='2' >David</option> <option value='3' >Zack</option> </select> </td> </tr> <tr> <td align='left'><input value='Edit' type='submit' name='submit' /></td> </tr> </table> </form> </body> </html> Hello, I've been working on creating a script that zooms the entire webpage. Other than using "CTRL" + "+" keys (generally compatible with all browsers) to zoom in inside a web browser, I want to put it in a different format, as a button; it would be even easier to use. The problem is that I can't figure out how to make it work/ why it does not work. The following is my code: Code: <html> <head> <script type = "text/javascript"> document.onkeydown = function(zoomin) { var key; zoomin = zoomin || event; key = zoomin.keyCode; key == 43; return false; if (key == 17) { return true; function(zoomin){; return false; } } }</script> </head> <body> <h1>Is this appearing to get bigger?</h1> <button onclick="javascript: function('zoomin');">Zoom in</button> </body> </html> Basically I was trying to use a DEC code as the code for the "CTRL" and "+" keys; then put them into a function. The "return true" under the IF statement means that I want it to hold so that the "+" key can be read as part of the script, and therefore make the page zoom in. Once that happens, it returns false. I would appreciate any help/ suggestions. I will also try to look for a way to reset the page (100%) or zoom out as well. Hey: I have several "submit" buttons on a form. I want users to be able to hit the "enter" key to submit the form. The page used to "post" the information checks for specifically what form button was pushed to submit the form before executing the appropriate code. I am automatically submitting the page when the enter key is hit, but it is defaulting to the first option of executed code in the post page. Example - I have an "update" button and a "delete" button on the form. On the post page, I first check to see if the delete button was hit. When I press enter on the form, it simply answers yes to the first question (did they click the delete button), and the code is executed. I really wanted to emulate that the update button was hit. So -- is there a way to hit the enter button, and in the js code, mandate that it was the "update" button that was clicked? Thanks. Hi I am trying to trigger an event once the user clicks the browsers back/forward buttons, I have built a system just like facebook where if the user has javascript turned on they get the full feature of the site which includes fast switching for example if someone goes to this page "example.com/index.php" and click a link to contact.php it would change the url to "example.com/index.php#!/contact.php" but what I need to know is if there is any way to change the pages content when the user goes back and forth through the fast switch pages? something like "history.back !== -1" or something like that. If anyone can help please reply, thank you. I am trying to make it so if a PHP session entity exists, then JavaScript will enable a button. I am having trouble getting this to work and wondering if anyone knows what I am doing wrong? Code: function purchaseEnable() { if ($_SESSION['order']['paymentmethod']) { document.getElementById("purchase").disabled = false; } } Code: <INPUT disabled id="purchase" type="submit" value="PURCHASE"> Hi I have a form where I want to force users to accept terms and conditions before they can move on to the next page (submit form). Code: <input tabindex="2" name="agreement" id="agreement" type="checkbox" value="N" onchange="checkAgreement()" /> <label class="checking" for="agreement">I accept the <a tabindex="1" href="?page_id=292" title="read this before you continue" class="popmeup">terms and conditions</a>.</label> <!-- the button to be enabled --> <input tabindex="3" type="button" name="confirmer" value="Confirm" onclick="confirmOrder()" disabled="disabled" /> and the JS that works fine in Firefox. IE enables the button, but it still "looks" disabled, hence it is unlikely that anyone clicks it. Code: function checkAgreement() { if(document.order_form.agreement.checked) { document.order_form.confirmer.disabled = false; //document.order_form.submit.disabled = false; document.order_form.agreement0.value = "Y"; //for testing //document.order_form.confirmer.value = document.order_form.agreement0.value; } else { document.order_form.confirmer.disabled = true; //document.order_form.submit.disabled = true; document.order_form.agreement0.value = "N"; //document.order_form.confirmer.value = document.order_form.agreement0.value; } } any ideas? Hi, I have two buttons save and finish. I want to enable the button finish whenever I click the save button. page1.jsp. <script> InitialLoad() { document.getElementById('finish').disabled = true; } save(){ document.getElementById('finish').disabled = false; } </script> <html> <body onload= "InitialLoad()"> <input type="submit" name="finish" id=="finish" value="finish"> <input type="submit" name="save" value="save" onclick= save();> </body> </html> strutsconfig.xml <forward name="success" path="atre.dodUpgrade.show.page1"/> Using the above I can enable it temporarly. But whenever I call the forward page it on action class forward = mapping.findForward("success"); The Problem is page Refresh again and it shows disabled button for finish. what could be the solution for this? Thanks hello, i have this script that doesn't work exactly right yet. but i can't figure it out what i need to chance to let it work. in the script i want the button to be enabled when both text boxes are filled, atm when i fill in 1 it will already enable the button and thats exactly what i don't want. im quite a nooby in this so could some1 help me ? tyvm in advance code___________________ <html> </head> <script type="text/javascript"> function ButtonDisable1(text) { if (text.length > 0) document.getElementById("submit_button").disabled = false; else document.getElementById("submit_button").disabled = true; } </script> </head> <body> <input type="text" id="search_text" onchange="ButtonDisable1(this.value)"> <input type="text" id="search2_text" onchange="ButtonDisable1(this.value)"> <input type="submit" id="submit_button" value="Search" disabled="true"> </body> </html> I have a form that disables the radio options after choosing one and pressing a confirm selection button. Does the disabled attribute affect the value submitted? I'm having trouble programming a radio button to enable a group of checkbox options. I want the group to be disabled unless the radio is selected. Can I use: Code: document.getElementById("").disabled=true/false for a <div> section? Here's what I have so far. function: Code: function disableSection() { if (document.forms.radio.checked) document.getElementById("optionalinfo").disabled = false; else document.getELementById("optionalinfo").disabled = true; } HTML: Code: <input type="radio" name="additionalinfo" value="yes"/>Yes! Please sign me up for the following items:<br/> <div><blockquote><input id="optionalinfo" type="checkbox" name="additional" value="newsletter"/> I wish to receive <font color="ff69b4"><i>AMT</i></font>'s monthly E-Zine, <b>"Glorious Morning Muffins"</b>.</br> <input id="optionalinfo" type="checkbox" name="additional" value="Updates"/> I wish to receive <font color="ff69b4"><i>AMT</i></font> updates.</br> <input id="optionalinfo" type="checkbox" name="additional" value="future"/> Keep me posted about future offerings at <font color="ff69b4"><i>AMT</i></font>.<br/> <input id="optionalinfo" type="checkbox" name="additional" value="userRegister"/>I need to register to log in</blockquote></div> In addition to this, I would like the section to fade when disabled. Thanks for any help... again! This is my table which the user will see. When the user select a category, the table will show the result. Therefore the number of row of details that will be shown is uncertain. Over here i show 3 example. ------------------------- Edit | Name | Number | ------------------------- radbtn | John | 123456 | radbtn | MJ | 654321 | radbtn | JP | 443224 | I have a edit button. Once i click on it all my N amount of radio button will be enable. How can i do it? the problem is i have to hard code it [0] [1] [2], how can i change it to N? document.formname.btnname[0].disabled=false; thanks for helping anyone! i have this slideshow, Swiss Army Image slideshow i got from DDrive. it has forward and back buttons that are disabled unless the Play/Stop button is in Stop mode. i cannot for the life of me figure out how to enable the buttons always. please can someone help? i have a maniac client who's now threatening not to pay because of this one thing!!! installation: http://cssphpmysql.com/dev/westermancm/library2.html js: http://cssphpmysql.com/dev/westermancm/js/swissarmy.js thanks so much! GN Hi, I am having a problem with my script used to disable my submit button. I want the button to disable upon correct submission of the form, and the button to be kept enabled if the required fields are not filled in. I have the following code at the moment (which only does the first if statement). Code: SCRIPT CODE: <script type="text/javascript" > function validateForm() { var amount=document.forms["expenserecord"]["amount"].value; var picker=document.forms["expenserecord"]["picker"].value; var desc=document.forms["expenserecord"]["description"].value; if (amount==null || amount=="" || picker==null || picker=="" || desc==null || desc=="") { alert("All required fields must be filled out."); document.getElementById("sub").disabled = false; return false; } else { document.getElementByID("sub").disabled = true; } } </script> BUTTON CODE: <p><input type="submit" value="Submit" onClick="return validateForm()" id="sub"></p> I thought this would have been fairly simple but it appears the onchange event isn't triggered when a hidden field is populated by other javascript without user input. I have a simple search box and autocomplete/suggestion ajax thingie going on. What I want to do is have my "Go" submit button disbled until AFTER a user has populated the hidden field "cid". A user populates this field automatically when they click on a suggested option from the ajax autocomplete doofer. Here's what I've tried at the moment but failed on. Code: <form action="index.php" method="GET" name="qsform" id="qsform"> <input type="hidden" name="p" id="p" value="compdetails" style="border:1px solid #000000;" /> <input type="text" name="quicksearch" id="quicksearch" value="Find Company" style="border:1px solid #000000;" onFocus="clearText(this)" onBlur="clearText(this)" /> <input type="hidden" name="cid" id="cid" value="" style="border:1px solid #000000;" /> <input type="submit" name="go" id="go" value="Go" disabled="true" onmouseover="if (document.qsform.cid.value!='') { document.qsform.go.disabled=false; }" /> </form> I've been handed an html document that contains a centered, scrollable <iframe> element with a static height and width. This iframe element displays a simple html document that houses the 'terms of service' text. Their goal is to have it to where the <a href> link at the bottom that is shown to the user as 'next' is disabled until the user scrolls to the bottom of the terms of agreement box. The clickable link could be a button, image or text (no preference). They have to have it this way for legal reasons and radio buttons or checkboxes will not suffice unfortunately. Question: What is the best way to go about doing this that seems to be cross-browser friendly (especially IE7). I offer $10 via paypal for well commented method/script. Hey All! I've been having problems trying to figure this out and my nooby skills can only go so far... Basically I have a page that allows a user to select a specific category which links them to another page that has a series of radio buttons. By default I want to have that category checked according to what they selected. I've been able to pass the category variable with no problem but can't get it to default check... So far my Javascript looks like this: Code: <script type="text/javascript"> var category = category3 function autoForm(){ var searchForm = document.getElementById('myform'); var searchInput = searchForm.getElementsByTagName('input'); if(searchInput.value == category){ searchInput["group"].checked = true; } else { searchInput["group"].checked = false; } } <script> And so I'm trying to search with that function the value rather than the name. Here is my HTML: Code: <body onload="autoForm();"> <form id="myform" name="myform" action="#" method="POST"> <div align="center"><br> <input type="radio" name="group" value="category1"> Milk<br> <input type="radio" name="group" value="category2"> Butter<br> <input type="radio" name="group" value="category3"> Cheese<br> <input type="radio" name="group" value="category4"> Bread<br> </div> </form> </body> </html> I'm not getting any javascript errors, but nothing is really happening. So ultimately I want it to default select whatever the category variable (in this case "category3") when the user opens up the page. I'm trying to learn javascript right now so I'd love to hear how this is failing and how to do it right. I spent soooo long trying to figure this out. [woot! first post] Hi, Hi, I want to simulate user KEY PRESS (not mouse clicking) automatically on a screen every time that a pop up window (script error message) is opened on the screen OR detecting when an an iframe gets focus. My goal: Automatically closes the pop up window. If anybody know the exact code please post it. FG hi friends, i got a two textboxes,my requirement is when i enter two charectors in textbox1,automatically cursor must point to textbox2. but in my case it is not happening like above,when ever i enter charector3,curosr is entering textbox2 along with the entered charector, please find my code below and help me in modifying it. 1.abc.ascs.cs file code is: txtCategory.Attributes.Add("OnKeyPress", "Focus1(this.id);"); 2.abc.ascx file code is: <script type="text/javascript"> function Focus1(that) { if (document.getElementById(that).value.length>1) { //If Len(.Text) = 2 Or Len(TXTbox.Text) = 5 Then document.getElementById('ShippedQtyAdjEntry1_txtDetail').disabled=false; document.getElementById('ShippedQtyAdjEntry1_txtDetail').style.backgroundColor="White"; document.getElementById('ShippedQtyAdjEntry1_txtDetail').focus(); } |