2017-10-19 9 views
0

ブロック上の新しい子供、ASP MVC ... tryna JavaScriptのダイアログボックスにあるEditフォームを取得します。アクションのJavascriptでController Actionを呼び出すときにASP MVCでPartialsを使用するには?

私の現在の計画:

  • メインビューでのonClickはRECORD_IDをつかむ編集ボタンがあり、PARAMとしてRECORD_IDを渡して私のコントローラのアクションへのAJAX呼び出しを行います。
  • 同じビューで、タブ/ダイアログに関連するコードを持つ部分的な "_EditApp"を使用しています。
  • 同じonClickでは、_EditAppで指定したタブを読み込んでいます。

JS ..

$('.btn_edit_app').click(function() { 

    var app_to_edit = $(this).attr('id'); 
    $.ajax({ 
     url: '/Application/editApp', 
     contentType: 'application/html; charset=utf-8', 
     data: { app_id: app_to_edit}, 
     type: 'GET', 
     dataType: 'html', 
     success: function (result) {}, 
    }); 
    $('#edit_tabs').tabs({ active: 0 }); 
    $('#edit_dialog').dialog({ width: 700, height: 400 }); 
}); 

私のコントローラ/アクション

public ActionResult editApp(int app_id) 
     {  
      AppDBServer ads = new AppDBServer(); 
      ads = findADS(app_id); 
      return View("_EditApplication", ads); 
     } 

問題...

は単に、私はレコードを取得し、タブとダイアログを移入したいです検索されたデータフィールドを含むボックス。したがって、モデルをEditApplication Partialに渡します。

問題は私の主な見解では私がコントローラのアクションにあり、これについてどうやって行くのかわからないという同じ部分を使用しています...アイデア、またはこれより新しいアプローチはA-OKです。

また、コントローラ/アクションによってデータ検索を処理することを目指しています。

ありがとうございます、SOFファミ!

答えて

0

私はコメントしたかっただけですが、私の評判は50未満です。とにかく、私が正しく理解すれば、アクションコールの後にいくつかのタブをプルアップしたいと思う。私は以前これのようなものを持っていた。ここに私の解決策がありました:

IDを持つボタンまたは行のonclickはActionResultを呼び出します。

またはAjaxの形式を使用: @using(Ajax.BeginForm( "GetTabs"、 "ControllerHere"、新AjaxOptions(){LoadingElementId = "装填"、UpdateTargetId = "targetdiv" を、InsertionMode = InsertionMode.Replace、HTTPMETHOD =)} "GET")Html.Hidden @ {( "ID"、ID) ....}

戻りPartialViewすなわち "_Tabs" を送信してモデルを通過する(この場合、ID )。

` 
public ActionResult GetTabs(string id) 
{ 
.... 
//pass id or get model and pass model 
return PartialView("_Tabs", id); 
} 
` 

各タブの_Tabs.cshtmlコール内でHtml.RenderAction。 (私はブートストラップを使ってタブを設定しました) Html.RenderActionはアクションメソッド名をとり、パラメータを渡すことができます。各アクション部分ビューを返します..etc

`@{Html.RenderAction("GetTab1",new {id = @id}) } 

@{Html.RenderAction("GetTab2",new {id = @id}) }` 

... public ActionResult GetTab1(string id) { //get data model = id lookup return PartialView("_Tab1", model); } ...

ここで、_Tabsの部分ビューは、それぞれ独自のモデルを持つことができる独自の部分ビューをレンダリングしています。

_Tabsパーシャルがレンダリングされると、メインページのターゲットdivにHTMLが返され、_Tabs.cshtmlにx個のタブが作成されます。

<script> 
 
    $('#navtab a').click(function (e) { 
 
     e.preventDefault(); 
 
     $(this).tab('show'); 
 
    }); 
 

 
    // store the currently selected tab in the hash value 
 
    $("ul.nav-tabs > li > a").on("shown.bs.tab", function (e) { 
 
     var id = $(e.target).attr("href").substr(1); 
 
     window.location.hash = id; 
 
    }); 
 

 
    // on load of the page: switch to the currently selected tab 
 
    var hash = window.location.hash; 
 
    $('#navtab a[href="' + hash + '"]').tab('show'); 
 
</script>

は、私はまた、次のスクリプトを選択し、現在アクティブなタブを保つことができました

関連する問題