如何根據MVC4中使用jQuery AJAX的服務調用得到的結果顯示/隱藏部分視圖？

我想要一個可輸入貸款編號的頁面，然後我將調用WCF獲取服務以查看貸款編號是否有效。如果貸款＃有效，我想在同一頁面上顯示貸款相關數據（局部視圖）。如何根據MVC4中使用jQuery AJAX的服務調用得到的結果顯示/隱藏部分視圖？

這裏是我的主要觀點：

@model LoanStatus.Web.Models.Validate  
@{ 
    ViewBag.Title = "Validate"; 
}  
@section Scripts { 
    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/jqueryval") 
    @Scripts.Render("~/bundles/jqueryui") 
}  

<script type="text/javascript"> 

    jQuery(function ($) { 
     $("#txtssn").mask("9999"); 
    }); 

    function validateRequest() { 

     var $form = $('form'); 
     if ($form.valid()) { 
      $.support.cors = true; 

      var lnkey = $('#txtlnkey').val();     

      $.ajax({ 
       type: "GET", 
       url: "http://localhost:54662/Service1/ValidateRequest/" + encodeURIComponent(lnkey),      
       contentType: "application/json; charset=utf-8", 
       dataType: "json", //jsonp? 
       success: function (response) { 
        $('#Result').html('Loading....'); 

        if (response.ValidateRequestResult.toString().toUpperCase() == 'TRUE') { 
         alert('validated'); 

        } else { 
         alert('cannot validated' + response.ValidateRequestResult.toString().toUpperCase()); 
         //$("#Result").hide(); 
        } 

        $('#Result').html(response.ValidateRequestResult); 
        //alert(response.ValidateRequestResult.toString()); 
       }, 
       error: function (errormsg) { 
        alert("ERROR! \n" + JSON.stringify(errormsg));       
       } 
      }); 
      // 
     } else { 
      $('#Result').html('Input Validation failed'); 
     } 
    } 
</script> 

@using (Html.BeginForm()) { 

     <fieldset> 
      <legend>Log in Form</legend> 
      <ol> 
       <li> 
        @Html.LabelFor(m => m.LoanKey, new{}) 
        @Html.TextBoxFor(m => m.LoanKey, new { @id = "txtlnkey" }) 
        @Html.ValidationMessageFor(m => m.LoanKey) 
       </li>      
      </ol> 
      <input type="button" value="Get Status" onclick="javascript:validateRequest();" /> 
     </fieldset> 
    } 

<div id="Result">  
    @if (ViewBag.Validated) 
    { 
     @Html.Action("GetLoanInfo"); 
    } 
</div>

下面是我的控制器：

namespace LoanStatus.Web.Controllers 
{ 
    public class ValidateController : Controller 
    { 
     // 
     // GET: /Validate/ 
     [HttpGet] 
     public ActionResult Index() 
     { 
      var model = new Validate() {LoanKey = "", Last4Ssn = ""};  
      ViewBag.Validated = false;     
      return View(model); 
     } 

     [HttpPost] 
     public ActionResult Index(Validate model, bool validated) 
     { 
      // do login stuff 
      ViewBag.Loankey = model.LoanKey; 
      ViewBag.Validated = true;  
      return View(model); 
     } 


     public ActionResult GetLoanInfo() // SHOWs Search REsult 
     { 
      return PartialView("_LoanInfoPartial", ViewBag.Loankey); 
     } 

    } 
}

我想有 '@Html.Action("GetLoanInfo");' 渲染只有當jQuery的AJAX服務調用返回TRUE（如果我有alert('validated') 。我不知道該怎麼做。我的問題可以解決，如果我可以設置ViewBag.Validated的值在success:function()。但基於我讀的，它不能在jQuery中設置。

我試過$("#Result").hide();和$("#Result").show();但它沒有工作。請幫忙。

來源

2013-04-20 sharp_net

如果'@if（ViewBag.Validated）'爲false，那麼'.hide（）'和'.show（）'可能不起作用......首先，這是服務器端代碼..你需要做的就是渲染它，但是立即調用'$（document）.onready（' – Matt 2013-04-20 00:59:06

'）中的'.hide（）'在上面的例子中，我看到'.hide（）'被註釋掉了，沒有'.show（）'評論任何地方。你忘了使用它，或者你只是完全刪除它？ – Matt 2013-04-20 01:10:52

你可以嘗試這樣的：

在你的函數validateRequest（）阿賈克斯成功，在那裏你是顯示警告的地方（「驗證」）;用這個和嘗試：

$('#Result').load('@Url.Action("GetLoanInfo", "Validate")');

在您的視圖中所做的結果股利空

<div id="Result"> </div>

告訴我，如果它幫助。

來源

2013-04-20 04:44:05

它的工作..謝謝！:) – 2013-04-21 00:50:06

如何根據MVC4中使用jQuery AJAX的服務調用得到的結果顯示/隱藏部分視圖？

回答

相關問題