從控制器傳遞ViewData值來查看

Question

我正在對我的控制器方法進行ajax調用，並期待將結果返回到我的視圖。但是，即使通過控制器返回值ViewData，我的視圖也不會顯示來自控制器方法的值。

掃描器視圖（爲了簡潔剝離版本）

<div class="card card-outline-danger card-danger"> 
    <div class="card-block"> 
     <blockquote class="card-blockquote"> 
      <p>Result In</p> 
      <div id="resultsList"></div> 
      <p>Result Out</p> 
      @ViewData["TextAreaResult"] 
     </blockquote> 
    </div> 
</div> 

家庭控制器

public IActionResult Scanner() { 
    ViewData["TextAreaResult"] = "No Scan yet"; 
    return View(); 
} 

[HttpPost] 
public IActionResult DecodeScanner(string productCode, string serialNumber, string batch, string expirationDate, int commandStatusCode) { 
    try { 
     Control.Initialize(); 
     Control control = new Control(); 
     Request request = new Request(); 

     request.setProductCode(productCode); 
     request.setSerialNumber(serialNumber); 
     request.setBatch(batch); 
     request.setExpirationDate(expirationDate); 
     request.setCommandStatusCode(commandStatusCode); 

     control.sendSinglePackOperation(request); 

     Console.WriteLine("Response:" + request.getHttpResponseCode()); 

     ViewData["TextAreaResult"] = string.Format(" Response {0}", request.getHttpInformation()); 

    } catch (Exception exc) { 
     ViewData["TextAreaResult"] = "Exception: " + exc.Message; 
    } 

    return View("Scanner"); 
} 

JS（剝離版本爲了簡潔）

$('#my-button').click(function() { 
    $.ajax({ 
     url: "DecodeScanner", 
     type: "POST", 
     data: { 
      productCode: productCode, 
      serialNumber: serialNumber, 
      batch: batch, 
      expirationDate: expirationDate, 
      commandStatusCode: 0 
     }, 
     async: true 
    }); 
}); 

在網絡選項卡下的響應部，我可以看到控制器在成功調用ajax後傳遞的結果，但更新後的結果@ViewData["TextAreaResult"]的值不會在視圖中呈現。我想這是以某種方式相關的新值不傳遞，因爲沒有頁面刷新。

輸出我期待（在這種情況下）是顯示Response The pack is active

網絡標籤 - Ajax調用響應

HTML視圖 - 仍然顯示在Scanner()函數定義的默認@ViewData["TextAreaResult"]文本。

Answer 1

不能更新@ViewData["TextAreaResult"]這是已經呈現。你需要爲實現p標籤

認沽可視數據這

掃描儀查看爲此

<p id="pTextAreaResult">@ViewData["TextAreaResult"]</p> 

控制器

[HttpPost] 
public IActionResult DecodeScanner(string productCode, string serialNumber, string batch, string expirationDate, int commandStatusCode) { 
    string TextAreaResult = string.Empty; 
    try { 
     Control.Initialize(); 
     Control control = new Control(); 
     Request request = new Request(); 

     request.setProductCode(productCode); 
     request.setSerialNumber(serialNumber); 
     request.setBatch(batch); 
     request.setExpirationDate(expirationDate); 
     request.setCommandStatusCode(commandStatusCode); 

     control.sendSinglePackOperation(request); 

     Console.WriteLine("Response:" + request.getHttpResponseCode()); 

     TextAreaResult = string.Format(" Response {0}", request.getHttpInformation()); 

    } catch (Exception exc) { 
     TextAreaResult = "Exception: " + exc.Message; 
    } 

    return Json(TextAreaResult, JsonRequestBehavior.AllowGet); 
} 

腳本

$('#my-button').click(function() { 
    $.ajax({ 
     url: "DecodeScanner", 
     type: "POST", 
     data: { 
      productCode: productCode, 
      serialNumber: serialNumber, 
      batch: batch, 
      expirationDate: expirationDate, 
      commandStatusCode: 0 
     }, 
     async: true, 
     success: function(data) { 
      $('#pTextAreaResult').text(data); 
     } 
    }); 
}); 

Answer 2

我看不到任何地方你的代碼，你真的用返回的HTML更新視圖？

如果添加成功回調到您的AJAX後，你可以做這樣的事情：

$('#my-button').click(function() { 
    $.ajax({ 
     url: "DecodeScanner", 
     type: "POST", 
     data: { 
      productCode: productCode, 
      serialNumber: serialNumber, 
      batch: batch, 
      expirationDate: expirationDate, 
      commandStatusCode: 0 
     }, 
     async: true    
    }).done(function(html) { 
     $('.card').replaceWith(html); 
    }); 
}); 

（沒有測試但希望你的想法）