hide part of form

I have an asp.net mvc application where I want to hide/display part of form based on selected line in a dropdown list. This is done by jQuery script:

<script type="text/javascript" >
    $(document).ready(function() {
        $('#owners').change(function() {
            $("select option:selected").each(function() {
                $('.location').css("display", "none");
                $('#canDeleteUsers').css("display", "none");                    
            });
            if (($("option:selected").attr("value")) == "") {
                $("select option:selected").each(function() {
                    $('.location').css("display", "block");
                    $('#canDeleteUsers').css("display", "block");
                });
            }
        });
    });            
</script>

Now the problem is that when a user violates some of the logic and I return the View again to be validated, if the dropdown list was selected to the variant, which is supposed to hide 开发者_JAVA百科the form part, it still appears.

Any ideas about it? Thanks in advance.

Sure; the page is reloaded and the visibility will reset.

One option would be to move the logic that determines whether to hide the form part into a separate (named) function, and call that function once on document.ready as well as on the change event of the dropdown.

Extract your logic for hiding showing the form out into a function on it's own. Call this function on the change event and also call it on document ready.