0

昨日、jquery が持つデフォルトの確認ボックスを置き換えるために、Jquery ダイアログ ボックスの作業を開始しました... 問題に遭遇し、表示されるすべてのチュートリアルで、フォームで .submit() を使用するように指示されましたが、それは必要ないようです上手にプレーする (または、まったくプレーしない)

これがJSFIDDLEです

そして今、これは私のために働いていない私のjavascriptです:

<script>

$(document).ready(function() {
        $(function() {
            var currentForm;
            $("#dialog-confirm").dialog({
                resizable: false,
                autoOpen: false,
                draggable: false,
                height: 310,
                width: 500,
                modal: true,
                buttons: {
                    'Cancel': function() {
                        $(this).dialog("close");
                    },
                    'Enter Queue': function() {
                        currentForm.submit();
                    }
                }
            });
        });

    $("#signinform").submit(function() {
        currentForm = this;
        $('#dialog-confirm').dialog('open');
        return false;
    });
});

</script>

「キューに入る」ボタンで問題が発生しています。ほとんどのシナリオ (jsfiddle に示されているように) は、ユーザーがオフィスのルールを承認する必要があるというものです。承認する場合は、チェックボックスをクリックし、送信をクリックすると送信されます。ユーザーに何をしようとしているのかを説明するダイアログ。ただし、何らかの理由で「キューに入る」ボタンは何もしません。私はかなり混乱しています。どんな助けでも素晴らしいでしょう。

ありがとう

4

3 に答える 3

4

を呼び出したときに最初の命令$(document).on('submit', "#signinform", function(e)で取得したメソッドを再利用しているためです。e.preventDefault();$('#signinform').submit();

コードまたは送信ボタンから来たかどうかを確認するには、一時変数を設定する必要があります。

これは動作テストを含む JSFiddle ですが、もっと良いことをする必要があります =)

EDIT : Javascript は非同期言語です。つまり$('#dialog-confirm').dialog('open');、HTML をブロックせずに変更するだけなので、送信イベントは常に false を返します -> 送信されません。

だから私は本当にあなたが望むように機能しないJSFiddleを手に入れますが、キューに入るボタンをクリックした後にもう一度送信ボタンをトリガーすると機能します。ここ。

使用できる方法は、ajax を使用してフォームを送信し (jquery のpost()を参照)、window.location = "yourpage" などでユーザーをリダイレクトすることです。

于 2013-05-13T11:40:53.397 に答える
2

この方法を試してください（jsFiddle）：

$(document).ready(function() {
    window.enterQueue=false;
    $("#signinform input:submit").on('click',function() {
        return getDialog(window.enterQueue);            
    });

    function getDialog(enterQueue){
        if(!enterQueue){
            $("#dialog-confirm").dialog({
                resizable: false,
                autoOpen: true,
                draggable: false,
                height: 310,
                width: 500,
                modal: true,
                buttons: {
                    'Cancel': function() {
                        $(this).dialog("close");
                    },
                    'Enter Queue': function() {
                        window.enterQueue=true;
                        $(this).dialog("close");
                        $("#signinform input:submit").trigger('click');
                    }
                }
            });
            return false;
        } else 
            return true;
    }

});

于 2013-05-14T07:25:31.610 に答える
-1

昨夜、jquery Web サイトと多くの google-ing の助けを借りてそれを理解しました。ご協力いただき、回答に時間を割いていただき、ありがとうございました。+ 1

これが私の解決策です:

<script type="text/javascript">

    $(document).ready(function() 
    {
        var Form = $("#signinform");
        $(function() 
        {
            $("#dialog-confirm").dialog(
            {
                resizable: false,
                autoOpen: false,
                dialogClass: "no-close",
                draggable: false,
                height: 320,
                width: 500,
                modal: true,
                buttons: 
                {
                    'Cancel': function() 
                    {
                        $(this).dialog("close");
                        Form.data("confirmProgress", false);
                    },
                    'Submit Information': function() 
                    {
                        Form.submit();
                        Form.data("confirmProgress", false);
                    }
                }
            });
        });
        Form.submit(function() 
        {
            if (!$(this).data("confirmProgress")) 
            {
                $(this).data("confirmProgress", true);
                $('#dialog-confirm').dialog('open');
                return false;
            } else {
                return true;
            }

        });
    });
    // Everything under this is the Jquery for my second Dialog that has always been working, the issue was the above dialog which is now fixed.
 $(document).on('click', "#Cancel", function(e)
    {
        e.preventDefault();
        var href = '<?php echo base_url(); ?>studentlogin_controller/studentlogin';
        $("#dialog-noconfirm").dialog(
        {
            resizable: false,
            dialogClass: "no-close",
            draggable: false,
            height: 320,
            width: 500,
            modal: true,
            buttons: 
            {
                "Cancel": function() 
                {
                    $(this).dialog("close");
                },
                "Go Back": function() 
                {
                    window.location.href = href;
                },
            }
        });
    });

</script>
于 2013-05-14T11:31:29.730 に答える