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

  • menu.txt
    6,1 KB · Visite: 284

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
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
Autore Titolo Forum Risposte Data
T problemi con dati menu a tendina HTML e CSS 2
A menu a tendina php PHP 1
M Accordion menu e posizione div HTML e CSS 0
F Menu responsive larghezza schermo HTML e CSS 2
G Colorare menu select attraverso ricerca php PHP 0
M Creazione menu a tendina Javascript 3
D menu con submenu orizzontale HTML e CSS 0
Cosina Menu fisso copre i titoli quando cliccati nel sommario jQuery Javascript 4
G creazione menu a tendina e invio a pagina php PHP 1
P Sub menu con Collapse. Javascript 0
R abilitare menu a tendina tramite relativa chekbox PHP 17
L Aiuto creazione menu mancante WordPress 0
S spostare il pulsante menu dropdown HTML e CSS 8
F Dropdown menu con tabella PHP 33
Spown [WordPress] Problemi visualizzazione su più browser + voci menu in movimento WordPress 1
A [WordPress] Menu bar WordPress 0
W [WordPress] Non si vedono le categorie da aggiungerle al Top Menu WordPress 3
M Inviare variabili da menu a tendina a pagina php con post PHP 6
M [PHP] Selezione da menu a discesa con 2 variabili PHP 0
F [WordPress] [HTML] Aggiungere una pagina solo allo sticky menu WordPress 4
M [PHP] Creare un menu a tendina con pdo PHP 18
M [Javascript] Caricamento menu da file esterno Javascript 8
W [HTML] Animazione menu mobile HTML e CSS 0
P [HTML] Eliminare doppio menu in wordpress WordPress 2
andreas88 [PHP] menu PHP 15
K [ASP.Net] Realizzazione menu a tendina dipendenti ASP.NET 1
M [HTML] problema spazio aggiuntivo tra elementi <li> di menu a tendina HTML e CSS 1
L [css e html] destra e sinistra (menu navigazione) HTML e CSS 3
P [Gratuito][Cerco] qualcuno per fare menu a tendina ottimizzato per mobile-responsive con css e html Offerte e Richieste di Lavoro e/o Collaborazione 3
P [HTML] Problema con menu orizzontale a tendina per sito web HTML e CSS 17
P [Javascript] Voce del menu evidenziata in base alla pagina attiva Javascript 48
V [WordPress] Come modificare link in tasto menu css WordPress 21
S [Javascript] [CSS] Spazio Bianco tra Slider e Menu foto Javascript 6
P [Javascript] problema menu responsive su aruba, editor bk Javascript 1
Hellgrom90 Hamburger menu non si chiude jQuery 1
K [Javascript] Finestra menu Javascript 1
Selenio89 [HTML] creare menu di navigazione HTML e CSS 2
C [Javascript] [HTML] Problemi: Overlay, Banner, Menu Javascript 4
C 3 Bug CSS AND HTML: Overlay-Banner-Menu HTML e CSS 0
C 3 BUG CSS AND HTML: OVERLAY - BANNER- MENU HTML e CSS 0
M [PHP] Menu a tendina dinamico che non si aggiorna PHP 2
U [PHP] Selezione con menu a tendina e recupero selezione PHP 5
M Riadattamento funzioni per far scomparire un menu. jQuery 4
G [Javascript] Transition in OnClick Dropdown Menu Javascript 5
U [Javascript] Menu responsive non scompare col click sui link Javascript 0
A [Javascript] Problemi menu bootstrap Javascript 1
A [HTML] Menu con effetto slide down HTML e CSS 0
M [HTML] Menu a fisarmonica che non funziona in chrome HTML e CSS 2
M [Javascript] far scomparire il menu al click Javascript 0
Kolop [HTML] Menu a colonne stessa lunghezza HTML e CSS 7

Discussioni simili