티스토리 뷰

💼 정보 ver1.0

Ajax.ActionLink

James Wetzel 2013. 6. 6. 12:36
728x90
반응형


jquery-1.7.1.min.js


jquery.unobtrusive-ajax.min.js


[View]

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>


<!DOCTYPE html>


<html>

<head runat="server">

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

    <title>GetTime</title>

    <script src="<%: Url.Content("~/Scripts/jquery-1.7.1.min.js") %>" type="text/javascript"></script>

    <script src="<%: Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")%>" type="text/javascript"></script>

    <script type="text/javascript">

        function OnBegin() {

            alert("OnBegin");

        }


        function OnComplete() {

            alert("OnComplete");

        }


        function OnSuccess() {            

            alert("OnSuccess");

        }


        function OnFailure(ajaxContext) {

            if (ajaxContext.readyState === 4) {

                alert("OnFailure\nCode: " + "[" + ajaxContext.status + "]" + "\nDiscription: " + ajaxContext.statusText);

            }

        }

    </script>

</head>

<body>

    <div>

        <h2>What time is it?</h2>

        <p>

            Show me the time in:

            <%: Ajax.ActionLink("UTC", "GetTime", new { zone = "utc"}, new AjaxOptions{ UpdateTargetId = "myResults"}) %>

            <%: Ajax.ActionLink("KST", "GetTime", new { zone = "kst"}, new AjaxOptions{ UpdateTargetId = "myResults"}) %>

        </p>

        <h2>AjaxOptions</h2>

        <p>

            Confirm Option:

            <%: Ajax.ActionLink("UTC", "GetTime", new { zone = "utc"}, new AjaxOptions{ UpdateTargetId = "myResults", Confirm = "UTC 시간 정보를 출력 할까요?"}) %>

            <%: Ajax.ActionLink("KST", "GetTime", new { zone = "kst"}, new AjaxOptions{ UpdateTargetId = "myResults", Confirm = "KST 시간 정보를 출력 할까요?"}) %>

        </p>

        <p>

            HttpMethod(get, post, put, delete) Option:

            <%: Ajax.ActionLink("UTC", "GetTime", new { zone = "utc"}, new AjaxOptions{ UpdateTargetId = "myResults", HttpMethod = "get"}) %>

            <%: Ajax.ActionLink("KST", "GetTime", new { zone = "kst"}, new AjaxOptions{ UpdateTargetId = "myResults", HttpMethod = "post"}) %>

        </p>

        <p>

            Insertion(Replace[기본값], InsertBefore, InsertAfter) Option:

            <%: Ajax.ActionLink("UTC", "GetTime", new { zone = "utc"}, new AjaxOptions{ UpdateTargetId = "myResults", InsertionMode = InsertionMode.InsertBefore}) %>

            <%: Ajax.ActionLink("KST", "GetTime", new { zone = "kst"}, new AjaxOptions{ UpdateTargetId = "myResults", InsertionMode = InsertionMode.InsertAfter}) %>

        </p>

        <p>

            LoadingElementId Option:

            <%: Ajax.ActionLink("UTC", "GetTimeFromLoading", new { zone = "utc" }, new AjaxOptions { UpdateTargetId = "myResults", LoadingElementId = "loadingImage" })%>

            <%: Ajax.ActionLink("KST", "GetTimeFromLoading", new { zone = "kst" }, new AjaxOptions { UpdateTargetId = "myResults", LoadingElementId = "loadingImage" })%>

        </p>

        <p>

            OnBegin, OnComplete, OnSuccess, OnFailure Option:

            <%: Ajax.ActionLink("UTC", "GetTime", new { zone = "utc" }, new AjaxOptions { UpdateTargetId = "myResults", OnBegin = "OnBegin", OnSuccess = "OnSuccess", OnComplete = "OnComplete" })%>

            <%: Ajax.ActionLink("KST", "", new { zone = "kst"}, new AjaxOptions{ UpdateTargetId = "myResults", OnFailure = "OnFailure"}) %>

        </p>

        <p>

            Url(라우팅으로 생성된 Url보다 Option Url이 우선순위를 같는다.) Option:

            <%: Ajax.ActionLink("UTC", "", new { zone = "utc" }, new AjaxOptions { UpdateTargetId = "myResults", Url = "/AjaxSample/GetTime?zone=utc"})%>

            <%: Ajax.ActionLink("KST", "GetTime", new { zone = "kst" }, new AjaxOptions { UpdateTargetId = "myResults", Url = "http:msdn.microsoft.com", OnFailure = "OnFailure"})%>

        </p>

        <br />

        <h2>처리 결과</h2>

        <div id="myResults" style="border: 2px dotted red; padding: .5em;">myResult</div>

        <img id="loadingImage" src="../../Content/Image/loading-file.gif" alt="로딩중..." style="display:none;" />

        

        <p>This page was generated at <%: DateTime.Now.ToString("h:MM:ss tt") %></p>

    </div>

</body>

</html>



[Controller]

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;


namespace EmptyMvcApplication.Controllers

{

    public class AjaxSampleController : Controller

    {

        public ViewResult Time()

        {

            return View();

        }


        public ActionResult GetTime(string zone)

        {

            //비동기 요청인 경우

            if (Request.IsAjaxRequest())

            {

                DateTime time = DateTime.UtcNow.AddHours(offsets[zone]);

                string result = string.Format("<div>The time in {0} is {1:h:MM:ss tt}</div>", zone.ToUpper(), time);


                return Content(result);

            }

            else

            {

                return View();

            }

        }


        public string GetTimeFromLoading(string zone)

        {

            TimeSpan stopTime = new TimeSpan(0, 0, 5);

            System.Threading.Thread.Sleep(stopTime);


            DateTime time = DateTime.UtcNow.AddHours(offsets[zone]);

            return string.Format("<div>The time in {0} is {1:h:MM:ss tt}</div>", zone.ToUpper(), time);

        }


        private Dictionary<string, int> offsets = new Dictionary<string, int>() {

            {"utc", 0}, {"kst", 9}

        };


        public ViewResult Login()

        {

            return View();

        }

    }

}



728x90
반응형