Проблема с кнопкой в ​​родительском элементе при запуске действия отмены диалога JQuery UI

Question

У меня есть форма со следующей кнопкой отправки:

<td valign="bottom" id="form-submitted">
    <input type="submit" name="btnSubmit" id="btnSubmit" value="Add to Cart">
</td>

При щелчке у меня есть:

$('#btnSubmit').on('click', function(e) {   

    $("#form-submitted").html("<img src='../images/loader.gif'/> Saving, please wait...");
    ...
    dialog = $( "#dialog-form" ).dialog({
                autoOpen: false,
                height: dialogHeight,
                width: 650,
                modal: true,
                position: {
                    my: "center bottom",
                    at: "center"
                },  
                buttons: {
                    "Continue": addSold,
                    Cancel: function() {

                        $('#form-submitted').html('<input type="submit" name="btnSubmit" id="btnSubmit" value="Add to Cart">');

                        dialog.dialog( "close" );
                    }
                },
                close: function() {

                    $("#s-total").html("<b>Total : 0</b>");

                }
         });  
    ...
});

Если я нажимаю на кнопку отмены в диалоговом окне пользовательского интерфейса, я вижуbtnSubmit в форме.Однако второй щелчок не вызовет диалоговое окно пользовательского интерфейса.

Как сделать так, чтобы второй щелчок по btnSubmit также вызывал диалоговое окно?

Answer 1

Несколько решений здесь, которые должны быть полезны: https://www.codeproject.com/Questions/1079849/Jquery-hits-only-once-in-dymanic-button-clicks