2009-10-14 2 views
1

내 애플리케이션에 새 계정을 만들기위한보기가 있습니다. 이 뷰는 Html.BeginForm()으로 시작하고 오른쪽 컨트롤러 (Create)에 아무런 문제가 없습니다.MVC 1.0 Ajax.BeginForm()은 Html.BeginForm() 내부에 제출합니다.

나는 Ajax.BeginForm()을 추가하여 동일한 이름의 계정이 내 응용 프로그램에 아직 존재하지 않도록 할 것을 결정했습니다.

두 단추 중 하나를 사용하여 제출을 클릭하면 동일한 컨트롤러 (만들기)로 이동합니다. 어떤 제출 버튼을 클릭했는지 구분하기 위해 요청이 Ajax인지 확인한 다음 다른 코드 경로를 실행 해 봅니다. 그러나 Request.IsAjaxRequest()은 실행되지 않습니다. MS Ajax를 사용하여 기존 양식에이 기능을 구현하는 가장 좋은 방법은 무엇입니까?

<% using (Html.BeginForm()) {%> 
      .............. 
    <% using(Ajax.BeginForm("Echo", 
    new AjaxOptions() { UpdateTargetId = "EchoTarget" })) 
    { %>  
    Echo the following text: 
    <%=Html.TextBox("echo", null, new { size = 40 })%> 
    <input type="submit" value="Echo" /> 
    <% } %> 
    <div id="EchoTarget"> 

컨트롤러 코드 :

[AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult Create(User newUser) 
    { 
     if (Request.IsAjaxRequest()) 
     { 
      return Content("*you hit the ajax button"); 
     } 
     else 
     { //regular create code here..... 
     } 
    </div> 

답변

2

이 도움이

<SCRIPT> 
    function InnerFormSubmitter(dataForm, actionForm) { 
    actionForm.innerHTML = dataForm.innerHTML; 
    actionForm.submit();  
} 
</SCRIPT> 

<form name="yourButton" action="ValidateSomething" method="post"></form> 

<form name="mainForm" action="SavedData" method="post"> 
<input type="textbox" name="text1"> 
<input type="textbox" name="text2"> 
<button name="validateUserButton" id="FormButton" onChange= 
"InnerFormSubmitter (this.form, document.getElementById('yourButton'))"> 

</button> 
    </form> 

희망 같은 일부 기능에서 자바 스크립트 usage..use 여러 형태로 주장하는 경우! 시나리오에 대한 jQuery를 사용에

부록 :

<a href="javascript:isValidUser(<%=Model.USerId%>);">Check Availability</a> 


function isValidUser(userId) { 
var url = "<CONTROLLER>/<ACTION>/" + userId; 
$.post(url, function(data) { 
    if (data) { 
     // callback to show valid user 
    } else { 
     // callback to show error/permission 
    } 
}); 
} 

그리고 당신은 컨트롤러가 있어야한다 :

[AcceptVerbs("POST")] 
public bool IsValidUser(int id) { 
// check availability 
bool allow = CheckUser(); 

// if allow then insert 
if (allow) { 
    //insert user 

    return true; 
} else { 
    return false; 
} 
} 

또한 업데이트를 jQuery를 당신이 링크를 원하기 때문에

:

대신

document.getElementById('UserIdent').value 

의 당신이 JSON 사용

JsonResult 클래스에

$('#UserIdent').val(); 

업데이트를 사용할 수는 컨트롤러와 뷰 $.getJson 기능을 사용해야합니다.

$(function() { 
    $('#yourLinkOrButton').click(function() { 
     $.getJSON("<CONTROLLER>/GetUserAvailability/", null, function(data) { 
      $("#yourDivorLablel").<yourFunctionToUpdateDiv>(data); 
     }); 
    }); 

    public JsonResult GetUserAvailability() 
    { 
     //do all validation and retrieval 
     //return JsonResult type 

    } 
+0

Iframe을 사용할 수도 있습니다. http://ajaxpatterns.org/IFrame_Call –

+1

여러 양식이 실제로 문제가되지 않습니다. 문제를 중첩시키는 것만 큼 중요한 것은 아닙니다.JS에 의지한다면 HTML 양식을 사용하는 대신 POST를 직접 작성할 수도 있습니다. –

+0

유능한 우아한 솔루션은 jQuerypowerhorse를 MVC 카트에 연결 한 후 JSON 요청 메커니즘을 사용하는 것입니다. –

2

를 중첩 할 수 없습니다 양식, 이제까지 어떤 HTML 페이지에 상관없이 양식을 생성하는 방법에 대해 설명합니다. 올바른 HTML이 아니므로 브라우저에서 제대로 처리하지 못할 수 있습니다. 어린이보다는 형제 자매가되어야합니다.

+0

예, 그렇습니다. 설명 주셔서 감사합니다! 이제 내 원래의 문제가 남아 있습니다. 다시 실행하지 않고 컨트롤러를 실행하고 실행할 수있는 첫 번째 폼 안에 어떻게 단추를 넣을 수 있습니까? – Mouffette

+0

JavaScript로 할 수 있습니다. (즉, onclick 처리기가있는 단추) 또는 폼을 다른 폼 내부에 배치하는 대신 서로 옆에 배치 할 수 있습니다. –

+0

또는 절대 위치 지정 부두가 양식 b를 양식 안쪽으로 떨어 뜨립니다. –