ASP.NET에서 라이트 박스 양식의 포스트 백 문제
-
14-11-2019 - |
문제
ASP.NET 페이지의 라이트 박스 안에 제출 양식을 표시해야합니다. 사용자 이름이 고유하지 않은 것과 같은 제출 양식에 오류가있는 경우 Postback은 LightBox 외부의 ASP.NET 페이지를 렌더링합니다. 그 문제를 어떻게 해결할 수 있습니까?
여기에 라이트 박스가 포함 된 .aspx 페이지의 코드 스 니펫이 있습니다.
<...>
<p>
QunatumMotors is located in Detroit. Please use the link below to contact us.</p>
<p>
<!--START CONTACT FORM OVERLAY-->
<!-- first overlay. id attribute matches the selector -->
<a href="**../informational/contactform.aspx"** rel="#overlay" style="text-decoration:none">
> Click here to contact us
</a>
<div class="simple_overlay" id="form_contact">
<!-- overlayed element -->
<div class="apple_overlay" id="overlay">
<!-- the external content is loaded inside this tag -->
<div class="contentWrap"></div>
</div>
</div>
<!--END CONTACT FORM OVERLAY-->
<p> </p><p> </p>
<...>
.
CONTERM.ASPX는 양식 필드, 필드 유효성 검사기, 라벨이있는 표준 .aspx 페이지 일뿐입니다 (예 : USERMAME 고유하지 않음) 및 버튼 제출. Postbox는 ContactForm.aspx에서 발생할 때 (물론) 라이트 박스 외부에 렌더링됩니다.라이트 박스 안에 ContactForm.aspx의 포스트백을 어떻게 표시 할 수 있습니까? 도움을 주셔서 감사합니다!
해결책
The lightbox content isn't like another tab or window: it becomes part of the host page.
In other words, it incorporates the HTML generated by contactform.aspx
into the host page's document object model (DOM). Activating the lightbox adds a form to the host page that posts to the contact page:
<html><body>
<!-- host page content here -->
<!-- contact form content -->
<form action="contactform.aspx">
<!-- text boxes, buttons, etc. -->
</form>
</body></html>
When the user submits, their browser issues a new request: a POST to contactform.aspx
. That request returns the contact form's HTML.
There are several ways you might work around that:
Use ajax to perform the update asynchronously. (You might even be able to do this by using an UpdatePanel in
contactform.aspx
, but I don't use them much anymore and haven't though that through).Convert
contactform.aspx
into a control (if you're using it in several places) and embed it in the host page.At the end of the contact form's submit handler, redirect to the host page with a flag that instructs the page to immediately activate the lightbox. (This has numerous issues and sounds pretty fragile ... but it's plausible.)