ASCX(.ascx)

STEP 1: Create a VisualWebPart like PropellerStudioReadMore

STEP 2: Write a coding in PropellerStudioReadMoreUserControl.ascx


STEP 3:

<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PropellerStudioReadMoreUserControl.ascx.cs" Inherits="VCSB01.INTRANET.WebPartDetailsPage.PropellerStudioReadMore.PropellerStudioReadMoreUserControl" %>

     <%@ Register Assembly="AjaxControlToolkit, Version=3.0.30512.20315, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"
    Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

    <link href="/_layouts/Styles/VCSB/style.css" rel="stylesheet" type="text/css" />

<link href="/_layouts/Styles/VCSB/Blog.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
    function hidecontrolSubmit(subm) {
        $('#<%=btnPropellerSubmit.ClientID %>').hide();
        $('#<%= btnPropellerUpdate.ClientID %>').show();
    }
    function hidecontrolUpdate(upt) {
        $('#<%=btnPropellerSubmit.ClientID %>').show();
        $('#<%=btnPropellerUpdate.ClientID %>').hide();
    }

    </script>
<script type="text/javascript">

    function SelectAllCheckboxes(chk) {
       
        $('#<%=grdPropellerDetails.ClientID %>').find("input:checkbox").each(function () {
            if (this != chk) {
                this.checked = chk.checked;

            }
            if (this.checked == true) {

                $('#<%=imgbtnEdit.ClientID %>').attr('disabled', 'disabled');
                $('#<%=imgbtnAdd.ClientID %>').attr('disabled', 'disabled');

            }
            else {
                $('#<%=imgbtnEdit.ClientID %>').removeAttr('disabled');
                $('#<%=imgbtnAdd.ClientID %>').removeAttr('disabled');

            }
        });

    }
    function CheckboxCount(chkcount) {
     
        var gridView1Control = $('#<%=grdPropellerDetails.ClientID %>');
        //To uncheck the header checkbox when there are no selected checkboxes in itemtemplate
        var count = 0;
        $('input:checkbox[id$=chkSelect]:checked', gridView1Control).each(function (item, index) {
            count = count + 1;
        });
        if (count > 1) {
            $('#<%=imgbtnAdd.ClientID %>').attr('disabled', 'disabled');
            $('#<%=imgbtnEdit.ClientID %>').attr('disabled', 'disabled');
            $('#<%=imgbtnDelete.ClientID %>').removeAttr('disabled');
        }
        else if (count == 1) {
            $('#<%=imgbtnAdd.ClientID %>').attr('disabled', 'disabled');
            $('#<%=imgbtnEdit.ClientID %>').removeAttr('disabled');
            $('#<%=imgbtnDelete.ClientID %>').removeAttr('disabled');
        }
        else {
            $('#<%=imgbtnAdd.ClientID %>').removeAttr('disabled');
            $('#<%=imgbtnEdit.ClientID %>').removeAttr('disabled');
            $('#<%=imgbtnAdd.ClientID %>').removeAttr('disabled');
        }
    }

</script>



<style type="text/css">
.modalBackground
{   
    position: absolute;
            z-index: 100;
            top: 0px;
            left: 0px;
            background-color: #000;
            filter: alpha(opacity=60);
            -moz-opacity: 0.6;
            opacity: 0.6;
}


</style>
    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
</asp:ScriptManagerProxy>


    <!--content  outer part open-->
    <div class="main_box_content">
        <div class="main_box">
            <div class="main_box_left">
            </div>
            <div class="main_box_bg">
            </div>
            <div class="main_box_right">
            </div>
            <div class="clear">
            </div>
        </div>
        <div class="main_box_bg_mid">
            <!--content  outer part open-->
        </div>
   
    <div class="content_inner">
        <div class="first_part">
            <div class="info">
                <div class="infogry_left">
                </div>
                <div class="info_bg">
                    <h7>Propeller Studio</h7>
                </div>
                 <div dir="rtl" style="padding-top:7px"><asp:ImageButton ID="imgbtnDelete"
                         runat="server" Width="54" Height="21" hspace="4" ImageAlign="Right"
                         ImageUrl="/_layouts/Images/VCSB/btn_delete.jpg" onclick="imgbtnDelete_Click1" />                                
                    <asp:ImageButton ID="imgbtnEdit" runat="server" Width="41" Height="21" align=""
                         ImageAlign="Right" ImageUrl="/_layouts/Images/VCSB/btn_edit.jpg"
                         onclick="imgbtnEdit_Click1"/>
                    <asp:ImageButton ID="imgbtnAdd" runat="server" Width="41" Height="21" align=""
                         ImageAlign="Right" ImageUrl="/_layouts/Images/VCSB/btn_add.jpg" OnClientClick="javascript:hidecontrolUpdate();" />
                         </div>
                   <div class="clear">
                        </div>
            </div>
        </div>
   
<div class="bor_box">
<div class="bor_box_inner">
                       
                        <div class="box_inn_left"></div>

    <table width="100%">
                                 <tr>
                                     <td width="100%">
                                    
                                         <SharePoint:SPGridView ID="grdPropellerDetails"  Width="100%"  runat="server" BorderStyle="None"
                                         AutoGenerateColumns="False" GridLines="None" ShowHeader="true"  AllowSorting="true" OnSorting="grdPropellerDetails_Sorting">
                                             <Columns>
                                                 <asp:TemplateField>
                                                     <HeaderTemplate>
                                                         <asp:CheckBox ID="chkSelectAll" ToolTip="Select All" onclick="javascript:SelectAllCheckboxes(this);"
                                                             runat="server" />
                                                     </HeaderTemplate>
                                                     <HeaderStyle Height="30px" />
                                                     <ItemTemplate>
                                                         <asp:CheckBox ID="chkSelect" onclick="javascript:CheckboxCount(this);" runat="server" />
                                                         <asp:HiddenField ID="hdfPropeller" Value='<%# DataBinder.Eval(Container.DataItem, "ID") %>'
                                                             runat="server" />
                                                     </ItemTemplate>
                                                     <ItemStyle Width="7%" VerticalAlign="Top" HorizontalAlign="Center" />
                                                 </asp:TemplateField>
                                                 <asp:TemplateField  HeaderText="Propeller Title" SortExpression="Title">
                                                     <ItemTemplate>
                                                         <table width="100%">
                                                             <tr>
                                                                 <td width="100%">
                                                                     <asp:HyperLink ID="HypTitle" NavigateUrl='<%# Eval("FilePathUrl") %>' runat="server"><%# Eval("Title") %></asp:HyperLink>
                                                                 </td>
                                                             </tr>
                                                             <tr>
                                                                 <td width="100%">
                                                                     <%# Eval("Description")%>
                                                                 </td>
                                                             </tr>
                                                         </table>
                                                     </ItemTemplate>
                                                     <ItemStyle VerticalAlign="Top" Width="80%" />
                                                 </asp:TemplateField>
                                                 <asp:TemplateField  HeaderText="File Image" SortExpression="FileImage">
                                                     <ItemStyle />
                                                     <ItemTemplate>
                                                         <div class="box_inn_right">
                                                             <asp:HyperLink ID="HypFileImage" NavigateUrl='<%# Eval("FilePathUrl") %>' runat="server">
                                                                 <asp:Image ID="imgFileImage" ImageUrl='<%# Eval("FileImage")%>' Height="50px" Width="50px"
                                                                     runat="server" />
                                                             </asp:HyperLink>
                                                         </div>
                                                     </ItemTemplate>
                                                     <ItemStyle Width="13" HorizontalAlign="Right" VerticalAlign="Top" />
                                                 </asp:TemplateField>
                                             </Columns>
                                             </SharePoint:SPGridView>
                                        
                                        
                                     </td>
                                 </tr>
                             </table>
                              <div class="clear">
                        </div>
</div>
</div>
</div>
</div>
 <div class="main_box1">
                <div class="main_box_bot_left">
                </div>
                <div class="main_box_bot_bg">
                </div>
                <div class="main_box_bot_right">
                </div>
                <div class="clear">
                </div>
            </div>
       


<div id="propellerdiv" class="bg_pop_up" style="display:none">
    <table align="center" border="0" cellpadding="5" cellspacing="0" width="100%">
        <tr style="height:40px;">
            <td class="bg_pop_uphead" colspan="2">
                &nbsp;Propeller Studio</td>
            <td class="bg_pop_uphead">
                <asp:ImageButton ID="imgbtnPropellerclose" runat="server" Height="20px"
                    ImageUrl="/_layouts/images/VCSB/closebtn.png"  />
            </td>
        </tr>
        <tr>
            <td align="right" valign="top">
                Title</td>
            <td align="left" valign="top">

                <asp:TextBox ID="txtPropellerTitle" Width="280px" runat="server"></asp:TextBox></td>
        </tr>
        <tr>
            <td align="right" valign="top">
                Description</td>
            <td align="left" valign="top">
                <asp:TextBox ID="txtPropellerDescription" Width="280px" runat="server" TextMode="MultiLine"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td align="right" valign="top">
                Upload Documents</td>
            <td align="left" valign="top">
                <asp:FileUpload ID="flpPropeller" runat="server" />
            </td>
        </tr>
        <tr>
            <td align="right" valign="top">
                &nbsp;</td>
            <td align="left" valign="top">
                <asp:Button ID="btnPropellerSubmit" runat="server" CssClass="bg_pop_up_btn"
                    Text="Submit" onclick="btnPropellerSubmit_Click" />
                    <asp:Button ID="btnPropellerUpdate" runat="server" CssClass="bg_pop_up_btn"
                    Text="Update" onclick="btnPropellerUpdate_Click1"  />
                <asp:Button ID="btnPropellerClear" runat="server" CssClass="bg_pop_up_btn"
                    Text="Clear" />
            </td>
        </tr>
        <tr>
            <td align="right" valign="top">
                &nbsp;</td>
            <td align="left" valign="top">
                &nbsp;
            </td>
        </tr>
    </table>
</div>

<cc1:ModalPopupExtender ID="mpePropeller" TargetControlID="imgbtnAdd" BackgroundCssClass="modalBackground" PopupControlID="propellerdiv" CancelControlID="imgbtnPropellerClose" PopupDragHandleControlID="header" runat="server">
</cc1:ModalPopupExtender>
<cc1:ModalPopupExtender ID="mpePropellerEdit" TargetControlID="hdnPropellergridedit" BackgroundCssClass="modalBackground" PopupControlID="propellerdiv" CancelControlID="imgbtnPropellerClose" PopupDragHandleControlID="header" runat="server">
</cc1:ModalPopupExtender>

<asp:HiddenField ID="hdnPropellergridedit" runat="server" />