Home/ Questions/Q 628815
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T19:40:39+00:00

I have a scenario where I have a container control (basically a ASP.Net user

  • 0

I have a scenario where I have a container control (basically a ASP.Net user control) and it has couple of child controls. I want the control to collectively determine lost focus event. For example I want the parent control to tell me it has focus only when any of the child control receives the focus and it should tell me that it lost the focus if all of the child control looses the focus.

As a simulation refer to the code below. If you run this sample, you would notice that when you click on Blue rectangle, it would say Blue Focused, then if you click on the Red one, it would say Blue Blur, Red Focused. What I need is when I click on any of them, it should tell me Red Focused and when I click outside it should click Red Blur.

Could some one help me with this?

Thanks

<head runat="server">
<title>Untitled Page</title>

  <script type="text/javascript" language="javascript">
    function RedFocus()   { alert('RedFocus');   }
    function BlueFocus()  { alert('BlueFocus');  }
    function GreenFocus() { alert('GreenFocus'); }
    function RedBlur()    { alert('RedBlur');    }
    function BlueBlur()   { alert('BlueBlur');   }
    function GreenBlur()  { alert('GreenBlur');  }
  </script>
</head>
<body>
<div onblur="RedBlur()" onfocus="RedFocus()"
  style="background-color: Red; width: 400px; height: 400px;">
  <div onblur="BlueBlur()" onfocus="BlueFocus()"
    style="background-color: Blue; width: 200px; height: 200px; margin: 50px">
    <div onblur="GreenBlur()" onfocus="GreenFocus()"
      style="background-color: Green; width: 100px; height: 100px; margin: 25px">
    </div>
  </div>
</div>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Since the events are not in the order you prefer them to be, why not use a simple timer and a global variable?

    parentfocus;
function greenBlur()
{
    parentfocus = setTimeout(parentHasBlured,50);
}
function blueFocus()
{
    clearTimeout(parentfocus);
}

function parentHasBlured()
{
    //Logic here
}

    Since the events are so tightly packed a 50ms delay should be enough to do the trick (less could probably do it aswell)

    • 0