0

ダイアログ内でjavascriptを正しく起動することに関して問題があります。

以下は、ダイアログをロードするために現在使用しているscripts.jsのコードです。

function LoadDialog(url, title) {
    var DialogBox = $('<div class="dialog-container"></div>').dialog({ modal: true, autoOpen: false, resizeable: true }).dialog({ width: 500, height: 'auto' });
    DialogBox.html('<div class="ajax-load"><img src="/Content/loading.gif" alt="loading"></div>').dialog({ buttons: null, title: 'Loading..' });
    DialogBox.dialog('open').load(url, function () {
        DialogBox.dialog({ title: title, Buttons: null, position: 'center', close: function (ev, ui) { $(this).dialog("destroy"); } });
    });
}

$(function () {
    $('.as-dialog').click(function (e) { LoadDialog($(this).attr('href'), $(this).attr('title')); return false; });
});

ダイアログ内ではデフォルトでJavaScriptコードは起動しませんが。たとえば、目立たない検証を含む小さなフォームをダイアログにロードします。ボディ、ヘッドなどはなく、コンテナdivとフォーム自体のみです。デフォルトでは検証は機能せず、script.js $(function(){})の下にフォームのイベントハンドラーを追加しても起動しません。次のjs参照とコードブロックをフォームとともにロードするように追加すると、1つの問題が発生します。

<script src="/Scripts/libs/jquery.validate.min.js"></script>
            <script src="/Scripts/libs/jquery.validate.unobtrusive.js"></script>
            <script type="text/javascript">
                $(function () {
                    $('#form_Create').submit(function (e) {
                        e.preventDefault();
                    });
                });
            </script>

上記のコードに関して機能していないのは、検証は常に機能しますが、ダイアログを開いて閉じてからもう一度開くと、preventdefaultが機能しなくなり、フォームが投稿されます。これはおそらく、スクリプトの問題の複数のロードか何かでしょうか?スクリプト.jsに配置された場合、ダイアログで「docready」コードが機能しないため(標準のjavascript関数は機能します)、実際には別のオプションはありません。動的にロードされたファイル内でJavaScriptを操作するためのより良い方法はありますか、それともフォーム全体を親ページに配置して、それらに対して確実に操作できるようにする必要がありますか?これをどのように処理する必要があるかについての入力はありますか?

4

2 に答える 2

0

フィドルは確かに歓迎されますが、キックオフのために:

DialogBox.dialog({ title: title, Buttons: null, position: 'center', close: function (ev, ui) { $(this).dialog("destroy"); } });

この行は、フォーマットを適用して分割すると問題になる可能性があります。

var obj = {};
obj.title = title;
obj.Buttons = null;
obj.position = 'center';
obj.close = function(ev,ui)
{
    $(this).dialog("destroy");//-->this will point to obj!!
};
DialogBox.dialog(obj);

私はあなたが望むのは、一般的にまたはのいずれかthisと呼ばれるものを指すことだと思います。that_self

または、オブジェクトが作成されたコンテキストへの参照を保持するために、クロージャーを作成することができます。

obj.close = (function(that)
{
    return function(ev,ui)
    {
        that.dialog("destroy");
    };
})($(this));

多分これはあなたの問題が何であるかとは無関係ですが、ただ安全のために:フィドルを設定してください

于 2012-09-06T14:41:39.423 に答える
0

ダイアログを開くための以下の方法は、私の主な問題を解決したようです。

var Box = $('#dialog-container');
    if (Box.length === 0) {
        Box = $('<div id="dialog-container"></div>').appendTo('body');
    } else { Box.empty(); }

とにかく負荷がこれを行うように見えるので、empty()が必要かどうかatmは不明です。しかし、このコードを使用すると、ダイアログを好きなだけ開くことができ、コードブロックは引き続き実行されます。

ロードされたページからいくつかのスクリプトファイルを呼び出す必要があるかどうかに関する私の問題/質問ですが、親のロードされたファイルからスクリプト実行を有効にするより良い方法があります。しかし、少なくともすべてが今はうまく機能しているようです。

于 2012-09-07T21:20:30.993 に答える