C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Ajax.BeginFormで読込んだビューでjQuery

[トピック内 7 記事 (1 - 7 表示)]  << 0 >>

■89009 / inTopicNo.1)  Ajax.BeginFormで読込んだビューでjQuery
  
□投稿者/ 青い子ブタ (5回)-(2018/10/25(Thu) 11:39:25)

分類:[.NET 全般] 

Ajax.BeginFormで読み込みした部分ビューでjQueryが実行できません。
ご教示お願いいたします。

【環境】
VisualStudio2017
Framework 4.6.2
C#


【やりたいこと】
Ajax.BeginFormで部分ビューを読み込み
部分ビュー内に配置しているリンクのClickでアラートを表示したい


【最小のコード】※「<」「>」が迷惑投稿と判断されるため全角にしています。
■MyTestコントローラー
public class MyTestController : Controller
{
    [HttpGet]
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult _Partial1()
    {
        return PartialView();
    }
}

■Indexビュー
@{
    Layout = "~/Views/Shared/_MainLayout.cshtml";
}
<div>
    <p>Index</p>

    @using (Ajax.BeginForm("_Partial1", "MyTest", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "partial1", OnSuccess  }))
    {
        <button type="submit">Partial1読み込み</button>
    }

    <div id="partial1"></div>
</div>

@section scripts_footer
{
    <script type="text/javascript">
        $(function () {
            $("#mylink2").click(function () { alert('mylink2'); return false; }); ★動かない
        });
    </script>
}    
■_Partial1ビュー
<div>
    <p>_Partial1</p>

    <a id="mylink2" href="#">リンク2</a>
</div>

引用返信 編集キー/
■89013 / inTopicNo.2)  Re[1]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ WebSurfer (1625回)-(2018/10/25(Thu) 11:57:32)
No89009 (青い子ブタ さん) に返信

MVC5 ですか? CORE ではないですよね?

VS2017 は分かりませんが、VS2015 のテンプレートで作った MVC5 アプリはそのままでは
Ajax ヘルパーが動きません。

動くようにするのは、以下の記事のように NuGet パッケージの追加等の作業が必要です。
そのあたりはどうなってますか?

MVC5 で AjaxHelper が働かない
http://surferonwww.info/BlogEngine/post/2018/05/28/ajaxhelpers-do-not-work-on-mvc5-application-created-by-visual-studio-template.aspx
引用返信 編集キー/
■89014 / inTopicNo.3)  Re[2]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ 青い子ブタ (6回)-(2018/10/25(Thu) 12:01:22)
MVC5です。

AjaxおよびJQueryは正常に動いています。

Ajax.BeginFormで読み込んだ部分ビューに配置された要素の場合のみ
JQueryが動きません。

よろしくお願いいたします。
引用返信 編集キー/
■89016 / inTopicNo.4)  Re[3]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ 青い子ブタ (7回)-(2018/10/25(Thu) 12:03:52)
追記です

NuGet から Microsoft.jQuery.Unobstrusive.Ajax をインストール は済んでおり
Ajax.BeginFormで部分ビューの読み込みはできています。

よろしくお願いいたします。
引用返信 編集キー/
■89017 / inTopicNo.5)  Re[4]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ WebSurfer (1627回)-(2018/10/25(Thu) 12:11:29)
No89016 (青い子ブタ さん) に返信

jquery.js は読み込まれるようになっていますか?
MVC のテンプレートで生成される_Layout.cshtml を使っていれば自動的に

<script src="/Scripts/jquery-1.10.2.js"></script>

というようなコードが html ソースに含まれますが・・・


引用返信 編集キー/
■89018 / inTopicNo.6)  Re[4]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ WebSurfer (1628回)-(2018/10/25(Thu) 12:31:18)
No89016 (青い子ブタ さん) に返信

上に私が書いた種々の条件はクリアできているとして、
alert を出すスクリプト全体を部分ビューに移動すれば動くようになると思います。
引用返信 編集キー/
■89019 / inTopicNo.7)  Re[5]: Ajax.BeginFormで読込んだビューでjQuery
□投稿者/ 青い子ブタ (8回)-(2018/10/25(Thu) 12:50:26)
No89018 (WebSurfer さん) に返信
> ■No89016 (青い子ブタ さん) に返信
> 
> 上に私が書いた種々の条件はクリアできているとして、
> alert を出すスクリプト全体を部分ビューに移動すれば動くようになると思います。

動きました!
ありがとうございます。

Indexビューの下記の部分を、パーシャルビューにもっていって動かないと思っていたのですが
@section scripts_footer
{
    <script type="text/javascript">
        $(function () {
            $("#mylink2").click(function () { alert('mylink2'); return false; }); ★動かない
        });
    </script>
}  

持っていくのは「@section scripts_footer{}」を除いた部分を持っていけば動きました。
<script type="text/javascript">
        $(function () {
            $("#mylink2").click(function () { alert('mylink2'); return false; }); ★動かない
        });
</script>

ありがとうございました!

解決済み
引用返信 編集キー/

このトピックをツリーで一括表示


トピック内ページ移動 / << 0 >>

このトピックに書きこむ