slideDown di menu in loop

fraDip

Nuovo Utente
25 Mar 2014
1
0
0
Ciao,
sono un newbie per quanto riguarda jquery.
Sto avendo problemi con un menu. In particolare quello che che succede è cliccare su un item, aprire il sottomenu e cliccare su una voce che mi carica un form.
Quando però provo a cliccare su un qualsiasi altro item, questo si apre e si richiude, privandomi della possibilità di selezionare le sotto voci.
Posto il codice che gestisce il menù:
Codice:
$(document).ready(function(){
  $('#sideMenu > ul > li:has(ul)').addClass("has-sub");

  $('#sideMenu > ul > li > a').click(function() {
    var checkElement = $(this).next();
    
    $('#sideMenu li').removeClass('active');
    $(this).closest('li').addClass('active');
    
    if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
	//alert('alert1');
      $(this).closest('li').removeClass('active');
      checkElement.slideUp('normal');
    }
    
    if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
      $('#sideMenu ul ul:visible').slideUp('normal');
      checkElement.slideDown('normal');
    }
    
    if (checkElement.is('li')) {
      return true;
    } else {
      return false;	
    }		
  });
});
In allegato invece c'è la paginacon il menù vero e proprio(all'interno sono definitie altre funzioni per il caricamento dei vari form-il css lo tralascio ovviamente).
Grazie in anticipo...e scusate per il pessimo codice :(
 

Allegati

Ciao, a me l'apri/chiudi del menu funziona
Codice:
<html>
    <head>
        <title>SLA Managing</title>  
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <script language ="javascript">
            function checkAction(event, button){
                event.preventDefault();
                var $form = $(button).closest('form');
                var action = $form.attr('action');
                var applCd = $("#applCd").val();
                var actionType = $form.attr('tipoAzione').trim();
                if(actionType == 'src')
                    performSearch(event, button);
                else if(actionType == 'update'){
                    performSearchUpdate(event, button);
                }
                else{
                    performInsert(event, button);
                }
            }
        
        
            function performSearch(event, button){

                event.preventDefault();
                var $form = $(button).closest('form');
                var action = $form.attr('action');
                //     		var actionType = $form.attr('tipoAzione');
                //     		alert(actionType);
                $.ajax({
                    url: action,
                    data: $form.serialize(),
                    success: function(data, status, xhr){
                        $('#searchForm').html(null);
                        $('#resultTable').html(data);
                        $('#updateForm').html(null);
                    }
                });
            }
        
            function selectResultTableItem(){
                event.preventDefault();
                alert("item selected");
                var $form = $(button).closest('form');
                var action = $form.attr('action');
                $.ajax({
                    url: action,
                    success: function(data, status, xhr){
                        $('#searchForm').html(null);
                        $('#resultTable').html(null);
                        $('#resultTable').html(data);
                        $('#updateForm').html(data);
                    }
                });
            }
      
            function performSearchUpdate(event, button){
                event.preventDefault();
                var $form = $(button).closest('form');
                var action = $form.attr('action');
                $.ajax({
                    url: action,
                    data: $form.serialize(),
                    success: function(data, status, xhr){
                        $('#searchForm').html(null);
                        $('#resultTable').html(data);
                        //     				$('#updateForm').html(data);
                    }
                });
            }
        
            function performInsert(event, button){
                event.preventDefault();
                var $form = $(button).closest('form');
                var action = $form.attr('action');
                $.ajax({
                    url: action,
                    data: $form.serialize(),
                    success: function(data, status, xhr){
                        alert("inserimento ok");
                    }
                });
            }
            $(document).ready(function(){	            
                $('#sideMenu a.sideMenuActionItem').click(
                function(e){
                    e.preventDefault();
                    var href = this.href;
                    $.ajax({
                        url: href,
                        success: function(data, status, xhr){
                            $('#searchForm').html(data);
                        }
                    });
                    $('#resultTable').html(null);
                    $('#updateForm').html(null);
                }
            );
                $('#sideMenu > ul > li:has(ul)').addClass("has-sub");

                $('#sideMenu > ul > li > a').click(function() {
                    var checkElement = $(this).next();
    
                    $('#sideMenu li').removeClass('active');
                    $(this).closest('li').addClass('active');
    
                    if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
                        //alert('alert1');
                        $(this).closest('li').removeClass('active');
                        checkElement.slideUp('normal');
                    }
    
                    if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
                        $('#sideMenu ul ul:visible').slideUp('normal');
                        checkElement.slideDown('normal');
                    }
    
                    if (checkElement.is('li')) {
                        return true;
                    } else {
                        return false;	
                    }		
                });   
            });
        </script>
        <style>
            ul ul {
                display:none;
            }
        </style>
    </head>
    <body>

        <div id='sideMenu'>
            <ul>
                <li><a href='#'><span>Home</span></a></li>
                <li><a href='#'><span>Applications</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=1&tipoAzione=ins">Insert Application</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=1&tipoAzione=src">Search Application</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>Job</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=6&tipoAzione=ins">Insert Job</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=6&tipoAzione=src">Search Job</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>Report</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=11&tipoAzione=ins">Insert Report</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=11&tipoAzione=src">Search Report</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>Step</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=16&tipoAzione=ins">Insert Step</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=16&tipoAzione=src">Search Step</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>WorkFlow</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=22&tipoAzione=ins">Insert WorkFlow</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=22&tipoAzione=src">Search WorkFlow</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>WorkFlow Step</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=27&tipoAzione=ins">Insert WF Step</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=27&tipoAzione=src">Search WF Step</a></li>
                    </ul>
                </li>
                <li><a href='#'><span>TabReminder</span></a>
                    <ul>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=32&tipoAzione=ins">Insert TabReminder</a></li>
                        <li><a class="sideMenuActionItem" href="/SLAManaging/SLA/comando?azione=32&tipoAzione=src">Search TabReminder</a></li>
                    </ul>
                </li>
            </ul>
        </div>

        <div id="mainPane">
            <div id="logo">
                <img src="/SLAManaging/layout/images/co_logo_us_sm.gif"></img>
                <img src="/SLAManaging/layout/images/logo_cfo_dwh_shadow_micro.gif"></img>
            </div>

            <div id="searchForm">
            </div>

            <div id="resultTable">
            </div>

            <div id="updateForm">
            </div>

            <div id="insertForm">
            </div>
        </div>

        <div id="brand" style="margin-left: 30px">
            <img src="/SLAManaging/layout/images/unicredit.jpg" border="0"/>
        </div>	
    </body>
</html>
 

Discussioni simili