JavaScript - Enabling & Unenabling Buttons Js
I have an e-script that agents use on a daily basis as their script. I have a page, that when a yes or no answer is given, it enables AND disables buttons accordingly. I am having some issues with the code. In this example, the agent must ask if the customer has insurance. They must select yes or no, from the radio buttons. If yes is selected, all buttons need to activate, or ungray. If they select no, I need the buttons to gray out. This needs to function both ways, meaning, if they first choose yes, the buttons light up. But, if they customer wasn't sure, and they in fact do not have insurance, and the agent clicks the no button, it then needs to gray the buttons out again. I have the first part of this code working, I am able to enable the buttons when clicking yes. However, I cannot get it to work reverse, when I click the no button. They stay enabled. Here is my current DF coding. Thanks in advance!!! I am stuck!
Code: <script type="text/javascript"> window.onload=function() { df=document.forms[0]; df[1].disabled=true; df[0].onclick=function(){ df[1].disabled=(df[1].disabled)?false:true; } df=document.forms[0]; df[4].disabled=true; df[1].onclick=function(){ df[4].disabled=(df[4].disabled)?false:true; } df=document.forms[0]; df[5].disabled=true; df[4].onclick=function(){ df[5].disabled=(df[5].disabled)?false:true; } df=document.forms[0]; df[6].disabled=true; df[5].onclick=function(){ df[6].disabled=(df[6].disabled)?false:true; } df=document.forms[0]; df[9].disabled=true; df[6].onclick=function(){ df[9].disabled=(df[9].disabled)?false:true; } df=document.forms[0]; df[10].disabled=true; df[9].onclick=function(){ df[10].disabled=(df[10].disabled)?false:true; } df=document.forms[0]; df[12].disabled=true; df[10].onclick=function(){ df[12].disabled=(df[12].disabled)?false:true; } df=document.forms[0]; df[15].disabled=true; df[12].onclick=function(){ df[15].disabled=(df[15].disabled)?false:true; } df=document.forms[0]; df[18].disabled=true; df[17].onclick=function(){ df[18].disabled=(df[18].disabled)?false:true; } df = document.forms[0]; df[2].onclick = function() { df[17].disabled = !df[17].disabled; df[18].disabled = !df[18].disabled; df[19].disabled = !df[19].disabled; df[20].disabled = !df[20].disabled; } df[17].disabled = true; df[18].disabled = true; df[19].disabled = true; df[20].disabled = true; } df = document.forms[0]; df[3].onclick = function() { df[17].disabled = !df[17].disabled; df[18].disabled = !df[18].disabled; df[19].disabled = !df[19].disabled; df[20].disabled = !df[20].disabled; } df[17].disabled = true; df[18].disabled = true; df[19].disabled = true; df[20].disabled = true; </script> The buttons are DF's 17,18,19 & 20. When DF 2 is selected, I need them to enable. When DF 3 is selected, I need them to disable. I have more than just those I need to fix, but if I can get that one working, I can take it from there. Thanks! Similar TutorialsDear Experts Whenever I use Javascript in my web and run it into Internet Explorer then it displays following messagebar To help protect your security, Internet Explorer has restricted this file from showing active content that could access your computer... If I do not allow blocked contents then nothing is displayed. My question is how to enable blocked contents through codes in html page. If it is not possible then why should we us javascript. Please help me to remove this confusion. Hi there, This is my request. I don't know if it CAN be done via JS, but it just seemed likely it could: Basically, I have a table echoed out by PHP: PHP Code: while($row = mysql_fetch_array($result)){ echo "<tr>"; echo "<td>".$row['Name']."</td>"; echo "<td>".$row['gig_count']."</td>"; echo "<td>" .$row['dob']."</td>"; echo "<td>".$row['Mail']."</td>"; echo "<td><a href=\"/records/add_gigs.php?id=".$row['Member_ID']."&?name=".$row['Name']."\"><button class=\"submit\">Add new Gig</button></a></td>"; echo "<td><a href=\"/certsend.php?name=".$row['Name']."&?mail=".$row['Mail']."\"><button class=\"submit\">Make Certificate!</button></a></td>"; echo "</tr>"; And if the value of gig_count is less than 20, then the 'make certificate' button will be disabled. Once gig_count is 20 or more, then it is re-enabled for that particular row. Any code towards this is greatly appreciated. Hi, I'm writing an android application to login into a website by injecting javascript into the HTML. So far it works for inputting the username and password, but I can't enable the submit button. Here is my code Code: "javascript: document.getElementById('user').value = '"+username+"'; document.getElementById('pass').value = '"+password+"'; document.getElementsById('submit').disabled = false;" Here is the code from the website concerning the submission form. Does anybody have any idea why this isn't working? Thank you for any help! Code: <form id="loginForm" name="query" method="post" action="/login/" enctype="application/x-www-form-urlencoded" autocomplete="off"> <p> <input type="hidden" name="one" value="wiscmail.wisc.edu" /> <input type="hidden" name="two" value="WiscMail Login" /> <input type="hidden" name="creds_from_greq" value="1" /> <input type="hidden" name="three" value="1" /> <input type="hidden" name="four" value="a5" /> <input type="hidden" name="five" value="GET" /> <input type="hidden" name="six" value="wiscmail.wisc.edu" /> <input type="hidden" name="seven" value="L2xvZ2lu" /> <input type="hidden" name="relay_url" value="https://wiscmail.wisc.edu/PubCookie.reply" /> <input type="hidden" name="eight" value="YXBwdXJsPXdpc2NtYWlsLndpc2MuZWR1L2xvZ2lu" /> <input type="hidden" name="fr" value="NFR" /> <input type="hidden" name="hostname" value="wiscmail.wisc.edu" /> <input type="hidden" name="nine" value="1" /> <input type="hidden" name="file" value="" /> <input type="hidden" name="flag" value="0" /> <input type="hidden" name="referer" value="(null)" /> <input type="hidden" name="post_stuff" value="" /> <input type="hidden" name="sess_re" value="0" /> <input type="hidden" name="pre_sess_tok" value="1714500944" /> <input type="hidden" name="first_kiss" value="1320154779-954466" /> <input type="hidden" name="pinit" value="0" /> <input type="hidden" name="reply" value="1" /> <input type="hidden" name="create_ts" value="1320154779" /> <label for="user">NetID</label><input type="text" id="user" name="user" size="20" tabindex="1" value="" /> </p> <p class="info"><a tabindex="4" href="/redirect/help-whatisit">What is my NetID?</a> (ie. bbadger)</p> <p><label for="pass">Password</label><input type="password" id="pass" name="pass" tabindex="2" maxlength="36" value="" /> </p> <p class="info"><a tabindex="5" href="/redirect/mynetid-reset">Forgot your password?</a></p> <p><label for="submit" class="invisible">Submit</label><input tabindex="3" class="submitButton" type="submit" id="submit" value="Login" /></p> </form> Hi everybody... I have some radio group boxes and according to select one of the values, the other values in another radio boxes should be enabled and checked. In the onClick method of each radiobox i call a setDefault() function to reset the value of radioboxes.... (e.g for (i;i<document.NPOrder.pSubstrate.length;i++){ document.NPOrder.pSubstrate[i].disabled=false; document.NPOrder.pSubstrate[i].checked=false; } and after that i disabled and checked the other's value...) Problem: The code in setDefault() doesn't work properly and after disabling the radios, i can't enable them again Please help me and thanks in advance... Hany hi.. i have a jsp page in which there is a table. the number of rows is variable and depends on a pre-defined query. every row has 2 editable textboxes which are initially disabled. i need to activate these textboxes according to the radio button which corresponds to the particular row in question. can anybody pls tell me how to do that. the code that i have written is as follows.if there is any tweaking to be done pls suggest the same. code: <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@page import="java.util.ArrayList" %> <%@page import="DTO.UserGroupDTO"%> <html> <head> <script type="text/javascript">} funtion enable(){ document.getElementById("inp1").disabled=false; document.getElementById("inp2").disabled=false; } function disable(){ document.getElementById("inp1").disabled=true; document.getElementById("inp2").disabled=true; } </script> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Update User Group Inquiry Results</title> </head> <body bgcolor="#aabbcc"> <center> <h3>Update User Group Inquiry Results</h3><br><br> <%ArrayList arrayList=(ArrayList)request.getAttribute("myList"); ArrayList list; int size=arrayList.size(); Integer groupId=null; String userGroupName=null; String description=null; %> <form action="/test/BankServlet"> <table style="color: highlight" border="5"> <% if(!(arrayList.isEmpty())){%> <tr><th>Group ID</th><th>User Group Name</th><th>Description</th><th>Selection</th></tr> <% for(int i=0;i<size;i++){ UserGroupDTO userGroupDTO=(UserGroupDTO)arrayList.get(i); userGroupName=userGroupDTO.getUserGroupName(); groupId=userGroupDTO.getGroupId(); description=userGroupDTO.getDescription(); %> <tr> <td><%out.println(groupId); %></td> <td><input id="inp1" disabled="disabled" value="<% out.println(userGroupName); %>"></td> <td><input id="inp2" disabled="disabled" value="<%out.println(description); %>"> </td> <td> <input type="radio" name="radio2" value="<%=groupId %>" onclick="enable()"> </td> </tr> <% } } else{ out.println("No match found"); } %> <tr> <td><input type="hidden" name="strTitle" value="UpdateUserGroup"></td> </tr> <tr> <td><input type="hidden" name="value" value="<%=groupId%>"></td> </tr> </table><br> <input type="submit" value="Update User Group" style="background-color: gray"> </form> <form action="/test/jsp/UserGroup.jsp"> <input type="submit" value="Go Back to User Group Operations Page" style="background-color: gray"> </form> <br><br><br><br> </center> </body> </html> 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 hello, I created this program to hold 5 cd's and some information relating to them. I keep getting an error that says: cannot find symbol symbol : class ButtonListener location: class inventoryprogram.InventoryProgram ActionListener btnListen = new ButtonListener(); // create listener here is the part of code with the actionlistener in it [CODE] private JPanel createButtonPanel() { // begin method createButtonpanel method ActionListener btnListen = new ButtonListener(); // create listener // create button objects JButton nextButton = new JButton("Display Cd"); // create and label button nextButton.setActionCommand("Next"); // action command for click nextButton.addActionListener(btnListen); nextButton.addActionListener(this); JPanel panel = new JPanel(); panel.add(nextButton); // add next button to panel return panel; // return panel } // end method createButtonPanel [ICODE] Hi all, I'm having trouble getting the following right: Code: <IMG border="0" onMouseOver=this.src="home2.gif" onMouseOut=this.src="home.gif" onClick=this.src="home2.gif" SRC="home.gif"> The idea is that after somebody clicks it, the button will remain home2.gif, but ofcourse if u mouseout after the click it will return to home.gif. Can somebody please help me with this problem?! I'm not really good at js, so I've been struggling with this for quite a few days ! Thnx alot! Sjaroow Hello. I am a new user. I have got a website, www.eastbourneinks.co.uk where the quantity buttons (+) & (-) do not work on most computers where I have had feedback. Is there any way of making them work on any/all computers. This is one of the pages: http://eastbourneinks.co.uk/product/...nk-cartridges/ Many thanks. Phil. I've been looking around and all the validation stuff I've seen doesn't work for what I have. Here is what I am trying to do: The user selects the Heads or Tails radio button for the first flip and then selects heads or tails radio button for the 2nd flip. The script then randomly flips two coins and compares it to what the user selected and if they are the same the user wins and if not then they lose. So there would be 4 buttons total, two Heads and two Tails. The first set of Heads and Tails needs to be assigned to "guess1" and the 2nd set is "guess2". So if the user clicks Tails for Flip1 and Heads for Flip2 then Tails is assigned to guess1 and Heads is assigned to guess2. Right now the script just assumes the user is selecting heads for both flips. Code: <html> <head> <title>Guess Two Coin Tosses</title> <script> function flip5(){ //Input var guess1 = document.getElementById('guess1').value var guess2 = document.getElementById('guess2').value var flip1 = Math.floor(Math.random() * 2) var flip2 = Math.floor(Math.random() * 2) var outcomes if (flip1 == 0) flip1 = 'Heads'; else flip1 = 'Tails'; if (flip2 == 0) flip2 = 'Heads'; else flip2 = 'Tails'; //Processing if (flip1.toUpperCase() == guess1.toUpperCase()) { if (flip2.toUpperCase() == guess2.toUpperCase()) outcomes = 'win win'; else outcomes = 'win lose'; } else { // here we lost the first if (flip2.toUpperCase() == guess2.toUpperCase()) outcomes = 'lose win'; else outcomes = 'lose lose'; } //Output document.getElementById('flip1').value = flip1 document.getElementById('flip2').value = flip2 document.getElementById('outcomes').value = outcomes } </script> </head> <body> <h3>Predict the Futu Guess Two Coin Flips</h3> Enter Heads for Heads, Tails for Tails! Case does not matter! <p/>Your Guess for Flip-1: <input type=radio id="guess1" size="5" value="Heads" />Heads <input type=radio id="guess1" size="5" value="Tails" />Tails <p/>Your Guess for Flip-2: <input type=radio id="guess2" size="5" value="Heads" />Heads <input type=radio id="guess2" size="5" value="Tails" />Tails <p/>Flip-1: <input type="text" id="flip1" size="5" value="???" /> <p/>Flip-2: <input type="text" id="flip2" size="5" value="???" /> <p/><input type="button" value="Flip Two!" onclick="flip5()" /> <p/>Outcomes: <input type="text" id="outcomes" size="20" value="" /> <hr> </body> </html> On custom button images, how do you give them the effect that they're "pushed" when the user clicks them and "unpushed" when the user lets his finger off the mouse button? I'm guessing it's some type of rollover effect, but I'm not sure how it's done.
hello, Im trying to write a program when the user clicks on the button, the textbox should display "how are you ". This is what I tried : <html> <head> <title>"Click"</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <p> <input name="text1" type="text" id="text1" value="textbox 1" onFocus="this.style.background ='yellow'" onBlur="this.style.background='white'"> </p> <p> <input name="text2" type="text" id="text2" value="textbox 2" onFocus="this.style.background = 'yellow'" onBlur="this.style.background='white'"> </p> <p> <button onclick="textbox1.value="how are you">Click Me!</button> </p> </body> </html> hello, this is my first attempt in javascript. im trying to make custom radio buttons here is the code i have: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <style type="text/css"> .hide {display:none;} .radio {width:16px;height:16px;} </style> <script type="text/javascript"> // declare variables or different states var off = 'images/check-off.png'; var on = 'images/check-on.png'; var radioImage = document.createElement('img'); function replaceRadios(){ var radios = document.getElementsByName('radio1'); radios.type = 'radio' for (r = 1; r < radios.length; r++) { // if radio is checked configure the img src to var on if (radios[r].type = 'radio' && radios[r].checked) { radioImage.src = on; radioImage.className= 'radio on'; } else { // otherwise configure the img src to var normal/off and give it a class of radio radioImage.src = off; radioImage.className= 'radio off'; } // give the image an id of radio radioImage.className = 'radio'; radioImage.onclick= radioStates; radios[r].parentNode.insertBefore(radioImage,radios[r]); // hide the radio button to show image radios[r].className = 'hide'; } } function radioStates(r) { var radios = document.getElementsByName('radio1'); if (radios.checked = true) { radioImage.setAttribute("class", "radio on"); radioImage.src = on; } else if (radios.checked = false) { radioImage.setAttribute("class", "radio off"); radioImage.src = off; } else { radioImage.setAttribute("class", "radio off"); radioImage.src = off; } } setTimeout("replaceRadios()", 0); </script> </head> <body> <form name="radiotest"> <input type="radio" id="radio1" class="radio" name="radio1" /> <input type="radio" id="radio2" class="radio" name="radio1" /> <input type="submit" id="submit" name="submit" /> </form> </body> </html> If anyone could help me, I would greatly appreciate it. I have the following buttons ... Code: <input id="newTaskButton" type="button" name="Good Morning" value="201" /> <input id="newTaskButton" type="button" name="Hello World" value="201" /> ... and the following javascript ... Code: <script type="text/javascript"> $(document).ready(function() { $("#newTaskButton").click(function() { alert(" " + document.getElementById("newTaskButton").name); }); }); </script> ... but I am having some trouble having the second button to response. My objective is to have 2 or more button that have the same click function (in this case, newTaskButton) but when clicked, it will produce different response. (in this case, the first button will response 'Good Morning' while the second button will response 'Hello World') Appreciate any help. Alternatives are welcome too. Hi, I have buttons like these: PHP Code: <button type="button" onclick="izdas()">Iždas</button> <button type="button" onclick="miestas()">Miestas</button> <button type="button" onclick="map()">Žemėlapis</button> <button type="button" onclick="infantry()">Kariuomenė</button> <button type="button" onclick="biuld()">Statiniai</button> How I can add images on them?? Size would be 100x20px. Also, I would e thankful if someone would help me position them in one vertical line. Thanks in advance... On my website I have a radio button as any other normal radio button. <input type="radio" name="crime" value="4" id="4" class="submit"> is there any way to get rid of this radio button and click something for example <tr> <td>Blah blah</td> <td>Blah Blah</td> </tr> is there any code i can put in the <tr> tag so if i click that section it will act as a radio button and when its selected change the background of the tr section. Im trying to configuere a form that a. a radio buttons that allow the user to choose between quarters, nickels, dimes and pennies. and show image when click on my radio button im confused on how to get the image to display whenthey click on the radio button On my website I have a radio button as any other normal radio button. <input type="radio" name="crime" value="4" id="4" class="submit"> is there any way to get rid of this radio button and click something for example <tr> <td>Blah blah</td> <td>Blah Blah</td> </tr> is there any code i can put in the <tr> tag so if i click that section it will act as a radio button and when its selected change the background of the tr section. i have a simple frame that looks like this http://i307.photobucket.com/albums/n...aker/help2.jpg i have 3 pages (side.html, page1.html and page2.html) the above picture has side.html and page1.html loaded on default, what i want to do is whenever i click on the page 1 button, page1.html will load on the right side and when i click on page 2 button, page2.html will load i cant figure out what the code for this is and googling for the solution isn't getting me anywhere help please To be clear my approach to coding is basically that of building some kind of Java Frakenstein's Monster... which also explains why everything I create invariably ends up in a windmill on fire... This is what I have managed to put together so far: Code: <script type="text/javascript"> var homeDown = new Array() homeDown[0] = "images/home001.png"; homeDown[1] = "images/home002.png"; homeDown[2] = "images/home003.png"; homeDown[3] = "images/home004.png"; homeDown[4] = "images/home005.png"; homeDown[5] = "images/home006.png"; homeDown[6] = "images/home007.png"; homeDown[7] = "images/home008.png"; homeDown[8] = "images/home009.png"; homeDown[9] = "images/home010.png"; homeDown[10] = "images/home011.png"; homeDown[11] = "images/home012.png"; homeDown[12] = "images/home013.png"; homeDown[13] = "images/home014.png"; homeDown[14] = "images/home015.png"; var homeOver = new Array() homeOver[0] = "images/image001.png"; homeOver[1] = "images/image002.png"; homeOver[2] = "images/image003.png"; homeOver[3] = "images/image004.png"; var x=0; function NormalImage() { document.getElementById("button1").src="images/home.png"; } function MouseOver() { document.getElementById("button1").src=homeOver[x]; x++; setTimeout("MouseOver()", 8); } function MouseDown() { document.getElementById("button1").src=homeDown[x]; x++; setTimeout("MouseDown()", 8); } </script> ...and the HTML: Code: <a href="http://www.google.com"> <img id="button1" src="images/home.png" onmousedown="MouseDown(button1)" onmouseover="MouseOver(button1)" onmouseout="NormalImage(button1)"/> </a> I'm sure that's probably the wrong way of doing it but it vaguely works. What I ultimately want is a button that will play the long image sequence on click and the shorter sequence on mouse over. However at the moment it appears that the states of the mouse being over and clicked are clashing so I need something to ignore mouseover images on click and another bit to reset the count on mouseover so it can play again. If I remove the mouseover event the animation on mousedown plays well, though I suspect it might be necessary to preload the images when it's online. Alternatively if anyone feels like writing a much easier bit of script that will do the same thing and slap me for being stupid that is acceptable too... |