Scroll to specific location within a div

I have the following div
<div id="inlineScroll" style="margin: 0; padding: 0; overflow: auto; height:250">
</div>

within the div is a form and a dynamically generated table which can have from 0 to 10 elements, each element is approximately 250 px high, currently if the user submits the form the incomplete required field receives the focus, which brings most of the element into display however the element name and description are not displayed as they are above the form element, i would like to scroll to the top of the element as well as set the focus on the incomplete text box. at the top of the element is a named anchor with an identiofier to the element
LVL 25
James RodgersWeb Applications DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

devicCommented:
hi Jester_48,

here example:
=====================
<div id="inlineScroll" style="margin: 0; padding: 0; overflow: auto; height:250; width:100">
<a href=#aaa>scroll to AAAA</a>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
sdffffffffffffffffff<br>
<a name=#aaa></a>AAAA
sdffffffffffffffffff<br><br>
sdffffffffffffffffff
sdffffffffffffffffff
</div>
0
devicCommented:
here is with form:

=======================
<div id="inlineScroll" style="margin: 0; padding: 0; overflow: auto; height:250; width:300">
<a href=javascript:document.forms[0].q12.focus()>focus q12</a>
<form action=http://www.google.com/search>
      <input type=text name=q1 value=q1><br>
      <input type=text name=q2 value=q2><br>
      <input type=text name=q3 value=q3><br>
      <input type=text name=q4 value=q4><br>
      <input type=text name=q5 value=q5><br>
      <input type=text name=q6 value=q6><br>
      <input type=text name=q7 value=q7><br>
      <input type=text name=q8 value=q8><br>
      <input type=text name=q9 value=q9><br>
      <input type=text name=q10 value=q10><br>
      <input type=text name=q11 value=q11><br>
      <input type=text name=q12 value=q12><br>
      <input type=text name=q13 value=q13><br>
      <input type=text name=q14 value=q14><br>
      <input type=text name=q15 value=q15><br>
      <input type=text name=q16 value=q16><br>
      <input type=text name=q17 value=q17><br>
      <input type=text name=q18 value=q18><br>
      <input type=text name=q19 value=q19><br>
      <input type=submit>
</form>
</div>
0
James RodgersWeb Applications DeveloperAuthor Commented:
i need to do it from within the validation routine

something like

function validateForm(objForm){
...
if(!document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length && !document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length){
document.getElementById(secCom1).focus();
//go to named anchor here
err=err+"You have not provided your developement goals.\n";
bValid=false;
                  }
else if((document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length || document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length) &&!document.getElementById(secSup).value.replace(/^\s+|\s+$/g,"").length ){
document.getElementById(secSup).focus();
// go to named anchor here
err=err+"You have not provided your supporting facts.\n";
                        bValid=false;
                  }
            }
      if(err){
            alert(err);
      }
      return false;
      }
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

James RodgersWeb Applications DeveloperAuthor Commented:
what i have in the scrolling div is
-----------------------------------------------------------------------  // if the user does not
sectionid : section description
-----------------------------------------------------------------------  // complete the required fields the focus is set on the
text area1                                                                            // required field, which will hide the section id and
                                                                                          // description, i need to scroll to show the
              ------------------------------------------------------------ // id and description
text area2
             
              ------------------------------------------------------------
text area3
             
              ------------------------------------------------------------
0
devicCommented:
ok call from you validation function

document.forms[0].field.focus();

if you want complete solution, post complete code :)
0
James RodgersWeb Applications DeveloperAuthor Commented:
no, there is a focus call within the validation, but i need to scroll up about from the focused filed to the section header
so that this
                                                               
              ------------------------------------------------------------
text area2  this area has focus
             
              ------------------------------------------------------------
text area3
             
              ------------------------------------------------------------
becomes this

-----------------------------------------------------------------------  
sectionid : section description
-----------------------------------------------------------------------  
text area1                                                                          
                                                                                         
              ------------------------------------------------------------
text area2 this area has focus
                but section header shows
              ------------------------------------------------------------
text area3
             
              ------------------------------------------------------------


