JSON 결과를 Ajax에 반환하려면 어떻게 해야 합니까?시작 양식
다음과 같은 간단한 양식이 있습니다.
@using (Ajax.BeginForm("CreateProductFromAjaxForm","Product" ,
null,
new AjaxOptions() { HttpMethod = "post", OnSuccess = "getresult" },
null))
{
@Html.EditorFor(m => m)
<hr />
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" class="btn btn-info" value="Next" />
</div>
</div>
}
또한 테스트를 위해 다음과 같은 간단한 컨트롤러:
[HttpPost]
public JsonResult CreateProductFromAjaxForm(CreateProductModel model)
{
if (!ModelState.IsValid)
{
return new JsonResult()
{
JsonRequestBehavior = JsonRequestBehavior.AllowGet,
Data = new { result = "error" }
};
}
//add to database
return new JsonResult()
{
JsonRequestBehavior = JsonRequestBehavior.AllowGet,
Data = new { result = "success"}
};
}
저는 이것들을 웹에 추가했습니다.설정:
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
스크립트 번들에 다음과 같이 입력합니다.
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js",
"~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js"
));
"Submit(제출)" 버튼을 클릭하면 다음과 같이 표시됩니다.
{"result":"success"}
그 결과를 제가 처리할 수 있을 거라고 생각합니다.OnSuccess="getresult"
핸들러인데 작동이 안 되는 것 같아요.
기본적으로는Ajax.BeginForm
주로 클라이언트측 검증에 사용됩니다.
뭐가 문제인지 말씀해 주시겠어요?
업데이트: 추가했습니다.HttpMethod = "post"
Ajax Options로 이동합니다.
업데이트:getresult
의 상부에 정의되어 있습니다.Ajax.BeginForm
다음과 같습니다.
<script type="text/javascript">
var getresult = function (data) {
alert(data.result);
};
</script>
포함시킬 필요가 있습니다.jquery.unobtrusive-ajax.js
파일.
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
JsonResult는 ActionResult 파생 클래스의 일종으로, 이 동작에 의해 뷰나 다른 것이 아닌 JSON이 반환되는 것을 나타냅니다.
예를 들어 다음과 같습니다.
@using (Ajax.BeginForm("CreateProductFromAjaxForm","Product" , null,
new AjaxOptions() { OnSuccess = "getresult" }, null))
그러면 액션에 전송될 때 AJAX 요청을 보내는 요소가 생성됩니다.이 작업을 수행하려면 페이지에 다음 스크립트를 포함해야 합니다.
이제 이 onSuccess javascript 함수를 작성하고 서버에서 반환된 JSON 결과를 처리하는 일만 남았습니다.
<script type="text/javascript">
var onSuccess = function(data) {
alert(data.result);
};
</script
페이지에
new AjaxOptions() {
OnSuccess = "getresult",
}
자바스크립트로
function getresult(data){
alert(data.x);
}
c#에서
[HttpPost]
public ActionResult CreateProductFromAjaxForm(CreateProductModel model)
{
if (!ModelState.IsValid)
{
return Json("error", JsonRequestBehavior.AllowGet);
}
//add to database
return Json(model, JsonRequestBehavior.AllowGet);
}
HTTP 메서드를 지정해 보십시오.
new AjaxOptions() {
OnSuccess = "getresult",
HttpMethod = "post"
}
예:
@using (Ajax.BeginForm("CreateProductFromAjaxForm", "Product" , null, new AjaxOptions() { OnSuccess = "getresult", HttpMethod = "post" }, null))
{
....
}
나는 내 프로젝트에서 같은 문제에 직면했다.Ajax 라이브러리가 로드되지 않는 것이 문제입니다.확인해보니bundleconfig
그리고 내 레이아웃 파일에는 포함이 들어있었지만, 나는 Ajax 라이브러리의 절대적인 이름을 포함하고 있다.
bundles.Add(new ScriptBundle("~/bundles/jqueryajax").Include(
"~/Scripts/jquery.unobtrusive-ajax.min.js"));
내 친구가 대신 와일드카드를 사용하라고 했어.의외로bundles.Add(new ScriptBundle("~/bundles/jqueryajax").Include("~/Scripts/jquery.unobtrusive-ajax*"));
Ajax 라이브러리를 포함하기 시작했습니다.
이제 나의OnSuccess
json response가 표시된 빈 화면을 보는 것이 아니라 예상대로 함수가 로드됩니다.
대신:
var getresult = function (data) {
alert(data.result);
};
해라
function getresult(data) {
alert(data.result);
};
언급URL : https://stackoverflow.com/questions/20746784/how-can-i-return-a-json-result-to-a-ajax-beginform
'sourcecode' 카테고리의 다른 글
Wordpress & SQL: 모든 투고에 커스텀 필드 추가 (0) | 2023.03.10 |
---|---|
React.js, 멀티파트/폼 데이터를 서버로 전송하는 방법 (0) | 2023.03.10 |
각도로 주행뷰 로드 시 JS 초기화 코드 (0) | 2023.03.10 |
iOS - 루트 JSON 어레이에 Object Mapper를 빠르게 매핑합니다. (0) | 2023.03.10 |
Oracle의 기존 테이블에 기본 키 자동 증가 추가 (0) | 2023.03.10 |