2017-06-05 84 views
1

我是新來的ASP.Net MVC世界,我正在使用一個小型應用程序,它使用Web服務中的許多XML文件作爲其模型數據。我有一個Html頁面,其中包含存儲在XML Web服務中的所有工具的列表。他們在一個循環內,並且是可點擊的鏈接。我也有一個局部視圖,這只是一系列文本框。我的目標是用我從工具中獲得的信息填充文本框,同時讓列表和文本框出現在同一頁面上。我已經成功地做到了這一點,但迄今爲止只能將id傳遞給一個控制器,它將我的部分視圖作爲一個全新的頁面返回。我確信這是一個簡單的解決方案,可能在此之前已經得到解答。解決這個問題的最好方法是什麼?下面是我的模型,視圖(S)和兩個控制器從部分視圖獲取數據到主視圖

工具型號

public class Tool 
{ 
    public int Id { get; set; } 
    public string ToolId { get; set; } 
    public string Adapter { get; set; } 
    public string Description { get; set; } 
    public string TNumber { get; set; } 
    public List<string> ComponentList { get; set; } 
    public List<string> AccessoryList { get; set; } 
    public List<KeyValuePair<string, string>> ToolIdDescription { get; set; } 
    public List<string> toolList = new List<string>(); 

} 

局部視圖控制器

public ActionResult PartialView() 
    { 
    Tool newTool = new Tool(); 
    List<string> tools = new List<string>(); 
    tools = backgroundLoad(); 
    newTool.ToolIdDescription = new List<KeyValuePair<string, string>>(); 
    atool.ToolIdDescription = new List<KeyValuePair<string, string>>(); 
    foreach (string tool in tools) 
    { 
     newTool.ToolIdDescription = GetToolDescription(tool); 
    } 

    return View(newTool); 
    } 

控制器來收到的數據集

public ActionResult GetDataSet(string id) 
    { 
    Tool selectedTool = new Tool(); 
    if (id != null) 
    { 
     var request = 
(HttpWebRequest)WebRequest.Create("http://localhost/DbService/Tool/" + id); 
     XmlDocument xml = new XmlDocument(); 
     Stream aResponsestream; 
     string aResult = ""; 
     using (aResponsestream = request.GetResponse().GetResponseStream()) 
     using (StreamReader aReader = new StreamReader(aResponsestream, 
Encoding.UTF8)) 
     { 
      aResult = aReader.ReadToEnd(); 
      aResponsestream.Close(); 
     } 
     xml.LoadXml(aResult); 
     var Description = 
    xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/Description"); 
     if (Description != null) selectedTool.Description = 
Description.InnerText; 
     var Adapter = 
    xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/Adapter/Name"); 
     if (Adapter != null) selectedTool.Adapter = Adapter.InnerText; 
     var TNumber = 
     xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/TNo"); 
     if (TNumber != null) selectedTool.TNumber = TNumber.InnerText; 
     var ToolId = 
     xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/ToolId"); 
     if (ToolId != null) selectedTool.ToolId = ToolId.InnerText; 


     return View(selectedTool); 
    } 
    else return View(); 

    } 

查看其中包含列表

@model MiniWeb.Models.Tool 

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <link href="~/Content/Site.css" rel="stylesheet" /> 
</head> 
<body> 
<h2>Tool List</h2> 
<div class="table-responsive"> 
    <table class="table table-hover"> 
     <thead> 
     <tr> 
     <th>Id</th> 
     <th>Description</th> 
     </tr> 
     </thead> 
     @foreach (var item in Model.ToolIdDescription) 
     { 

     <tbody> 
     <tr> 
      <td>@Html.ActionLink(item.Key, "GetDataSet", new { id = item.Key })</td> 
      <td>@Html.DisplayFor(modelItem => item.Value)</td> 
     </tr> 
     </tbody> 
     } 
    </table> 
</div> 
</body> 
</html> 

@Html.Partial("GetDataSet", new MiniWeb.Models.Tool()) 

視圖,其中顯示該工具的信息

@model MiniWeb.Models.Tool 

