Question

I created two dropdpwn calendar in my form with these codes:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#Calimg1').click(function () {
            $('#calblock1').slideToggle("slow");
        });
    });

    $(document).ready(function () {
        $('#Img1').click(function () {
            $('#Div2').slideToggle("slow");
        });
    });
</script>

I want to do another thing but I dont know how? If one of this calendar is open, the user is not able to open another one. how can I do that?

Answer 1

You can use is(':visible'):

<script type="text/javascript">
    $(document).ready(function () {
        $('#Calimg1').click(function () {
            if (isAnyVisible()) return false;
            $('#calblock1').slideToggle("slow");
        });

        $('#Img1').click(function () {
            if (isAnyVisible()) return false;
            $('#Div2').slideToggle("slow");
        });
    });

    function isAnyVisible() {
      if ($('#Calimg1').is(':visible') || $('#Img1').is(':visible')) {
         return false;
      }
      return true;
    }
</script>

The #Calimg1 and #Img1 are assumed to be the ids of your calendars, modify accordingly (in isAnyVisible function) just in case they are different.