1

C#、MVC を使用しています。

PartialView と jquery の読み込みが正常に機能していません。

ユーザーが Kit というハイパーリンクをクリックすると、次のように呼び出します。

    public ActionResult KitsEdit(string id)
    {
        int idnbr = Convert.ToInt32(id);

        var Progs = db2.usp_KitInfo(idnbr)
                    .OrderBy(x => x.TDate).ToList();


        return PartialView(Progs);
    }

ページに PartialView をうまくロードします。

ビューには行があり、各行には編集ハイパーリンクがあります。ユーザーが [編集] ハイパーリンクをクリックすると、ユーザーが各行に表示される情報の一部を変更して [送信] をクリックできるダイアログ ボックスが表示されます。これは初めてうまくいきます。

送信時に、いくつかの検証を行ってから呼び出します。

    $("#stlist").load('@Url.Action("KitsEdit", "Spr")' + '?id=' + '@Model.id');

ユーザーが更新された情報を確認できるように、ページの部分ビューを再読み込みする必要があるためです。

ページの読み込みは表面上はうまく機能します。ただし、.load を実行してから 2 回目に [ハイパーリンクの編集] をクリックすると、以前は機能していた機能の一部がダイアログ ボックスに表示され、機能しません。たとえば、チェックボックスをクリックすると、値がコントローラーアクションに正しく渡されないという点で機能しません。また、送信のために、クリック時にいくつかのコードがありましたが、それらは機能しません。コントローラーアクションに直接行き、すべてのコードをバイパスします 

    $("#submit").click(function ().

これは、load() が呼び出された後にのみ発生することに注意してください。

質問: .load() 以外に、ページに PartialView をロードするものはありますか。そうでない場合、.load() で適切に動作させるにはどうすればよいですか。

送信クリックは次のようになります。

    $("#submit").click(function () {
    //  following .on code won't execute code inside of function so have it commented       
    // $("#submit").on("click", function () {  

         var inactivedate = $("#InactiveDate").val();

         var inactivecheck = $('#Inactive').is(':checked');

         var inactivereason = $('#InactiveReason option:selected').text();

         if ((!inactivedate || !$.trim(inactivedate)) && $('#Inactive_cb').attr('checked') == true) {
             alert('Inactive Date must be entered.');
             return false;
         }

         if ($('#Inactive_cb').attr('checked') == true && inactivereason == '<Choose>') {
             alert('Inactive Reason must be selected.');
             return false;
         }

         var url = '@Url.Action("EditTrain", "Spr")';


         $.ajax({
             type: "POST",
             url: url,
             async: false,
             data: $('#theForm').serialize()               
           });


         $("#stlist").load('@Url.Action("kitsEdit", "Spr")' + '?id=' + '@Model.spkrid');
         parent.$.fn.colorbox.close();

         return false;

     });
 });

前もって感謝します。

4

4 に答える 4

1

load関数は動的に DOM にいくつかの新しいコンテンツを注入しています。そのため、古いイベント バインディングは新しい要素では機能しません。jQueryを使用する必要がありますon

変化する

$("#submit").click(function (e) {
  //some code 
});

に

$(document).on("click","#submit",function (e) {
  e.preventDefault() // if you need
  //some code 
});

jquery onは、現在および将来の要素に対して機能します。

于 2012-07-11T18:01:05.480 に答える
0 
$("#submit").live('click', function () {}

これはうまくいくはずです

于 2013-07-02T11:45:36.343 に答える
0

.load() を正しく使用していますが、.on() または .delegate() を使用して新しく作成された要素にイベントをバインドするようにイベント ハンドラーを変更する必要があります。このような：

$("#submit").on("click", function(){
  //do your stuff
});
于 2012-07-11T17:20:32.880 に答える
0

部分ビューに JavaScript コードはありますか? 部分ビューに関連付けられたイベントがある場合、コントロールをリロードするとそれらは機能しません。

イベントを再バインドする必要がある場合はsuccess、AJAX 呼び出しが行われた後に関数で実行してください。

于 2012-07-11T17:15:03.270 に答える