@{ 
    ViewBag.Title = "GetDataSet"; 
} 
@{ 
    ViewBag.Title = "Tool"; 
} 
<link href="~/Content/Site.css" rel="stylesheet" /> 
<h2>Tool Selection </h2> 
<div class="Tool"> 
    <span id ="id"> 
     @Html.LabelFor(m => Model.ToolId) 
     @Html.TextBoxFor(modelItem => Model.ToolId) 
    </span> 
    <br/> 
    <span id="Description"> 
     @Html.LabelFor(m => Model.Description) 
     @Html.TextBoxFor(modelItem => Model.Description) 
    </span> 
    <br/> 
    <span id="Adapter"> 
     @Html.LabelFor(m=> Model.Adapter) 
     @Html.TextBoxFor(modelItem => Model.Adapter) 

    </span> 
    <br/> 
    <span id="Adapter"> 
     @Html.LabelFor(m => Model.TNumber) 
     @Html.TextBoxFor(modelItem => Model.TNumber) 
    </span> 
    <span> 
     <button> Save </button> 
    </span> 
</div> 

對不起,所有的代碼,但感謝你的閱讀。我也很抱歉,如果這是一個非常簡單的解決方案。我只是ASP.Net的新手,並且希望開發最佳實踐,而不是在其上進行黑客工作。謝謝您的幫助。

回答

1

隨着一些更多的研究,我能夠弄清楚如何解決我的問題。結果我所需要的只是一些AJAX。我使用了Ajax.Actionlink而不是HTML動作鏈接,並能夠在頁面上的div中加載我的部分視圖。這是我的新視圖和控制器。局部視圖保持不變。

查看

@model MiniWeb.Models.Tool 

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 


    <link href="~/Content/Site.css" rel="stylesheet" /> 
    <script src="~/Scripts/jquery-3.1.1.min.js"></script> 
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script> 
</head> 
<body> 
<h2>Tool List</h2> 
<div class="table-responsive"> 
    <table class="table table-hover"> 
     <thead> 
     <tr> 
     <th>Id</th> 
     <th>Description</th> 
     </tr> 
     </thead> 
     @foreach (var item in Model.ToolIdDescription) 
     { 

     <tbody> 
     <tr> 
      <td>@Ajax.ActionLink(item.Key, "_Partially", new { id = item.Key },new AjaxOptions() 
       { 
        HttpMethod = "GET", 
        UpdateTargetId = "ToolInfo", 
        InsertionMode = InsertionMode.Replace, 


       }) 

      </td> 


      <td>@Html.DisplayFor(modelItem => item.Value)</td> 
     </tr> 
     </tbody> 
     } 
    </table> 
</div> 
</body> 
</html> 
<div id="ToolInfo"> 


</div> 

和我的新控制器,它是返回一個PartialView看起來像這樣

局部視圖控制器

public PartialViewResult _Partially(string id) 
     { 
     Tool selectedTool = new Tool(); 
     if (id != null) 
     { 
      var request = (HttpWebRequest)WebRequest.Create("http://localhost/DbService/Tool/" + id); 

      XmlDocument xml = new XmlDocument(); 
      Stream aResponsestream; 
      string aResult = ""; 
      using (aResponsestream = request.GetResponse().GetResponseStream()) 
      using (StreamReader aReader = new StreamReader(aResponsestream, Encoding.UTF8)) 


      { 
       aResult = aReader.ReadToEnd(); 
       aResponsestream.Close(); 
      } 
      xml.LoadXml(aResult); 
      var Description = xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/Description"); 
      if (Description != null) selectedTool.Description = Description.InnerText; 
      var Adapter = xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/Adapter/Name"); 
      if (Adapter != null) selectedTool.Adapter = Adapter.InnerText; 
      var TNumber = xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/TNo"); 
      if (TNumber != null) selectedTool.TNumber = TNumber.InnerText; 
      var ToolId = xml.SelectSingleNode("RetrieveResponse/RetrieveResult/Tool/ToolId"); 
      if (ToolId != null) selectedTool.ToolId = ToolId.InnerText; 

      return PartialView("_Partially", selectedTool); 
     } 
     return PartialView(); 


     } 

希望這個答案可以幫助別人喜歡我在將來。謝謝閱讀。

0

您將要在您的部分視圖上創建一個表單,以將數據提交給主頁面控制器。

你可以在this的文章中找到更多的信息。