Script to enable/disable fields in a row
Hi,
I have found very usefull script on this forum: http://www.dynamicdrive.com/forums/s...ad.php?t=12978
What I would like to do is that:
1. checking/unchecking work like it does now and when check/uncheck EDIT checkbox in a single row all fields in this row should be enabled/disabled, also when I check/unchek ALL EDIT checkboxes at once then fields in all rows should be enabled/disabled.
2. when ALL verified and ALL deleted checkboxs at the top are checked then only those rows will be checked for which EDIT checkbox is checked
3. when I check EDIT for few or all rows and choose some value in column 8 in first row from selected then this value will be automaticlly choosen for the rest where EDIT is checked
4. as above in point 3 but with auto coping value from a text field i.e. column 4
Here is my code:
Can anyone help with this one?HTML Code:<!-- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> <html> <head> <title>Table Check</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> .all input, .all span { display:none; } .clear { clear:left; } </style> <script type="text/javascript"> //* this is a script that was enabling/disabling fields - now it stop working function enableDisable(oChk){ var disable = !oChk.checked; var arglen = arguments.length; var obj, startIndex = 1; var frm = oChk.form; for (var i=startIndex;i<arglen;i++){ obj = frm.elements[arguments[i]]; if (typeof obj=="object"){ if (document.layers) { if (disable){ obj.onfocus=new Function("this.blur()"); if (obj.type=="text") obj.onchange=new Function("this.value=this.defaultValue"); } else { obj.onfocus=new Function("return"); if (obj.type=="text") obj.onchange=new Function("return"); } } else obj.disabled=disable; } } } /*Check/Uncheck columns script © John Davenport Scheuer *visit: [url]http://www.dynamicdrive.com/forums[/url] *username: jscheuer1 *This notice must remain for legal use */ //set 'check all' label //var allp='Check All' var allp='All' //Multiple tables, each w/unique id? (use 1 for yes, 0 for no) var tids=1 //Initialize 'check all' cells display? (use 1 for yes, 0 for no) var initca=1 /////////////////Stop Editing//////////// allp=new RegExp(allp); function findRow(box){ var tr=box.parentNode; while (tr.parentNode&&!/^tr$/i.test(tr.tagName)) tr=tr.parentNode; return /^tr$/i.test(tr.tagName)? tr : null; } function findCell(box){ var td=box.parentNode; while (td.parentNode&&!/^th$|^td$/i.test(td.tagName)) td=td.parentNode; return /^th$|^td$/i.test(td.tagName)? td : null; } function findCol(box){ var tr=findRow(box); for (var i_tem = 0; i_tem < tr.cells.length; i_tem++) if (tr.cells[i_tem]==findCell(box)) return tids? tr.parentNode.parentNode.id+i_tem : i_tem; } var boxes=[] function initcheckAll(){ var c=0, inp=document.getElementsByTagName('input'); for (var i_tem = 0; i_tem < inp.length; i_tem++) if (inp[i_tem].type.toLowerCase()=='checkbox'&&findCell(inp[i_tem])){ boxes[c++]=[inp[i_tem], findCell(inp[i_tem])]; boxes[c-1][0].col=findCol(boxes[c-1][0]) } for (i_tem = 0; i_tem < boxes.length; i_tem++) if (allp.test(boxes[i_tem][1].innerHTML)){ for (var i = 0; i < boxes[i_tem][1].childNodes.length; i++) if(initca&&boxes[i_tem][1].childNodes[i].tagName&&/^div$/i.test(boxes[i_tem][1].childNodes[i].tagName)) boxes[i_tem][1].childNodes[i].style.display='none'; else if(initca&&boxes[i_tem][1].childNodes[i].tagName) boxes[i_tem][1].childNodes[i].style.display='inline'; boxes[i_tem][0].onclick=function(){ for (var i_tem = 0; i_tem < boxes.length; i_tem++) if(this.checked&&boxes[i_tem][0].col==this.col) boxes[i_tem][0].checked=1; else if (boxes[i_tem][0].col==this.col) boxes[i_tem][0].checked=0; }; } else boxes[i_tem][0].onclick=function(){ if(!this.checked){ for (var i_tem = 0; i_tem < boxes.length; i_tem++) if(boxes[i_tem][0].col==this.col){ boxes[i_tem][0].checked=0; return; } } else{ var b=[]; for (var i_tem = 0; i_tem < boxes.length; i_tem++) if(boxes[i_tem][0].col==this.col) b[b.length]=boxes[i_tem][0]; if (!b[0].checked) for (i_tem = 1; i_tem < b.length; i_tem++) if(!b[i_tem].checked) return; b[0].checked=1; } }; } onload=initcheckAll; </script> </head> <body> <table id="t1" border="1"> <tr class="all"> <td class="info_head_rowa">1:</td> <td class="info_head_rowa">2:</td> <td class="info_head_rowa">3:</td> <td class="info_head_rowa">4:</td> <td class="info_head_rowa">5:</td> <td class="info_head_rowa">6:</td> <td class="info_head_rowa">7:</td> <td class="info_head_rowa">8:</td> <td class="info_head_rowa">Verified:<BR><div>Verified: </div><input type="checkbox"><span> All</span></td> <td class="info_head_rowa">10:</td> <td class="info_head_rowa">Deleted:<BR><div>Deleted: </div><input type="checkbox"><span> All</span></td> <td class="info_head_rowa">Edit:<BR><div>Edit: </div><input type="checkbox"><span> All</span></td> <td class="info_head_rowa" type="hidden"></td> </tr> <tbody class="info_report_row" onmouseover="this.className='info_report_row_over'" onmouseout="this.className='info_report_row'"> <tr> <td><input disabled="disabled" type="text" size="10" name="1" value="2012-07-22"></td> <td><input disabled="disabled" type="text" size="15" name="2" value="test0"></td> <td><input disabled="disabled" type="text" size="15" name="3" value=""></td> <td><input disabled="disabled" type="text" size="15" name="4" value=""></td> <td><input disabled="disabled" type="text" size="15" name="5" value=""></td> <td><input disabled="disabled" type="text" size="15" name="6" value=""></td> <td><input disabled="disabled" type="text" size="15" name="7" value=""></td> <td><select disabled="disabled" name="8" value=""><option name="0" value="0"></option><option name="1" value="1">1</option><option name="2" value="2">2</option></select></td> <td class="info_head_rowav"><input disabled="disabled" type="checkbox" name="verified" value="YES"></td> <td><input disabled="disabled" type="text" size="10" name="10" value=""></td> <td class="info_head_rowav"><input disabled="disabled" type="checkbox" name="deleted" value="YES"></td> <td>Edit<input type="checkbox" name="enable" onclick="enableDisable(this,'1','2','3','4','5','6','7','8','9','10','deleted','save')" /></td> </tr> <tr> <td><input disabled="disabled" type="text" size="10" name="1" value="2012-07-22"></td> <td><input disabled="disabled" type="text" size="15" name="2" value="test1"></td> <td><input disabled="disabled" type="text" size="15" name="3" value=""></td> <td><input disabled="disabled" type="text" size="15" name="4" value=""></td> <td><input disabled="disabled" type="text" size="15" name="5" value=""></td> <td><input disabled="disabled" type="text" size="15" name="6" value=""></td> <td><input disabled="disabled" type="text" size="15" name="7" value=""></td> <td><select disabled="disabled" name="8" value=""><option name="0" value="0"></option><option name="1" value="1">1</option><option name="2" value="2">2</option></select></td> <td class="info_head_rowav"><input disabled="disabled" type="checkbox" name="verified" value="YES"></td> <td><input disabled="disabled" type="text" size="10" name="10" value=""></td> <td class="info_head_rowav"><input disabled="disabled" type="checkbox" name="deleted" value="YES"></td> <td>Edit<input type="checkbox" name="enable" onclick="enableDisable(this,'1','2','3','4','5','6','7','8','9','10','deleted','save')" /></td> </tr> </tbody> <table width="100%" cellspacing="0" cellpadding="5"> <tr> <td width="100%" colspan="2" align="center"><button disabled="disabled" align="center" type="button" name="save" id="save" style="color: blue; font: bold" onClick="EditEvent()">Save changes</button></td> </tr> </table> </table> <div class="clear"></div> </body> </html> -->
Regards,
Mav
CSS Codes
Reply With Quote
Bookmarks