Buongiorno a tutti quanti,

ho un contenitore generale (div) che contiene un form. Quando l'utente clicca su "INVIA", questo contenitore generale dovrebbe scomparire con l'effetto .hide() di jQuery e immediatamente dopo deve visualizzare una finestra di dialogo (sempre con jQuery), con all'interno il riepilogo dei dati passati nel form del contenitore generale.

C'è un problema: quando clicco su "INVIA", il contenitore generale sparisce correttamente ma fa sparire anche la finestra di dialogo che invece dovrebbe restare aperta.

Come posso risolvere?

Qui il codice finora creato:

codice:
<div class="contenitore_gen">

<div id="finale">
 <form>
  ...qui il contenuto bla bla

   <button id="chiudi" type="button">Chiudi finestra</button>
 </form>
</div>

</div>

<script type="text\javascript">
  $(function() {
      $(".contenitore_gen").hide("fade");
      $("#finale").dialog({
                         show:'fade',
                         modal:false,
                         width:300,
                         height:130,
                         zIndex:3999
      });

     $("#chiudi").click(function() {
                                  $("#finale").hide("fade", function() {
                                                                       $("#finale").dialog("close");
                                                                       $(".contenitore_gen").show("fade");
                                  });
     });
  });
</script>
...come posso risolvere?

Ho provato con il metodo :not (elemento) ma non funziona.
Ho provato con le varie position dei css..ma niente.