jquery - Jquery uiダイアログは、ユーザーの操作なしですぐに閉じます

Question

最初のダイアログはうまく機能します。これが私が使用している方法です：

HTML <div>:

<div id="newarticle-form" title="Cr&eacute;ation nouvel article">
    <form id="newarticleform" method="post" action="articles/ajout">
    <fieldset>
        <label for="validite" class="label-class">Date de validit&eacute;</label>
        <input type="text" name="validite" id="validite" size="10" maxlength="10" class="text input-class" />
        <label for="libelle" class="label-class">Libell&eacute;</label>
        <input type="text" name="libelle" id="libelle" size="50" maxlength="100" class="text input-class" />
        <label for="email" class="label-class">Description</label>
        <input type="text" name="description" id="description" value="" size="50" maxlength="250" class="text input-class" />
        <label for="pu" class="label-class">Prix unitaire</label>
        <input type="text" name="pu" id="pu" value="" size="10" maxlength="10" class="text input-class" />
    </fieldset>
    </form>
        <p class="validateTips"></p>
</div>

Javascript jquery ui ダイアログ:

$(function() {  
    $( "#newarticle-form" ).dialog({
        autoOpen: false,
        height: 'auto',
        width: 700,
        modal: true,
        resizable:false,
        buttons: {
                "Ajouter article": function() {
                        .... here is the preparation of the submit ....

            $("#newarticleform").submit();
                 $(this).dialog("close");
            },

               "Fermer": function() {
                   $(this).dialog( "close" );
               }
            }
    });

 $("#New") //The button to open the dialog
    .click(function() {
        $("#newarticle-form").dialog("open");

    });
});

それはうまくいきます！

このページには、2 つ目の jquery ui ダイアログがあります。同じメソッド (ただし、同じ ID ではない) で追加すると、このダイアログが開き、約 1 秒後に閉じます。

なんで ？