0
devicCommented:
do you want to sroll inside of textarea?
0
James RodgersWeb Applications DeveloperAuthor Commented:
no not the text area within the div, here is the entire page code, it might give a better idea of teh problem and wht it is i am trying to do



  <style type="text/css">
      body
      {
       scrollbar-3d-light-color:FFFFCC;
       scrollbar-arrow-color:000000;
       scrollbar-base-color:525252;
       scrollbar-dark-shadow-color:F2F2F2;
       scrollbar-face-color:D8DFF3;
       scrollbar-highlight-color:808080;
       scrollbar-shadow-color:000000;
       }
       </style> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
      <title>Untitled</title>
      <style>
      table,th,td{
      font-size:10pt;
      vertical-align:top;
}

table{
      align:center;
}
      
      </style>
      <script>
      function resizeToContent(){
            var x =document.getElementById("dynamTbl").scrollHeight;
            var z = x;
            var y =screen.availHeight-100;
            while (x < y){
                  x+=1;
            }
            x-=z;
            document.getElementById("inlineScroll").style.height=x
      }
      
      function validateForm(objForm){
            var bValid=true;
            var err="";      
            for(var x=0; x<arrID.length && bValid;x++){
                  secCom1=arrID[x]+'COMMENTS12';
                  secCom2=arrID[x]+'COMMENTS35';
                  secSup=arrID[x]+'SUPPORTINGCOMMENTS';
                  secAnchor ='anchor'+arrID[x];
                  if(!document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length && !document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length){
                        document.getElementById(secCom1).focus();
                        err=err+"You have not provided your developement goals.\n";
                        bValid=false;
                  }
                  else if((document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length || document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length) &&!document.getElementById(secSup).value.replace(/^\s+|\s+$/g,"").length ){
                        document.getElementById(secSup).focus();
                        err=err+"You have not provided your supporting facts.\n";
                        bValid=false;
                  }
            }
      if(err){
            alert(err);
      }
      return false;
      }
      </script>
</head>

<body>
 
 
 
 
 
 
 
 
 
 
       
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                     
                   
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                         
                     
                                 
                      
                      
                          
                                       
                      
                      
                          
                                       
                      
                      
                          
                         
                                       
                      
                      
                          
                         
                         
                     
                   
                         
                         
                                       
                      
                      
                          
                         
                         
                     
                   
                         
                                       
                      
                      
                          
                         
                         
                     
                   
                                       
                      
                      
                          
                         
                         
                     
                                 
                      
                      
                          
                         
                         
                     
                   
                         
                     
                  
</script>
            <table align="center" width="600" id="dynamTbl" border="0">
      <tr>
            <td>
                  <table border="0">
                        <caption>What are my development goals</caption>
                        <tr>
                              <td>The previous activity helped you consider various development directions. Those that received the height realism scores (listed below) are probably the most realistic.
                              
                              </td>
                        </tr>
                        <tr>
                              <td>
                                    You will now target specific development goals. It  is both acceptable and advisable to target several. You should always have some goals related to your current position, even if you eventually expect to move on. For example it is always necessary to have some development goals related top improving your skills and staying current regardless of what other goals you may have.
                                    You can also have several goals related to the same development direction. For example, you may decide on several development challenges you would like to build into your current position.
                              </td>
                        </tr>
                        <tr>
                              <td>Your goals should communicate what you want to accomplish and be as specific as possible(for example, the improvement of a specific skill or preparation for a specific assignment) and the amount of time achieving your goal will take.</td>
                        </tr>
                        <tr>
                              <td>
                                    <ul style="margin-bottom:0">
                                          <li>"Improve my managerial skills" and "prepare for lateral rotation are too general</li>
                                          <li>"Improve my team building skills during the next quarter in my current position" or "prepare for lateral rotation to hub operations within the next two years" are specific</li>
                                    </ul>
                              </td>
                        </tr>
                        <tr>
                              <td>
                                    Using these guidelines, write your developmental goals for the next 1-2 years, 3-5 years and the supporting factors<span style="color:red">*</span> on the appropriarte area for each development direction.
                              </td>
                        </tr>
                        <tr>
                              <td>
                                    <span style="color:red; font-size:12pt">*</span>Setting development goals also reqires demonstrating that they are supported by by facts that show tha goals are compatible with both your needs and UPS's needs. Thes supporting facts should point out how your targeted development goals are
                                    <ul style="margin-bottom:0;margin-top:0">
                                          <li>relevant to your skills, interests, values, and development needs</li>
                                          <li>realistic in relation to your capabilities and development potential</li>
                                          <li>relevant to UPS's current and future business needs</li>
                                          <li>realistic in relation to potential opportunities within UPS</li>
                                    </ul>
                              </td>
                        </tr>
                  </table>
            
            </td>
      </tr>
      <tr>
            <td>
                  <table>
                        <tr>
                              <th width="303">Development Directions</th>
                              <th width="78">Mgr. Support</th>
                              <th width="78">Bus. Needs</th>
                              <th width="78">Your Needs</th>
                              <th width="78">Realism Score</th>
                        </tr>
                  </table>
            </td>
       </tr>
       <tr>
             <td>
      
       <form name="devGoals" action="" method="post" onSubmit="return validateForm(this)">
