shortage Posted August 10, 2009 Share Posted August 10, 2009 Ok well im new to this so ill give it a go :)i am creating a tax cotpit for a company i need help on useing tables and buttons in java scriptbasicly what i have is check boxes on every row and the readonly text boxes on each row. what i want to do is when a button is pressed and the check box on that row is checked that the readonly boxes on that row are no longer readonly.thank you Link to comment Share on other sites More sharing options...
alexnofue Posted August 10, 2009 Share Posted August 10, 2009 Hi, do you have some code to see what's the problem Link to comment Share on other sites More sharing options...
chibineku Posted August 10, 2009 Share Posted August 10, 2009 I have spent a fair amount of time trying what should be extremely easy fixes to this, but to no avail.First, I tried: <html><head><title>Toggling Read/Write</title><script type="text/javascript">function toggle(els) {if(els.checked) { els.nextSibling.onfocus=""} else { els.nextSibling.onfocus="this.blur()"}}</script></head><body><form name="cotpit"><input type="checkbox" id="readWrite" name="readWrite" onchange="toggle(this)"/><input type="text" name="readWrite" value="stuff you can't edit" onfocus="this.blur()" /></form></body> or something like it, which successfully removed the onfocus="this.blur()" property initially set for the text box, but did not reset it when the box was unchecked. I tried changing els.nextSibling.onfocus="" to onfocus="this.focus()", thinking that maybe JavaScript would have difficulty assigning a property set to null, as it sometimes does if there is no preexisting property. Then I tried various other things with even less success. Not as simple as it should be, or perhaps I'm just dumb. Link to comment Share on other sites More sharing options...
chibineku Posted August 10, 2009 Share Posted August 10, 2009 I'll add more dead end attempts, to save someone else the hassle: <html><head><title>Toggling Read/Write</title><script type="text/javascript">function toggle(els) {i = 0while(els <= els.length) { els[i].checked ? els[i+1].onfocus="" : els[i+1].onfocus="this.blur()";i++;}}</script></head><body><form name="cotpit"><input type="checkbox" id="readWrite" name="readWrite" onchange="toggle(this.form)"/><input type="text" name="readWrite" value="stuff you can't edit" onfocus="this.blur()" /></form></body> Link to comment Share on other sites More sharing options...
Guest FirefoxRocks Posted August 11, 2009 Share Posted August 11, 2009 <!DOCTYPE html><html lang="en"><head><meta http-equiv=Content-Type content="text/html; charset=utf-8"><title>Toggling Read/Write</title><script type="text/javascript">"use strict";function rr() { for (var i = 1; i < document.getElementById("cotpit").getElementsByTagName("p").length; i = i + 1) { (document.getElementById("r" + i + "box").checked) ? document.getElementById('r' + i).readOnly = false : document.getElementById('r' + i).readOnly = true; }}</script></head><body><form name="cotpit" id="cotpit" action="doSomething.php" method="post"><div><p> <input type="checkbox" id="r1box"> <input type="text" id='r1' name="r1" value="some stuff" readonly='readonly'> </p><p> <input type="checkbox" id="r2box"> <input type="text" id='r2' name="r2" value="another row" readonly='readonly'> </p><p> <input type="checkbox" id="r3box"> <input type="text" id='r3' name="r3" value="and another one..." readonly='readonly'> </p><p> <button type='button' onclick='rr();'>Refresh readonly status</button> <button type='submit'>Submit form</button></p></div></form></body> The HTML is valid HTML 5 and the JavaScript is (almost) JSLint "good" valid. Link to comment Share on other sites More sharing options...
chibineku Posted August 11, 2009 Share Posted August 11, 2009 Oh, there's actually a readonly property. That makes sense... Link to comment Share on other sites More sharing options...
shortage Posted August 11, 2009 Author Share Posted August 11, 2009 thanks guys for the help Link to comment Share on other sites More sharing options...
Guest FirefoxRocks Posted August 11, 2009 Share Posted August 11, 2009 Oh, there's actually a readonly property. That makes sense...It says right in the first post:"what i want to do is when a button is pressed and the check box on that row is checked that the readonly boxes on that row are no longer readonly" :)And I have no clue what you were trying to do with your code. Link to comment Share on other sites More sharing options...
chibineku Posted August 11, 2009 Share Posted August 11, 2009 I was trying to toggle the onfocus event of the input field so that with the checkbox checked, it was set to null, and when the checkbox was unchecked, it was set to this.blur(), preventing the user from clicking in the field. I still don't see why it failed.. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.