SimpleModal, ASP.Net 포스트 백 중단

https://stackoverflow.com/questions/29174

09-06-2019
|

문제

jQuery 및 SimpleModal 을 사용하여 웹 앱을위한 멋진 대화 상자를 만듭니다. 안타깝게도 모달 대화 상자의 모든 버튼은 더 이상 포스트 백을 실행할 수 없으므로 실제로 허용되지 않습니다.

해결 방법 이 있지만 제 인생에서는 필요한 모든 단계를 완전히 이해하지 못했기 때문에 작동하지 않습니다.

또한 포스트 백을 대체하는 해결 방법이 있지만보기 흉하고 가장 신뢰할 수있는 방법은 아닙니다. 포스트 백이 다시 작동하게 만들고 싶습니다. 어떤 아이디어라도?

업데이트 : 포스트 백을 실행하는 데 사용 된 자바 스크립트가 어떤 식 으로든 깨져서 버튼을 클릭해도 아무 일도 일어나지 않기 때문에 포스트 백이 작동하지 않습니다.

해결책

둘 다 올바른 길을 가고있었습니다.내가 깨달은 것은 SimpleModal이 요소를 찾을 수 없기 때문에 기능을 중단시키는 ASP.Net의 <form> 외부에있는 본문에 대화 상자를 추가한다는 것입니다.

이 문제를 해결하기 위해 'form' 대신 'body'에 eveything을 추가하도록 SimpleModal 소스를 수정했습니다.대화 상자를 만들 때 persist: true 옵션을 사용하여 버튼이 열리고 닫힐 때까지 유지되도록합니다.

제안 해 주신 모든 분들께 감사드립니다!

업데이트 : 버전 1.3은 모달 대화 상자를 추가해야하는 요소를 지정하기 위해 구성에 appendTo 옵션을 추가합니다. 문서는 다음과 같습니다 .

다른 팁

모든 표준 ASP.NET 포스트 백은 페이지에서 __doPostBack javascript 메서드를 호출하여 작동합니다.이 함수는 모든 viewstate와 다른 장점이있는 숨겨진 입력 필드를 포함하는 양식 (ASP.NET은 실제로 페이지 당 하나의 양식 만 좋아함)을 제출합니다.

모달의 내용이 HTTP GET에서 ASP.NET 페이지로 전달되지 않는 한 SimpalModal에서 페이지의 양식이나 표준 숨겨진 입력을 망칠 수있는 어떤 것도 볼 수 없습니다..그 결과 두 개의 ASP.NET 양식이 하나의 DOM으로 렌더링되고 거의 확실하게 __doPostBack 함수가 망가질 것입니다.

ASP.NET AJAX ModalPopup 컨트롤 ?

웹 브라우저는 비활성화되거나 숨겨진 양식 요소를 게시하지 않습니다.

그래서 무슨 일이 일어나고 있는지 :

사용자가 대화 상자의 버튼을 클릭합니다.
버튼은 SimpleModal의 close () 메서드를 호출하여 대화 상자와 버튼을 숨 깁니다.
클라이언트가 버튼의 ID없이 양식을 게시합니다.
ASP.NET 프레임 워크는 어떤 버튼이 클릭되었는지 알 수 없습니다.
서버 측 코드가 실행되지 않습니다.
해결책은 클라이언트에서 필요한 모든 작업을 수행 한 다음 (이 경우 대화 상자 닫기) __doPostback ()을 직접 호출하는 것입니다.
예를 들어 ( "dlg"는 클라이언트 측 SimpleModal 대화 상자 참조) : 라코 디스
대화 상자를 숨기고 양식을 제출 한 다음 해당 버튼에 대한 서버 측 이벤트를 호출해야합니다.
@ 댄 <인용구> <인용구>
모든 표준 ASP.NET 포스트 백은 페이지에서 __doPostBack javascript 메서드를 호출하여 작동합니다.
asp : 버튼은 HTML 입력 컨트롤이 이미 양식을 제출하기 때문에 __doPostback ()을 호출하지 않습니다.

