JavaScript - Enable Button Does Not Work In Ie
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? Similar TutorialsI 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"> 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> 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 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? 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'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! 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 everyone, I am having some trouble with one of my buttons, the one button works fine but my second one doesnt work at all. The second button should open the same page as the first and maximize it. Could someone please help me with this? Thanks. Code: <html> <head> <title>commands</title> <script type="text/javascript"> /* <![CDATA[ */ var maxWindow function createWindow() { var winWidth=300; var winHeight=100; var winLeft = (screen.width-winWidth)/2; var winTop = (screen.height-winHeight)/2; var winOptions = ",width=" + winWidth; winOptions += ",height=" + winHeight; winOptions += ",left=" + winLeft; winOptions += ",top=" + winTop; maxWindow = window.open("MaxWindow.html", "newWindow", winOptions); maxWindow.focus(); } function maximizeWindow() { maxWindow.moveTo(0,0); maxWindow.resizeTo(screen.availWidth,screen.availHeight); maxWindow.focus(); } /* ]]> */ </script> </head> <body> <input type="button" name="Create New Window" value="Create new Window" onclick="createWindow();"/> <input type="button" name="Maximize New Window" value="Maximize New Window" onclick="maximizeWindow();"/> </body> </html> Whenever I click the Submit button, which should create a new window showing all the details entered in the form, it doesn't work ideas? javascript.html Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>JavaScript</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15"> <!-- The external style sheets --> <link rel="stylesheet" type="text/css" href="mystyle.css"> <script type="text/javascript" src="myjavascript.js"></script> <meta name="keywords" content="CO332"> <meta name="description" content="CO332 Exercise Website"> <meta name="author" content="Bradley Berwick"> </head> <body> <div id="container"> <div id="maincontent"> <div id="header"> <h1> Exercise Website </h1> </div> <div id="leftnav"> <ul> <li><a href="index.html" >Home</a> <li><a href="myjavascript.html" ><span class="currentpage">Services</span></a> <li><a href="#" >TBA</a> <li><a href="#" >TBA</a> </ul> </div> <div id="content"> <h2>About Yourself</h2> <form name="exampleform"> <h3>Name: <input name="yourname" type="text"></h3> <h3>Age: <input name="age" type="text" size="3" Onchange = ' if ( !( this.value > 0 && this.value < 150 ) ) { alert( this.value + " is not a valid age."); this.value=""; // clear age text box }' > </h3> <h3>Gender: <input name="gender" type="radio" value="male"> Male <input name="gender" type="radio" value="female"> Female </h3> <h3>Your favourite colour: <select name="colours"> <option value="None"> <option value="red">Red <option value="green">Green <option value="blue">Blue <option value="pink">Pink <option value="orange">Orange <option value="purple">Purple </select> </h3> <h3>Your hobbies a <br> <input name="running" type="checkbox"> Running <br> <input name="football" type="checkbox"> Football <br> <input name="golf" type="checkbox"> Golf <br> <input name="cycling" type="checkbox"> Cycling </h3> <textarea rows="10" cols="30"> Add comments. </textarea> <p> <input type="reset" value="Clear"> <input name="submit" type="button" value="Submit" onclick='submitForm()';> </p> </form> </div> </div> <div id="footer"> <div id="mailto"> Last updated on 28th Oct 2011<br> Maintained by Bradley Berwick </div> </div> </div> </body> </html> myjavascript.js Code: function displayMessage(msg) { // Open a new window var msgWindow = window.open('', 'Message'); // Write message in the new Window msgWindow.document.write(msg); msgWindow.document.close(); // Raise this window, in case it's not visible msgWindow.focus(); } var hobstring=""; function submitForm() { var nam=document.exampleform.elements["yourname"].value; var age=document.exampleform.elements["age"].value; var gend = document.getElementsByName('gender'); for (var i = 0; i < gend.length; i++) { if (gend[i].checked==true) { var sex=gend[i].value; } } var sel=document.getElementById('color'); var color=sel.options[sel.selectedIndex].value; var hobbs = document.getElementsByName('hobby'); for (var a = 0; a < hobbs.length; a++) { if (hobbs[a].checked==true) { hobstring+=hobbs[a].id+", "; } } var msg="Name: "+nam+"<br>Age: "+age+"<br>Gender: "+sex+"<br>Favorite color: "+color+"<br>Hobbies: "+hobstring; displayMessage(msg); } Hi I have a form setup so that when you enter something in a text field and click a button it checks to see if the value entered in the text field is the "correct" letter and if its right it changes the CSS property of a div container to be shown which then has a link to a the next question. So I don't really have a submit button because my form isn't setup to work with one. This is fine by me but the only problem is when you enter a letter and click enter it acts as a submit and the submit does nothing, which is what it's suppose to do. So what I'm asking is how can I get that button to respond to an enter instead of the default submit taking over the enter key? I have identical code in my index that works, so I'm just guessing the error is somewhere else, I know IE is not the best target to aim for - but I really want this to work in the windows default browser.... Here is the php page... PHP Code: <HTML> <HEAD> <TITLE> Family Home Page </TITLE> <SCRIPT TYPE="text/javascript" SRC="AddFamilyMemeber.js"> </SCRIPT> </HEAD> <BODY> <TABLE> <TR> <TD>Father:</TD> <TD> <SELECT ID="Father"> <?PHP $con=mysql_connect("localhost","XXXX","XXXX"); if (!$con) { die('Could not connect: '.mysql_error()); } mysql_select_db("XXXX",$con); $result=mysql_query("SELECT * FROM FamilyMembers"); while ($row=mysql_fetch_array($result)) { echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>"; echo "<BR/>\n"; } mysql_close($con); ?> </SELECT> </TD> </TR> <TR> <TD>Mother:</TD> <TD> <SELECT ID="Mother"> <?PHP $con=mysql_connect("localhost","XXXX","XXXX"); if (!$con) { die('Could not connect: '.mysql_error()); } mysql_select_db("XXXX",$con); $result=mysql_query("SELECT * FROM FamilyMembers"); while ($row=mysql_fetch_array($result)) { echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>"; echo "<BR/>\n"; } mysql_close($con); ?> </SELECT> <TD> </TR> <TR> <TD>FirstName:</TD> <TD><INPUT TYPE="text" ID="FirstName"/></TD> </TR> <TR> <TD>MiddleName:</TD> <TD><INPUT TYPE="text" ID="MiddleName"/></TD> </TR> <TR> <TD>LastName:</TD> <TD><INPUT TYPE="text" ID="LastName"/></TD> </TR> </TABLE> <BUTTON TYPE="button" ONCLICK="Submit()">Submit</BUTTON> <BUTTON TYPE="button" ONCLICK="Abort()">Abort</BUTTON> </BODY> </HTML> and here is the javascript that works in the index but not here... Code: function Abort() { document.location="AddFamilyMember.php"; }; When I load the page everything looks ok, but click on the abort button, and all that happens is that the little error symbol pops in the lower left of IE. The names of the two files are "AddFamilyMember.php" and "AddFamilyMember.js". Sorry, but I honestly can't see where the problem is.... this is my code ______________________________________________________________ <pega:when test="$mode-input"> <script language="JavaScript"> function showNextButton() { handleClientEvent('SERVER','MakeScoreOrder','','-1'); /* fetches the data */ var submitClicked = "<p:r n='pyWorkPage.PFRSData.SubmitClicked' />"; var submitClicked = submitClicked.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); var msg = "<p:r n='pyWorkPage.PFRSData.HasMessages' />"; var msg = msg.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); if (submitClicked == "" || msg =="true") { toggleSubmitBtn(0); } else if (submitClicked == "true" || msg =="false") { toggleSubmitBtn(1); } } function toggleSubmitBtn(status) { var submitButton=document.actionForm.submitButton; if(submitButton) { var parentTable=pega.u.d.findParentTable(submitButton); if(parentTable) if(status) { if(parentTable.style.display=='none' || parentTable.style.display=='') { parentTable.style.display='inline'; document.actionForm.submitButton.disabled=false; } } else { parentTable.style.display='none'; document.actionForm.submitButton.disabled=true; } } } </script> <button onClick="showNextButton();" id="PISSubmit" style="vertical-align:middle;"> <span class='buttonLeft'></span> <span class='buttonMiddle'> <span class='buttonText' onmouseover="this.className='buttonTextHover'" onmouseout="this.className='buttonText'">Submit</span> </span> <span class='buttonRight'></span> </button> </pega:when> ___________________________________________________________ On clicking PISsubmit button it should fetch data and display the next button(submitButton).. but on first click nothing happens on second click it fetches the data and third click it displays Next(submitButton)button. Kindly help !! Note: its in pega application. I checked the code for hours and I can't figure out why the form doesn't work. Please, I need help, I need to finish this page. Inside the input form there is a div using visibility:hidden. The div works perfectly when it is selected (show or hide), not problem. The problem is when press the send button the form doesn't send anything, not respond, do nothing!. Any help? Voting button on the poll in the left column works fine if you take the sharethis javascripts out. Why won't they work together though? <script type="text/javascript" src="http://www.claimsheaven.co.uk/polls/admin/script.js"></script> <script type="text/javascript">var switchTo5x=true;</script> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript" src="http://s.sharethis.com/loader.js"></script> e.g. on this page: http://www.claimsheaven.co.uk/news/20120305.php Code: <html> <body> var j=0; var temp,temp2,temp3; <script> function scor(j) { switch(j) { case 1: alert("Απαντήσατε σωστά μόνο σε μία ερώτηση.Προσπαθήστε πάλι"); break; case 2: alert("Απαντήσατε σωστά στις δύο από τις τρείς ερωτήσεις"); break; default: alert ("Συγχαρητήρια απαντήσατε σωστά και στις τρεις ερωτήσεις"); } } </script> <meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7"> <p align="center"><font size="5">Σε μία σελίδα html πόσα είναι τα μέγιστα frames που μπορούμε να τοποθετήσουμε; </p></font> <form name="for1"> <input type="radio" name="fr1"value="1" > 5 <br> <input type="radio" name="fr1"value="2" > Όσα τα pixels<br> <input type="radio" name="fr1"value="3" > Δεν υπάρχει όριο<br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal1()"> </form> <script type = "text/javascript"> function getVal1() { for(var i=0; i<document.for1.fr1.length; i++) { if (document.for1.fr1[i].checked) { if (document.for1.fr1[i].value==2) { j++; } } } } function getVal2() { for (var i=0;i<document.for2.fr2.length;i++) { if (document.for2.fr2[i].checked) { if (document.for2.fr2[i].value==2) { j++; } } } } function getVal3() { for (var i=0;i<document.for3.fr3.length;i++) { if (document.for3.fr3[i].checked) { if (document.for3.fr3[i].value==3) { j++; } } } } </script> <p align="center"><font size="5"> Είναι απαραίτητο σε κάθε σελίδα html να υπάρχουν τα tags head και title;</p></font> <form name="for2"> <input type="radio" name="fr2" value="1"> Ναι <br> <input type="radio" name="fr2" value="2"> Όχι <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal2()"> </form> <p align="center"><font size="5"> Τι κάνει το εξής tag: meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7" </p></font> <form name="for3"> <input type ="radio" name="fr3" value="1"> Δημιουργεί τις προυποθέσεις για την απόκτηση τιμών <br> <input type ="radio" name="fr3" value="2"> Ισσοροπεί τις παραγράφους σε στήλες <br> <input type ="radio" name="fr3" value="3"> Επιτρέπει την κωδικοποίηση ελληνικών χαρακτήρων στην ιστοσελίδα <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal3()" </form> <input type ="button" value="Υπολογισμός" onClick="scor(j)"> Apart from any logical mistakes this thing i have created might have , my question is this.Why upon pressing the last button and calling the "scor(j)" function , no alerts pop up?Thanks in advance. I'm completely stumbled by this as i have no clue as what might be wrong.But then again , my experience is extremely limited can we enable javascript through code
Title really say it all.. How would i enable colours within a text box? :$ |