Solved: I need a javascript that will change inline style elements on keyup.

In the sample code below I have a field where I will enter the border width of a table. I need a a javascript function that will immediately apply the value entered in the table to the table border shown in red so that I don't have to update the database and refresh the page to see the change.

Thanks in advance for any suggestions.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
 
</head>
<body>
 
<table width="100%" border="1"><tr><td width="25%">
<form method="post" id="form1" >
<table cellpadding="2" cellspacing="0" class="KT_tngtable" >  
         <table cellpadding="2" cellspacing="0" class="KT_tngtable">
     <tr>
      <td ><label for="st_outer_border_width">Border Width:</label></td>
	      <td><input name="tbl_border_width" type="text" id="tbl_border_width" value="10" size="15" />           </td>
    </tr>
    </table>
  
</form>
<p>&nbsp;</p>
</td>
<td width="75%" align="center" valign="top" id="bodybg" bgcolor="#cccccc"><br />
      <br />
      <table width="600" border="10" cellspacing="0" cellpadding="0" name="outerTable" id="outerTable" bordercolor="#ff0000">
        <tr>
          <th scope="col">
          <table width="600" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td colspan="2" scope="col"  id="headerspace" height="150"  >&nbsp;</td>
            </tr>
            <tr >
              <td width="150">&nbsp;</td>
              <td width="450">&nbsp;</td>
            </tr>
            <tr>
              <td><p>&nbsp;</p>
                  <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p></td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
          </table></th>
        </tr>
      </table>
      </th></td>
</tr></table>
 
</body>
</html>

Open in new window