c# - Tab index handling - ASP.NET MVC form controls -
i have web page has basic registration field name, dob, address etc. page has controls (text box, dob etc) shown or hidden based on radio button selection. currently, when end user fills page using tab key hidden controls getting focus , tab out not working expected (current implementation not have tab indexes set).
i tried manually setting tab indexes in incremental order controls. moving , forth or after switching between radio button selections, tab out scenario not working properly.
is there work around handle scenario? appreciated.
you need set display: none
instead of opacity: 0
controls removed flow. opacity: 0
means controls still there, invisible, can still receive focus , input, on code snippet below, can still click in invisible control between 2 visible controls.
display: none
means controls not there anymore can't receive focus , input.
you can refer code snippet below see comparison.
.opacity .hidden { opacity: 0; } .display .hidden { display: none; }
<h3>opacity: 0 style</h3> <form class="opacity"> <input type="text" /> <input type="text" class="hidden" /> <input type="text" /> </form> <h3>display: none style</h3> <form class="display"> <input type="text" /> <input type="text" class="hidden" /> <input type="text" /> </form>
Comments
Post a Comment