onblur hide the tr

[scvinodkumar]

i have the below form

 

<form name="tab_form" id="tab_form" action="javascript:tab_text(document.getElementById('tab_form'))">
  <table cellpadding="2" cellspacing="0" width="450" align="center" style="border:1px solid #CCCCCC;">
    <tr>
        <td align="center"><textarea name="test" id="test" onfocus="show_tabs();" cols="40" rows="1" style="width:435px;" /></textarea></td>
    </tr>    
    <tr>
        <td align="left" valign="top" style="padding:5px;">
            <table cellpadding="0" cellspacing="2" width="100%" id="tabs" style="display:none;">        
                <tr>
                    <td align="left" width="250">show tab1 | show tab2 | ...</td>
                </tr>
            </table>
            <table cellpadding="0" cellspacing="2" width="100%" id="tab1" style="display:none;border:1px solid #CCCCCC;">
                <tr><td align="left" width="250">tab1</td></tr>
            </table>
            <table cellpadding="0" cellspacing="2" width="100%" id="tab1" style="display:none;border:1px solid #CCCCCC;">
                <tr><td align="left" width="250">tab2</td></tr>
            </table>
            .
            .
            .
            .
        </td>
    </tr>
   </table>
</form>
<input type='text' name='rrr'>

 

By default, textarea only visible, when user clicks on the textarea, id='tabs' table shown.

 

If user clicks on tab1, it will show tab1 form below it.

 

I have done every thing so far correctly.

 

Now i want to close the tabs or any other form opened(tab1 or tab2,..) should be closed when the user is out the form. ie when the user tries to jump to last text box from textarea or form.

 

I hope u understand any problems.

 

[haku]

Create a function that hides the tabs, and attach it to the elements with onblur(). You pretty much said it yourself!

[scvinodkumar]

No, actually i want to hide the tabs only when the form is out of focus.

 

since we dont have option to add the onblur on form tag or table tag.

 

could you please tell me where to add the onblur tag so that the tabs hide when the form lose focus.

 

[corbin]

There's no way for a form to lose focus since a form is just an invisible container for form elements (input, textarea so on).

 

As such, you'll have to check individual elements or something.

[scvinodkumar]

thanks for your explanation.

 

Is it posssible on div?

 

for example,

 

<div>1</div>

<div>2</div>

 

just consider div2 is visible only if div 1 is focus, after losing focus on div1, div2 should be closed.

 

 

 

[corbin]

Yeah, I didn't think about a wrapper around the wrapper hehe.

 

 

Yes, a div with an onblur listener should work fine.