이 문제를 발견했습니다. tghw와 body fix 대신 appendto 양식의 다른 모든 기여자 덕분입니다.(1.3 버전의 속성으로 해결됨)

btw : 누군가 .net에서 프로그래밍 방식으로 대화 상자를 닫아야하는 경우이 유형의 구문을 사용할 수 있습니다. 라코 디스

closedialog의 자바 스크립트는 다음과 같습니다 .... 라코 디스

simplemodal.js를 수정하지 않고 다음 작업을 발견했습니다. 라코 디스

따라서 대화 상자의 버튼을 사용하여 포스트 백을 발생시키는 대신 제출을 방지 한 다음 양식에서 숨겨진 버튼을 찾아 클릭 이벤트를 호출합니다.

FWIW, 귀하가 지적한 블로그 게시물 과 함께 설명하고 여기에 다시 게시했습니다. 이유 및 기타 세부 정보는 블로그 게시물에 있습니다.

해결 방법 (점심 전 마지막 체크인 기준) :

대화 상자의 onClose 이벤트를 재정의하고 다음을 수행합니다.

대화 상자의 기본 닫기 기능 호출
대화 상자 div의 innerHTML을 단일 & nbsp;
__ doPostBack을 탈취하여 새로운 함수 인 newDoPostBack을 가리 킵니다.
웹에서 본 몇 가지 댓글 중 1 번 항목에 대한 설명이 필요합니다. 안타깝게도 저는 더 이상 같은 고용주에 있지 않으며 제가 사용한 코드에 액세스 할 수 없지만 할 수있는 일을 할 것입니다. 먼저, 다음과 같이 새 함수를 정의하고 대화 상자를 가리켜 대화 상자의 onClose 함수를 재정의해야합니다. <인용구> 라코 디스

대화 상자의 기본 닫기 기능을 호출합니다. 정의한 함수에서 먼저 기본 기능을 호출해야합니다 (일반적으로 재정의하는 거의 모든 항목에 대한 모범 사례).
대화 상자 div의 innerHTML을 단일 & nbsp; –이 단계는 필수 단계가 아니므로 이해하지 못하는 경우 건너 뛰십시오.
__ doPostBack을 탈취하여 새로운 함수 인 newDoPostBack을 가리 킵니다. <인용구> 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스

newDoPostBack 함수 작성 : <인용구> 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스 라코 디스

새로운 Jquery.simplemodal-1.3.js에는 appendTo라는 옵션이 있습니다.따라서 기본값은 asp.net에서 작동하지 않는 appendTo : 'body'이므로 appendTo : 'form'이라는 옵션을 추가하십시오.

같은 문제가 있었지만 {appendTo:'form'}로 인해 모달 팝업이 완전히 잘못 렌더링되었습니다 (CSS 문제가있는 것처럼).

내가 만들고있는 템플릿에 페이지에 다른 양식을 넣는 포함이 포함되어 있습니다.{appendTo:'#aspnetForm'} (기본 Asp.net 양식 ID)를 설정하면 모든 것이 잘 작동했습니다 (포스트 백 포함).

tghw의 답변 외에도이 훌륭한 블로그 게시물이 도움이되었습니다. jQuery : 모달 형식의 포스트 백 수정 -특히 BtnMike의 의견 :"또한 asp : button에 CssClass="simplemodal-close"를 설정하지 않아야합니다. "수업에서 벗어난 것은 분명하지 않은 해결책이었습니다.

-존

SimpleModal 소스를 수정하지 않으려면. 시도해보세요 ..

modal () 메서드를 호출 한 후 다음을 추가합니다. 라코 디스

SimpleModal 플러그인은이 두 가지를 마크 업에 추가합니다.

'simplemodal-overlay'for the background
'simplemodal-container'는 팝업 모달로 원하는 div를 포함합니다.

라이센스 : CC-BY-SA ~와 함께 속성

제휴하지 않습니다 StackOverflow