<div id="inlineScroll" style="margin: 0; padding: 0; overflow: auto; height:250">
      <table  border="1" style="border:2px outset #d8dff3">

      

              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">H<a name="anchorH"></a></th>
                                                <th align="left">Prepare for a lateral rotation </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Preparing to move to another assignment at the same level of responsibility.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            5
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            3
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            5
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            13
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="HCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="HCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="HSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">D<a name="anchorD"></a></th>
                                                <th align="left">Incorporate more of the interests in your current position </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Getting involved in aspects of your work that you would find interesting and enjoyable.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            4
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            5
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            11
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="DCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="DCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="DSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">E<a name="anchorE"></a></th>
                                                <th align="left">Better satisfy your values in your current position </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Getting involved in job activities to which you feel a strong sense of commitment.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            4
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            5
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            11
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="ECOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="ECOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="ESUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">F<a name="anchorF"></a></th>
                                                <th align="left">Building development challenges into your current position </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Incorporating tasks that stretch you and provide opportunities for learning and growth.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            3
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            5
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            10
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="FCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="FCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="FSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">A<a name="anchorA"></a></th>
                                                <th align="left">Improve your skills </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Continuously improving to ensure career success.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            4
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            3
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            9
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="ACOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="ACOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="ASUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">G<a name="anchorG"></a></th>
                                                <th align="left">Prepare for promotion </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Preparing to move up a level in responsibility.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            4
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            3
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            9
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="GCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="GCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="GSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   



              
            
            
                  <tr>
                              <td>
                                    <table width="300">
                                          <tr>
                                                <th width="30">I<a name="anchorI"></a></th>
                                                <th align="left">Prepare for temporary assignment/special project </th>
                                          </tr>
                                          <tr>
                                                <td></td>
                                                <td> Preparing for a brief assignment usually to provide a brief exposure to/awareness of a new area.</td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            3
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            2
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            4
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                              <td>
                                    <table width="75">
                                          <tr>
                                                <td align="center">
                                                            9
                                                      </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>      
                        <tr>
                              <td colspan="5">
                                    <table>
                                          <tr valign="top">
                                                <td>1-2 Year Goals</td>
                                                <td><textarea name="ICOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>3-5 Year Goals</td>
                                                <td><textarea name="ICOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                          <tr valign="top">
                                                <td>Supporting Factors</td>
                                                <td><textarea name="ISUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                          </tr>
                                    </table>
                              </td>
                           </tr>            

   








<tr>
      <td colspan="5" align="center"><input type="submit" value="submit"></td>
</tr>
</table>
</div>
</form>
      </td>
      </tr>
</table>
<script>
 var arrID= new Array();
 
 arrID[0]='H';
 
 arrID[1]='D';
 
 arrID[2]='E';
 
 arrID[3]='F';
 
 arrID[4]='A';
 
 arrID[5]='G';
 
 arrID[6]='I';
 
 arrID[7]='C';
 
 arrID[8]='J';
 
 arrID[9]='B';
 
