0

おそらく、この質問はすでに尋ねられているかもしれません。しかし、以下のシナリオについては満足のいく答えが見つかりません。

ボタンをクリックするとjqueryダイアログがポップアップするMVCアプリケーションがあります。ヘッダーに jquery***.js を含めると問題なく動作します。しかし、Body の後にインクルードすると機能しません。

ベスト プラクティスに従って、本文の後にすべてのスクリプトを含める必要があります。では、スクリプトを下部に含めると、このダイアログが開かないのはなぜですか。

**Layout.cshtml**

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    @Content.Css("themes/base/jquery.ui.all.css", Url)
    @Content.Css("Site.css", Url)

    /**** Dialog works fine if I include 
    *** @Content.Script("jquery-1.5.1.min.js", Url) ***
    ***here*****/

</head>
<body>

   *********
   *********

    @Content.Script("jquery-1.5.1.min.js", Url)
    @Content.Script("jquery-ui-1.8.11.min.js", Url)
    @Content.Script("jquery.unobtrusive-ajax.min.js", Url)
</body>
</html>


Index.cshtml

@model ****

<script>
    $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            model: true
        });
    });

    function btn1Click() {
        $("#dialog").dialog("open");
    }
</script>

<h2>Index</h2>

@using (Html.BeginForm () )
{
    <input id="btn1" value="Index1" type="button" onclick="btn1Click()"  /> 
    <br />

        <div id="dialog" title="Basic dialog">
        <p>Testing...</p>
        </div>
}
4

0 に答える 0