如何更新MVC Ajax中的TextBox

Question

如何使用MVC Ajax UpdateTargetId選項更新文本框？

我是MVC Ajax應用程序的新手。請任何人幫助我。

感謝， PON庫馬爾Pandian .T

Answer 1

我們無法直接在UpdateTargetId屬性中給出文本框控件ID。伯爾我們可以解決這個問題。請罰款相同的吹打代碼。

//這個回調方法一旦ajax請求成功。

function fnOnSuccess(context) { 

     alert(context); //this context having all the current ajax req & res information. 

     var response = context.get_data(); //Using this get_data() method we can get the response from server. 

     $('#txtajaxResponse')[0].value = response;  
    } 


<!-- Code in .aspx page --> 
<%=Ajax.ActionLink("TextBox in UpdateTargetId","GetInfo","Ajax",new AjaxOptions{OnSuccess = "fnOnSuccess"}) %> 

<%=Html.TextBox("txtajaxResponse")%> 

感謝， PON庫馬爾Pandian .T

Answer 2

你可以簡單地包裝所有你想在一些DIV與ID相同，你在UpdateTargetId屬性將進行更新，並返回新的內容（與新價值的新文本框）。並且不要忘記將Ajax更新類型設置爲替換（不附加）。

Answer 3

可以實現使用

1-郵政\獲取

2-阿賈克斯

需要注意的是簡單的概念：只需更換$（「＃myform」）。html（）with $（「＃mytext」）。text =「data」

1-使用GET \郵政

/////// Controller post and get simple text value 
[HttpPost] 
    public string Contact(string message) 
    { 
     return "<h1>Hi,</h1>we got your message, <br />" + message + " <br />Thanks a lot"; 
    } 

////在視圖中添加參考的Javascript（jQuery的）文件

@section Scripts{ 

<script src="~/Scripts/modernizr-2.6.2.js"></script> 
<script src="~/Scripts/jquery-1.8.2.intellisense.js"></script> 
<script src="~/Scripts/jquery-1.8.2.js"></script> 
<script src="~/Scripts/jquery-1.8.2.min.js"></script> 
} 

///然後添加Post方法如下：

你

<script type="text/javascript"> 

/// post and get text value 

$("#send").on("click", function() {  
$.post('', { message: $('#msg').val() }) 

//// empty post('') means post to the default controller, 
///we are not pacifying different action or controller 
/// however we can define a url as following: 
/// var url = "@(Url.Action("GetDataAction", "GetDataController"))" 

     .done(function (response) { 
      $("#myform").html(response); 
     }) 
     .error(function() { alert('Error') }) 
     .success(function() { alert('OK') }) 
     return false; 
    }); 

    </script> 

2，也可以使用僅獲得如下：

/////Controller = Home 
    //// Action = FullName 
    ///// get only simple text message 
    [HttpGet] 
    public string FullName() 
    { 
     return "full Name: Mahmoud Sayed"; 
    } 

///視圖：

$("#getfullname").on("click", function() { 
     var url = "@(Url.Action("FullName", "Home"))" 
      $.get(url, { }) 
      .done(function (response) { 
       $("#myform").html(response) 
      }) 
      .error(function() { alert('Error') }) 
      .success(function() { alert('OK') }) 
      return false; 
     }); 
    </script> 

---

3-現在讓我們假設你想用$就和JSON做到這一點：

// Post JSON data add using System.Net; 
    [HttpPost] 
    public JsonResult JsonFullName(string fname, string lastname) 
    { 
     var data = "{ \"fname\" : \"" + fname + " \" , \"lastname\" : \"" + lastname + "\" }"; 
//// you have to add the JsonRequestBehavior.AllowGet 
//// otherwise it will throw an exception on run-time. 
     return Json(data, JsonRequestBehavior.AllowGet); 
    } 

然後，您的視圖中：添加事件點擊輸入按鈕，甚至從提交： 只要確保您的JSON數據格式良好。

$("#jsonGetfullname").on("click", function() { 
     $.ajax({ 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      url: "@(Url.Action("JsonFullName", "Home"))", 
      data: "{ \"fname\" : \"Mahmoud\" , \"lastname\" : \"Sayed\" }", 
      dataType: "json", 
      success: function (data) { 
       var res = $.parseJSON(data); 
       $("#myform").html("<h3>Json data: <h3>" + res.fname + ", " + res.lastname) 
      }, 
      error: function (xhr, err) { 
       alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status); 
       alert("responseText: " + xhr.responseText); 
      } 
     }) 
    }); 

    </script> 

歡呼聲，

馬哈茂德·賽義德