</script>

</body>
</html>
0
devicCommented:
here:
==============
 <style type="text/css">
     body
    {
     scrollbar-3d-light-color:FFFFCC;
     scrollbar-arrow-color:000000;
     scrollbar-base-color:525252;
     scrollbar-dark-shadow-color:F2F2F2;
     scrollbar-face-color:D8DFF3;
     scrollbar-highlight-color:808080;
     scrollbar-shadow-color:000000;
     }
     </style> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
    <style>
    table,th,td{
    font-size:10pt;
    vertical-align:top;
}

table{
    align:center;
}
   
     </style>
    <script>
    function resizeToContent(){
         var x =document.getElementById("dynamTbl").scrollHeight;
         var z = x;
         var y =screen.availHeight-100;
         while (x < y){
              x+=1;
         }
         x-=z;
         document.getElementById("inlineScroll").style.height=x
    }
   
     function validateForm(objForm){
         var bValid=true;
         var err="";    
          for(var x=0; x<arrID.length && bValid;x++){
              secCom1=arrID[x]+'COMMENTS12';
              secCom2=arrID[x]+'COMMENTS35';
              secSup=arrID[x]+'SUPPORTINGCOMMENTS';
              secAnchor ='anchor'+arrID[x];
              if(!document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length && !document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length){
                   //document.getElementById(secCom1).focus();
                           document.location.href="#anchor"+arrID[x]
                   err=err+"You have not provided your developement goals.\n";
                   bValid=false;
              }
              else if((document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length || document.getElementById(secCom1).value.replace(/^\s+|\s+$/g,"").length) &&!document.getElementById(secSup).value.replace(/^\s+|\s+$/g,"").length ){
                   //document.getElementById(secSup).focus();
                            document.location.href="#anchor"+arrID[x]
                   err=err+"You have not provided your supporting facts.\n";
                   bValid=false;
              }
         }
    if(err){
         alert(err);
    }
    return false;
    }
    </script>
</head>

<body>          

         <table align="center" width="600" id="dynamTbl" border="0">
    <tr>
         <td>
              <table border="0">
                   <caption>What are my development goals</caption>
                   <tr>
                        <td>The previous activity helped you consider various development directions. Those that received the height realism scores (listed below) are probably the most realistic.
                       
                         </td>
                   </tr>
                   <tr>
                        <td>
                             You will now target specific development goals. It  is both acceptable and advisable to target several. You should always have some goals related to your current position, even if you eventually expect to move on. For example it is always necessary to have some development goals related top improving your skills and staying current regardless of what other goals you may have.
                             You can also have several goals related to the same development direction. For example, you may decide on several development challenges you would like to build into your current position.
                        </td>
                   </tr>
                   <tr>
                        <td>Your goals should communicate what you want to accomplish and be as specific as possible(for example, the improvement of a specific skill or preparation for a specific assignment) and the amount of time achieving your goal will take.</td>
                   </tr>
                   <tr>
                        <td>
                             <ul style="margin-bottom:0">
                                  <li>"Improve my managerial skills" and "prepare for lateral rotation are too general</li>
                                  <li>"Improve my team building skills during the next quarter in my current position" or "prepare for lateral rotation to hub operations within the next two years" are specific</li>
                             </ul>
                        </td>
                   </tr>
                   <tr>
                        <td>
                             Using these guidelines, write your developmental goals for the next 1-2 years, 3-5 years and the supporting factors<span style="color:red">*</span> on the appropriarte area for each development direction.
                         </td>
                   </tr>
                   <tr>
                        <td>
                             <span style="color:red; font-size:12pt">*</span>Setting development goals also reqires demonstrating that they are supported by by facts that show tha goals are compatible with both your needs and UPS's needs. Thes supporting facts should point out how your targeted development goals are
                             <ul style="margin-bottom:0;margin-top:0">
                                  <li>relevant to your skills, interests, values, and development needs</li>
                                  <li>realistic in relation to your capabilities and development potential</li>
                                  <li>relevant to UPS's current and future business needs</li>
                                  <li>realistic in relation to potential opportunities within UPS</li>
                             </ul>
                        </td>
                   </tr>
              </table>
         
         </td>
    </tr>
    <tr>
         <td>
              <table>
                   <tr>
                        <th width="303">Development Directions</th>
                        <th width="78">Mgr. Support</th>
                        <th width="78">Bus. Needs</th>
                        <th width="78">Your Needs</th>
                        <th width="78">Realism Score</th>
                   </tr>
              </table>
          </td>
     </tr>
     <tr>
          <td>
     
     <form name="devGoals" action="" method="post" onSubmit="return validateForm(this)">
