將數據從javascript傳遞到MVC控制器

Question

我有一個使用Vis.js庫構建的樹層次結構。我的項目是在asp.net MVC。

樹中的每個節點都有一個id。要求是，當我點擊任何一個節點時，這個id應該被傳遞給一個控制器，並且應該呈現與被調用的控制器動作方法相對應的視圖。

我有顯示樹如下的圖：

當我點擊樹中的任何節點，比方說105，我想的節點ID被傳遞到一個位指示操作方法「樹1 」。方法Tree1將執行一些計算並呈現其自己的視圖。

[HttpPost] 
public ActionResult Tree1(string a) 
{ 
    return View(); 
} 

要將我的樹視圖中的id傳遞給Tree1控制器的操作方法，我使用$ .ajax（）。這是我在網上的各種論壇上找到的。現在

network.on('selectNode',function(properties) 
    { 
     $.post({url: '@Url.Action("Tree1")',a:properties.nodes.toString()}); 
            @*$.ajax({ 
             url: '@Url.Action("Tree1")', 
             type: 'POST', 
             data: {a:properties.nodes.toString()}, 
             success: function(result) { 
             //process the results from the controller 
             } 
            });*@ 
           } 
       ); 

，這樣做將數據發送到方法樹1（我可以看到，當我調試），但樹1的觀點並沒有呈現。相反，先前的視圖本身被渲染，顯示樹。

我想從JavaScript傳遞數據到控制器的操作方法，使沒有響應被髮回到調用JavaScript代碼。網絡上的所有資料都建議將響應回送給調用JavaScript的解決方案。

你能幫我解決嗎？有沒有我失蹤的基本概念？我怎樣才能將數據從JavaScript傳遞給控制器​​方法，而被調用的方法不必將任何響應發送回調用JavaScript？

更新1

<script type="text/javascript"> 
    // create an array with nodes 
    var nodes = new vis.DataSet([]); 

     @foreach(DataRow @dr in Model.Tree.Tables[0].Rows) 
     { 
      @:nodes.add({id: @dr[0], label:@dr[0].ToString(), level:@dr[3]}); 
     } 

    var edges = new vis.DataSet([]); 
     @foreach(DataRow @dr in Model.Tree.Tables[0].Rows) 
     { 
      if(@dr[2].ToString()!="") 
      { 
       @:edges.add({from:@dr[2], to:@dr[0]}); 
      } 
     } 

    // create a network 
    var container = document.getElementById('mynetwork'); 

    // provide the data in the vis format 
    var data = { 
     nodes: nodes, 
     edges: edges 
    }; 
    var options = {nodes:{shape:'ellipse'},edges:{arrows: 'to'},physics:true}; 

    // initialize your network! 
    var network = new vis.Network(container, data, options); 

    network.on('selectNode',function(properties) 
    { 

            $.ajax({ 
             url: '@Url.Action("Tree1")', 
             type: 'POST', 
             data: {a:properties.nodes.toString()}, 
             success: function(result) { 
             //process the results from the controller 
             } 
            }); 
           } 
       ); 


</script> 

Answer 1

既然你想也許只是導航到該視圖，你可以這樣做：

network.on('selectNode',function(properties) 
{ 
    var url = '@Url.Action("Tree1")' + '?a=' +properties.nodes.toString(); 
    document.location = url; 
}); 

Answer 2

在原始視圖的HTML你應該有一個div容器，是這樣的：

<div id="container"> 
... Original tree is here 
<div id="container"> 

然後在成功響應，你必須把它放在裏面此容器：

$.ajax({ 
    url: '@Url.Action("Tree1")', 
    type: 'POST', 
    data: {a:properties.nodes.toString()}, 
    success: function(result) { 
     $("#container").html(result); 
    } 
}); 

編輯：我忘了，你必須這樣做，返回局部視圖

[HttpPost] 
public ActionResult Tree1(string a) 
{ 
    return PartialView(); 
}