JQuery를 사용하여 Ajax.BeginForm의 파이어 포스트

Question

두 번째 드롭 다운 목록이있는이 MVC 폼은 첫 번째 드롭 다운에서 selection이 AJAX 호출을 통해 두 번째 드롭 다운을 업데이트해야합니다. 다음 JQuery와 스크립트와

<%using (Ajax.BeginForm("GetChildren", "Home", null, new AjaxOptions { UpdateTargetId = "result" }, new Dictionary<string, object> { { "id", "someForm" } })) 
{ %> 
<%= Html.DropDownList("masterSelection", new SelectList((IList<Master>)ViewData["Master"], "MasterName", "MasterName"))%> 
<span id="result"> 
    <%Html.RenderPartial("ChildSelection");%> 
</span> 
<% } %> 

: 다음과 같이

양식 보이는

내가 바로 태그의 onsubmit가 나타나면 이것은 다음과 같은 클라이언트 측 HTML

<form action="/Home/GetChildren" id="someForm" method="post" onclick="Sys.Mvc.AsyncForm.handleClick(this, new Sys.UI.DomEvent(event));" onsubmit="Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.InsertionMode.replace, updateTargetId: &#39;result&#39; });"> 

로 변환

$(function() { 
    $("#masterSelection").change(function() { 
     $("#someForm").submit(); 
    }); 
}); 

AJAX 호출을 처리하고 양식의 정상적인 동작을 방지해야합니다 (완전 새로 고침).

이제는 Firefox에서 정상적으로 작동하지만 IE에서는 기본 동작이 취소되지 않아 양식의 onsubmit 코드로 인한 AJAX 호출이 발생하고 두 번째로 페이지가 새로 고쳐집니다.

분명히 내가 원하는 것이 아닙니다.

onsubmit javascript 코드를 디버깅 할 때 내 양식의 기본 게시 동작을 취소해야하는 MicrosoftAjax.js 파일의 메서드가 발생합니다.

function Sys$UI$DomEvent$preventDefault() { 
    /// <summary locid="M:J#Sys.UI.DomEvent.preventDefault" /> 
    if (arguments.length !== 0) throw Error.parameterCount(); 
    if (this.rawEvent.preventDefault) { 
     this.rawEvent.preventDefault(); 
    } 
    else if (window.event) { 
     this.rawEvent.returnValue = false; 
    } 
} 

IE를 사용하여 디버깅하는 동안 this.rawEvent.returnValue = false; 어떤 IE에서 이벤트를 취소하는 올바른해야하지만 apparebtly이 나를 위해 작동하지 않습니다.

저는 이미 jQuery를 사용하여 AJAX 호출을 실행하고 새로운 드롭 다운 목록 클라이언트 측 또는 다른 곳에서 보이지 않는 버튼을 폼에 추가하여 변경시 클릭 이벤트라고 부르는 대체 솔루션을 개발했습니다 첫 번째 드롭 다운의 이벤트가 있지만 여전히 첫 번째 드롭 다운을 사용하고 싶습니다 (가장 깨끗한 이미지).

어떤 조언이 필요합니까?

S.

Answer 1

을 사용해 보았습니다. 다음과 같이 검색해 보았습니다. $("#someForm").submit();을 호출하는 것만 큼 좋지는 않지만, 여전히 드롭 다운 목록을 작성하는 것보다 더 선호하는 방식을 생각해 냈습니다. 클라이언트 측에서는 AJAX 호출 후 또는 숨겨진 버튼 클릭을 호출합니다.

페이지에서 Ajax.BeginForm을 제거했습니다.

<%= Html.DropDownList("masterSelection", new SelectList((IList<Master>)ViewData["Master"], "MasterName", "MasterName"))%> 
<span id="result"> 
    <%Html.RenderPartial("ChildSelection");%> 
</span> 

그리고 나는 다음과 같은 게시물이 방법 덕분에 발견

$(function() { 
     $("#masterSelection").change(function() { 
      $('#result').load("Home/GetChildren", { masterSelection: this.value }); 
     }); 
    }); 

내 두 번째 드롭 다운리스트의 내용을 변경하는 JQuery와 부하 방법을 사용하십시오 Render partial form in jQuery dialog

이 IE와 FF 모두 작동을 나를 위해.

저는 여전히 제 첫 번째 코드가 IE에서 작동하지 않는 이유를 알고 싶습니다.

Answer 2

아직 해결되지 않았습니까? window.Event에 alert()을 설정하면 IE가 실제로 호출 중인지 확인할 수 있습니까? 또한 단순히 return false(); 대신 this.rawEvent.returnValue = false;