ajax 모달 팝업 확장기가있는 문제

두 개의 모달 팝업을 표시하는 동안 문제가 있습니다. 시나리오가 다음과 같이 변경됩니다.ajax 모달 팝업 확장기가있는 문제

버튼을 클릭 할 때 하나의 모달 팝업이 표시됩니다.이 모달 팝업창에는 다른 버튼이 있습니다. 이 버튼을 클릭하면 다른 모달 팝업이 표시됩니다. 이제 문제는, 내가 두 번째 팝업을 표시하면, 첫 번째 팝업 여전히 clikable입니다. 사용자가 첫 번째 팝업을 클릭 할 수 없도록하려면 어떻게해야합니까?

도움이 될 것입니다.

고마워요!

출처

2009-05-27 Anonymous

이 HTML을 함께 할 수있는 뭔가가 가정 :

두 번째 팝업의 Z- 색인이 첫 번째

1 팝업 다음 높게 설정 :

position:relative; 
z-index:1;

2 팝업 :

position:relative; 
z-index:2;

출처

2009-05-27 14:35:09 mkoryak

나는 이것에 부딪 혔습니다 ... 당신이 Extender를 어디에 놓았는지에 관한 약간의 변덕이있었습니다. 그들의 패널과의 관계. 어떤 버전이 작동하는지는 구체적으로 기억할 수 없지만 다음 조합으로 재생할 수 있습니다.

<!-- 2 Seperate Panels & Extenders --> 
<ajt:ModalPopupExtender ID="mpe1" TargetControlID="pnl1" /> 
<asp:Panel ID="pnl1"> 
    <asp:Button ID="btn1" /> <!-- launches pnl2 popup --> 
</asp:Panel> 

<ajt:ModalPopupExtender ID="mpe2" TargetControlID="pnl2" /> 
<asp:Panel ID="pnl2"> 
    Content 
</asp:Panel>

대.

<!-- 2 Nested Panels & But separate Extenders --> 
<ajt:ModalPopupExtender ID="mpe1" TargetControlID="pnl1" /> 
<asp:Panel ID="pnl1"> 
    <asp:Button ID="btn1" /> <!-- launches pnl2 popup --> 
    <asp:Panel ID="pnl2"> 
     Content 
    </asp:Panel> 
</asp:Panel> 
<ajt:ModalPopupExtender ID="mpe2" TargetControlID="pnl2" />

대.

<!-- 2 Fully Nested Panels & Extenders --> 
<ajt:ModalPopupExtender ID="mpe1" TargetControlID="pnl1" /> 
<asp:Panel ID="pnl1"> 
    <asp:Button ID="btn1" /> <!-- launches pnl2 popup --> 
    <ajt:ModalPopupExtender ID="mpe2" TargetControlID="pnl2" /> 
    <asp:Panel ID="pnl2"> 
     Content 
    </asp:Panel> 
</asp:Panel>

출처

2009-05-27 14:38:06

당신은 어느 페이지 출력 회색이 또는 뒤에 코드에서 클릭을 캡처하고 externer.hide() 메서드를 호출하여 이전 팝업을 숨길 그것을 말해 그 줄 것입니다 수있는 배경 CssClass을 설정할 수 있습니다 당신이 찾고있는 것.

출처

2009-12-12 18:28:09 Middletone

비슷한 문제가 있습니다. 2 개의 모달 팝업을 사용하는 대신 하나의 패널에 두 개의 패널을 배치하십시오. 부모 패널은 모달 팝업 익스텐더를 가져오고, 두 개의 내부 버튼은 클릭 한 버튼에 따라 숨기거나 표시합니다. 모달에 적용된 스타일에 따라 CSS에서 z- 인덱스를 적용해도 작동하지만 다른 모달을 통해 빛나고 있습니다.

두 아이를 가진 패널의 빠른 코드 예제는 다음과 같습니다

<asp:Panel id="pnlParent" runat="server"> 
<asp:panel id="pnlChild1" runat="server" visible="false"> 
... controls ... 
</asp:Panel> 
<asp:Panel id="pnlChild2" runat="server" visible="false"> 
</asp:panel> 
<asp:ModalPopupExtender id="mpePnlParent" runat="server" ...other attributes .../>

이제 첫 번째 버튼 클릭에, true로 pnlchild1의 가시성을 설정합니다. pnlChild1의 버튼 onclick 이벤트는 pnlChild1의 가시성을 false로 설정하고 pnlChild2의 가시성을 true로 설정합니다.

마지막으로 두 번째 하위 패널을 완료하는 모든 작업에서 하위 패널을 숨기고 패널의 .Hide() 메소드로 모달 팝업을 숨 깁니다.여기

는 일부 메인 화면의 배경을 회색으로 모달 팝업에 시도하는 CSS하고, "하이라이트"모달 내용

.modalBackground 
{ 
    background-color: #000011; 
    -moz-opacity: .60; 
    filter: alpha(opacity=60); 
    opacity: .60; 
} 
.modalPopup 
{ 
    padding: 5px; 
    border: 5px outset #00F; 
    background-color: #FFF; 
    width: 640px; 
}

위의 CSS는 크로스 브라우저가 안전합니다.

굿 럭

출처

2011-08-09 01:18:28 Feuerwehrmann

ajax 모달 팝업 확장기가있는 문제

답변

관련 문제