when text changed inputbox automatically updates next text boxes?

Posted by James123 on Stack Overflow See other posts from Stack Overflow or by James123
Published on 2010-05-12T23:15:26Z Indexed on 2010/05/13 2:34 UTC
Read the original article Hit count: 213

Filed under:
|
|

Extension to my previous question http://bit.ly/c5yiVM

I have 7 textboxes. If Top 1 textbox(Volume All Years) text changed, text need to be updated in next 6 inputboxes(Latest 2009 Volume to Latest 2014 Volume). I need javascript or Jquery for this. I will write Js textchanged() or focuschange() for top 1 textbox. So what should I write in focuschage() or textchanged methods().

I changed little bit in code. Now Html will like below. These textboxes have common CssClass. volumetextbox. Can we use this class and change text in all textboxes those have same CssClass.

<tr id="row12_136" class="RegText">
   <td style="width:420px;Padding-right:20px;">Volume All Years</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_136" tabindex="61" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>
<tr id="row12_60" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2009 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_60" tabindex="56" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>
<tr id="row12_61" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2010 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_61" tabindex="57" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>
<tr id="row12_62" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2011 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_62" tabindex="58" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>
<tr id="row12_63" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2012 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_63" tabindex="59" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>
<tr id="row12_64" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2013 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_64" tabindex="60" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>

<tr id="row12_65" class="RegText">
   <td style="width:420px;Padding-right:20px;">Latest 2014 Volume</td> 
   <td style="width:420px;Padding-left:0px;">
       <input name="12_136" type="text" maxlength="255" id="12_65" tabindex="61" title="Volume All Years" class="volumetextbox" OnKeyPress="javascript:FocusChange();" style="width:300px;" />
    </td>

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery