Thursday, 1 May 2014

Ajax Popup extender

No comments
 .CSS

 .pop
        {
            background-color: #666699;
            filter: alpha(opacity=50);
            opacity: 0.7;
        }
        .popcontainer
        {
        background-color:Blue;
        border:2px solid #000000;
        padding: 0px 0px 0px 0px;
        width:800px;
       
        }
        .poptitle
        {
            background: url(../images/titlebar.jpg);
            height: 29px;
            }
           
            .titleleft
        {
            float:left;
            padding-left:5px;
            padding-top:5px;
            font-family:Arial, Helvetica, sans-serif;
            font-weight:bold;
            font-size:12px;
            color:#FFFFFF;
        }
            .titleright
        {
            background:url(../images/cross.png);
            background-position:right;
            background-repeat:no-repeat;
            height:15px;
            width:16px;
            float:right;
            cursor:pointer;
            margin-right:5px;
            margin-top:5px;
           
        }
        .popbody
        {
            padding:15px 15px 15px 15px;
            font-family:Arial;
            font-weight:bold;
            font-size:12px;
            color:#000000;
            line-height:15pt;
            clear:both;
            padding:20px;
        }
        .popbutton
        {
            margin:10px;
        }




Detailsview in Popup

.ASPX

<asp:Panel ID="pnlpop" runat="server" style="display:none">   
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <Triggers>
    <asp:AsyncPostBackTrigger ControlID="detailsviewstu" />
    </Triggers>
    <ContentTemplate>
         <div class="popcontainer">
                    <div class="poptitle">
                         <div class="titleleft">Student Details</div>
                              <div class="titleright" onclick="get('btnclose').click()">
                              </div>
                                </div>
                                    <div class="popbody" style="color: #FFFFFF">
                                        <asp:DetailsView ID="detailseditstu" runat="server" Height="50px" Width="90%"
                                            AutoGenerateRows="False" DataKeyNames="Stu_id" CellPadding="8"
                                            CellSpacing="8" ondatabound="detailseditstu_DataBound">
                       <Fields>
                          
                        
                           <asp:TemplateField HeaderText="City">
                               <EditItemTemplate>
                                   <asp:DropDownList ID="dropcity" runat="server" AutoPostBack="True"
                                       DataTextField="City_name" DataValueField="City_id" Width="200px">
                                   </asp:DropDownList>
                               </EditItemTemplate>
                               <InsertItemTemplate>
                                   <asp:TextBox ID="TextBox5" runat="server" Text='<%# Bind("City") %>'></asp:TextBox>
                               </InsertItemTemplate>
                               <ItemTemplate>
                                   <asp:Label ID="Label5" runat="server" Text='<%# Bind("City") %>'></asp:Label>
                               </ItemTemplate>
                               <HeaderStyle CssClass="stat" />
                               <ItemStyle CssClass="stat1" />
                           </asp:TemplateField>
                                                    
                       </Fields>
                                        </asp:DetailsView>
                                     </div>
                                 <div class="popbutton">
                              <asp:Button ID="btnok" runat="server" Text="ok" />
                            <asp:Button ID="btnclose" runat="server" Text="close" onclick="btnclose_Click"/>
                         </div>
                      </div>
   
    </ContentTemplate>
    </asp:UpdatePanel>
    </asp:Panel>
    <asp:Button ID="btnshow" runat="server" Text="Button" style="display:none"/>
    <asp:ModalPopupExtender ID="mdlpop" runat="server" TargetControlID="btnshow" PopupControlID="pnlpop" OkControlID="btnok"
    CancelControlID="btnclose" BackgroundCssClass="pop">
    </asp:ModalPopupExtender>
               

            </div>
            <div class="content_box_bottom">
            </div>
           
        </div>



.CS

protected void btnedits_Click(object sender, EventArgs e)
    {
        detailseditstu.ChangeMode(DetailsViewMode.Edit);
        binddetailspop();
        mdlpop.Show();
        bind_country();
    }
    protected void btnclose_Click(object sender, EventArgs e)
    {
        mdlpop.Hide();
        binddetails();
    }


Images :- http://www.mediafire.com/download/u7f7j1b629ius9e/img.rar