17 Ekim 2016 Pazartesi

Ajax Modal Popup Extender Kullanımı

Kullanıcı dostu bir pop up;  Ajax Modal Popup Extender
Uyarı, hata ve hatta sayfada video gösterimi için çok işe yarar.
CSS:
 .popUp {
            background-color: black;
           filter: alpha(opacity=60);
            opacity: 0.6;
}
 Aspx:
 <!--script manager sayfaya eklenince
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
Otomatik eklenecektir. Eklenmez ise dikkat :)  -->
 <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <br />
<!-- Pop Up'u açmak ( göstermek için kullanılacak düğme -->
        <asp:Button ID="dGoster" runat="server" Text="Aç" OnClick="dGoster_Click"  />
<!-- Pop Up içinde görünecek panel paneli istediğim şekilde biçimlendire bilirim  -->
        <asp:Panel runat="server" ID="panelPop">
            panel deneme
            <br />
<!-- Pop Up'u gizlemek için bir düğme -->
             <asp:Button runat="server" Text="Gizle" ID="dGizle" OnClick="dGizle_Click" />
<!-- Pop Up'un içinde işlem yapmak için her hangi bir düğme -->
            <asp:Button ID="dDevam" runat="server" Text="Sayfaya Git" OnClick="dDevam_Click" />
      </asp:Panel>
         <asp:ModalPopupExtender ID="AjxPopUp" runat="server" PopupControlID="panelPop" TargetControlID="dGoster" BackgroundCssClass="popUp" DropShadow="true" >
</asp:ModalPopupExtender>
Cs:
// pop up'u göster komutu
    protected void dGoster_Click(object sender, EventArgs e)
    {
        AjxPopUp.Show();
    }
//Pop up'u gizle komutu
    protected void dGizle_Click(object sender, EventArgs e)
    {
        AjxPopUp.Hide();
    }
//pop up içinde bir işlem düğmesi
    protected void dDevam_Click(object sender, EventArgs e)
    {
        Response.Redirect("http://www.meb.gov.tr");
    }

Hiç yorum yok:

Yorum Gönder