[ ASP.NET ] ASP.NET AJAX / ASP.NET AJAX 사용법 / .NET AJAX
ASP.NET 으로 작업을 하다가 보면 AJAX를 사용해야될 일이 아주 많다.
보통은 jQuery Ajax를 많이 사용하지만, 같은 서버에서 작업되어 있는 부분이라면 아래처럼 사용가능하다.
.NET 에서 제공하는 Ajax를 사용하려면 아래의 두 스크립트를 추가 해줘야 한다.
-> 스크립트 추가
|
1
2 |
<script src="<%= Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>" type="text/javascript"></script> |
cs |
-> 사용
|
1
2
3
4
5
6
7
8 |
<%= Ajax.ActionLink("Update Status", "GetStatus", new AjaxOptions{UpdateTargetId="status" }) %>
<% using (Ajax.BeginForm("UpdateForm", new AjaxOptions { UpdateTargetId = "textEntered" }))
{ %>
<%= Html.TextBox("textBox1","Enter text")%>
<input type="submit" value="Submit" /><br />
<span id="textEntered">Nothing Entered</span>
<% } %> |
cs |
-> aspx 전체 페이지 소스
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25 |
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
AjaxTest
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script src="<%= Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>" type="text/javascript"></script>
<h2>
<%= Html.Encode(ViewData["Message"]) %></h2>
<p>
Page Rendered:
<%= DateTime.Now.ToLongTimeString() %>
</p>
<span id="status">No Status</span>
<br />
<%= Ajax.ActionLink("Update Status", "GetStatus", new AjaxOptions{UpdateTargetId="status" }) %>
<br />
<br />
<% using (Ajax.BeginForm("UpdateForm", new AjaxOptions { UpdateTargetId = "textEntered" }))
{ %>
<%= Html.TextBox("textBox1","Enter text")%>
<input type="submit" value="Submit" /><br />
<span id="textEntered">Nothing Entered</span>
<% } %>
</asp:Content> |
cs |
-> cs 페이지
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 |
//페이지 호출
public ActionResult AjaxTest()
{
return View();
}
//현재 시간을 리턴
public string GetStatus()
{
return "Status OK at " + DateTime.Now.ToLongTimeString();
}
//현재시간을 textbox에 입력
public string UpdateForm(string textBox1)
{
if (textBox1 != "Enter text")
{
return "You entered: \"" + textBox1.ToString() + "\" at " +
DateTime.Now.ToLongTimeString();
}
return String.Empty;
} |
cs |
-> 결과
아래 결과를 보면 페이지가 랜더링 된 시간과 서브밋한 시간 차이를 통해서.. 전체페이지가 새로고침 되지 않고 AJAX가 제대로 작동 되었다는 것을 알 수 있다.
'웹프로그래밍 > ASP.NET' 카테고리의 다른 글
| Repeater사용방법/ASP.NET REPEATER/REPEATER onitemdatabound/리피터 사용방법 (0) | 2020.08.04 |
|---|---|
| [ASP.NET ] ASP.NET 노드추가 / 속성추가 / xml node 추가 / ASP.NET XML 노드추가하는법 (0) | 2016.03.08 |
| [ ASP.NET ] HTML 파일 읽기 / ASP.NET HTML / ASP.NET HTML 파일 (0) | 2016.02.24 |
| [ ASP.NET ] XML 출력 / XML 형태로 출력하는 방법 / XML생성 / ASP.NET XML (0) | 2016.02.23 |
| [ ASP.NET ] C# 숫자인지 확인 / 스트링 숫자체크 / 문자열 숫자확인 (0) | 2016.02.22 |