JQuery-AJAX

@model jQuery_AJAX_MVC.Models.PersonModel

 

@{

Layout = null;

}

 

<!DOCTYPE html>

 

<html>

<head>

    <meta name="viewport" content="width=device-width"/>

    <title>Index</title>

</head>

<body>

    <input type="text" id="txtName"/>

    <input type="button" id="btnGet" value="Get Current Time"/>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

    <script type="text/javascript">

     $(function () {

         $("#btnGet").click(function () {

             $.ajax({

                 type: "POST",

                 url: "/Home/AjaxMethod",

                 data: '{name: "' + $("#txtName").val() + '" }',

                 contentType: "application/json; charset=utf-8",

                 dataType: "json",

                 success: function (response) {

                     alert("Hello: " + response.Name + " .\nCurrent Date and Time: " + response.DateTime);

                 },

                 failure: function (response) {

                     alert(response.responseText);

                 },

                 error: function (response) {

                     alert(response.responseText);

                 }

                });

         });

     });

    </script>

</body>

</html>