サンプル
http://blogs.yahoo.co.jp/dk521123/35813912.html
のサンプルをベースに作成。（コントローラは同じ。ビューだけ違う）
コントローラ
SampleAjaxController.vb
Imports System.Web.Mvc
Namespace Controllers
Public Class SampleAjaxController
Inherits Controller
' GET: SampleAjax
Function Index() As ActionResult
Return View()
End Function
' ★ここ★
<ValidateAntiForgeryToken()>
Public Function SayHello(name As String) As ActionResult
' リクエストがAjax通信（非同期通信）である場合値を返す
If Request.IsAjaxRequest() Then
Return Json(New With {Key .ResultMessage = "Hello, " & name & "!"},
JsonRequestBehavior.AllowGet)
Else
' リクエストがAjax通信以外の場合、何もしない
Return New EmptyResult()
End If
End Function
End Class
End Namespace
ビュー
Index.vbhtml
@Code
ViewData("Title") = "Index"
End Code
<script src="@Url.Content("~/Scripts/jquery-1.10.2.js")" type="text/javascript"></script>
<script src = "@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src = "@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout-3.4.0.debug.js")" type="text/javascript"></script>
@Using Ajax.BeginForm("SayHello",
New AjaxOptions With {
.HttpMethod = "POST",
.OnSuccess = "onSuccess",
.OnFailure = "onFail"})
@Html.TextBox("Name", "")
@Html.AntiForgeryToken()
@<input type="submit" value="Say Hello" />
End Using
<div id="result" data-bind="text: message"></div>
<script type="text/javascript">
function SampleViewModel() {
var self = this;
self.message = ko.observable('Here');
}
var viewModel = null;
$(function () {
// 初期化
viewModel = new SampleViewModel();
ko.applyBindings(viewModel);
});
function onSuccess(data) {
viewModel.message(data.ResultMessage);
}
function onFail() {
viewModel.message("Fail...");
}
</script>
