jasonc Posted April 2, 2009 Share Posted April 2, 2009 want to swap the contents of two textarea fields in my form when a hyperlink is clicked. i have the hyperlink and layout donw just want to know how i access and set the form fields to their new values, please can someone help me out. function MoveBoxContent(thisForm, FieldID, MoveWhere) { if( $MoveWhere == "u" ) { $temp = theForm.$FieldID.value; theForm.$FieldID.value = theForm.($FieldID-1).value; theForm.$FieldID+1.value = $temp; } } Quote Link to comment Share on other sites More sharing options...
xtopolis Posted April 3, 2009 Share Posted April 3, 2009 var item1 = document.getElementById("nameOfTextarea1").innerHTML; var item2 = document.getElementById("nameOfTextarea2").innerHTML; var temp = item1; item1 = item2; item2 = temp; Something like that. You're likely having trouble because Textarea's use .innerHTML while inputs use .value if I remember correctly. Quote Link to comment Share on other sites More sharing options...
jasonc Posted April 3, 2009 Author Share Posted April 3, 2009 nope still not working, but I did notice this time around that my firefox firebug kicks up error that the function is not defined. I have included my completely testing code.. <html> <head> <title>test_move_box_content.php</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/javascript"> function MoveBoxContent(thisForm, FieldID, MoveWhere) { if( MoveWhere == "u" ) { var item1 = document.getElementById(FieldID).innerHTML; var item2 = document.getElementById(FieldID-1).innerHTML; var temp = item1; item1 = item2; item2 = temp; /* var temp = thisForm.FieldID.innerHTML; thisForm.FieldID.value = thisForm.(FieldID-1).innerHTML; thisForm.(FieldID-1).innerHTML = temp; */ } } </style> <style type="text/css"> <!-- div.boxedarea { border: 1px solid #fff; position: align: center;} a.boxedarea { text-decoration: none; color: #777777; } --> </style> </head> <body> <div style="text-align: center;"> <form action="" method="post"> <? $j = 4; for ($i = 1; $i <= $j; $i ++) { ?> <div class="boxedarea"> <? if ($i > 1) { ?><a class="boxedarea" href="#" onClick="MoveBoxContent(thisForm, <?=$i;?>, u);">move up</a><? } ?> <br><a class="boxedarea" href="#" onClick="MoveBoxContent(thisForm, <?=$i;?>, l);">move left</a> <textarea name="<?=$i;?>" cols="80"></textarea> <a class="boxedarea" href="#" onClick="MoveBoxContent(thisForm, <?=$i;?>, r);">move right</a><br> <? if ($i < $j) { ?><a class="boxedarea" href="#" onClick="MoveBoxContent(thisForm, <?=$i;?>, d);">move down</a><? } ?> </div> <? } ?> </form> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
xtopolis Posted April 3, 2009 Share Posted April 3, 2009 At a glance, I don't see where "thisForm" is defined anywhere. If you are trying to use a 'this' reference, I refer you to here: http://www.quirksmode.org/js/this.html Quote Link to comment Share on other sites More sharing options...
jasonc Posted April 3, 2009 Author Share Posted April 3, 2009 i still get the fuction is not defined Quote Link to comment Share on other sites More sharing options...
jasonc Posted April 3, 2009 Author Share Posted April 3, 2009 my code now... <html> <head> <title>test_move_box_content.php</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/javascript"> <!-- function MoveBoxContent(this, FieldID, MoveWhere) { alert( FieldID); if( MoveWhere == "u" ) { var temp = this.FieldID.innerHTML; this.FieldID.value = this.(FieldID-1).innerHTML; this.(FieldID-1).innerHTML = temp; } } --> </style> <style type="text/css"> <!-- div.boxedarea { border: 1px solid #fff; position: align: center;} a.boxedarea { text-decoration: none; color: #777777; } --> </style> </head> <body> <div style="text-align: center;"> <form name="form1" method="post" action=""> <? $j = 4; for ($i = 1; $i <= $j; $i ++) { ?> <div class="boxedarea"> <? if ($i > 1) { ?><a class="boxedarea" href="#" onClick="MoveBoxContent(this, <?=$i;?>, 'u');">move up</a><? } ?> <br><a class="boxedarea" href="#" onClick="MoveBoxContent(this, <?=$i;?>, 'l');">move left</a> <textarea id="<?=$i;?>" name="<?=$i;?>" cols="80"></textarea> <a class="boxedarea" href="#" onClick="MoveBoxContent(this, <?=$i;?>, 'r');">move right</a><br> <? if ($i < $j) { ?><a class="boxedarea" href="#" onClick="MoveBoxContent(this, <?=$i;?>, 'd');">move down</a><? } ?> </div> <? } ?> </form> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
xtopolis Posted April 4, 2009 Share Posted April 4, 2009 Hahaha... you'll kick yourself for this. <style type="text/javascript"> vs <script type="text/javascript"> You're like me, you error with style!... when you want script >.> Secondly, in the function and function signature itself, I think the "this" argument should have a different name, leaving "this" only in the onclick event calls. I'm not 100% on this. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.