<div id="inlineScroll" style="margin: 0; padding: 0; overflow: auto; height:250">
    <table  border="1" style="border:2px outset #d8dff3">

   

           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">H<a name="anchorH"></a></th>
                                       <th align="left">Prepare for a lateral rotation </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Preparing to move to another assignment at the same level of responsibility.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 5
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 3
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 5
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 13
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="HCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="HCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="HSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">D<a name="anchorD"></a></th>
                                       <th align="left">Incorporate more of the interests in your current position </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Getting involved in aspects of your work that you would find interesting and enjoyable.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 4
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 5
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 11
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="DCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="DCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="DSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">E<a name="anchorE"></a></th>
                                       <th align="left">Better satisfy your values in your current position </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Getting involved in job activities to which you feel a strong sense of commitment.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 4
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 5
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 11
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="ECOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="ECOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="ESUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">F<a name="anchorF"></a></th>
                                       <th align="left">Building development challenges into your current position </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Incorporating tasks that stretch you and provide opportunities for learning and growth.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 3
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 5
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 10
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="FCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="FCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="FSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">A<a name="anchorA"></a></th>
                                       <th align="left">Improve your skills </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Continuously improving to ensure career success.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 4
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 3
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 9
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="ACOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="ACOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="ASUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">G<a name="anchorG"></a></th>
                                       <th align="left">Prepare for promotion </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Preparing to move up a level in responsibility.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 4
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 3
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 9
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="GCOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="GCOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="GSUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 



           
         
         
               <tr>
                        <td>
                             <table width="300">
                                  <tr>
                                       <th width="30">I<a name="anchorI"></a></th>
                                       <th align="left">Prepare for temporary assignment/special project </th>
                                  </tr>
                                  <tr>
                                       <td></td>
                                       <td> Preparing for a brief assignment usually to provide a brief exposure to/awareness of a new area.</td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 3
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 2
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 4
                                            </td>
                                  </tr>
                             </table>
                        </td>
                        <td>
                             <table width="75">
                                  <tr>
                                       <td align="center">
                                                 9
                                            </td>
                                  </tr>
                             </table>
                        </td>
                   </tr>    
                    <tr>
                        <td colspan="5">
                             <table>
                                  <tr valign="top">
                                       <td>1-2 Year Goals</td>
                                       <td><textarea name="ICOMMENTS12" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>3-5 Year Goals</td>
                                       <td><textarea name="ICOMMENTS35" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                                  <tr valign="top">
                                       <td>Supporting Factors</td>
                                       <td><textarea name="ISUPPORTINGCOMMENTS" cols="60" rows="3" wrap="soft"></textarea></td>
                                  </tr>
                             </table>
                        </td>
                      </tr>          

 








<tr>
    <td colspan="5" align="center"><input type="submit" value="submit"></td>
</tr>
</table>
</div>
</form>
    </td>
    </tr>
</table>
<script>
var arrID= new Array();

 arrID[0]='H';

 arrID[1]='D';

 arrID[2]='E';

 arrID[3]='F';

 arrID[4]='A';

 arrID[5]='G';

 arrID[6]='I';

 arrID[7]='C';

 arrID[8]='J';

 arrID[9]='B';

</script>

</body>
</html>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
James RodgersWeb Applications DeveloperAuthor Commented:
that did the trick

kept in the focus() processes tho, after the element block is scrolled to still need to set focus on the required field

thanks
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.