ASCX(.ascx)

STEP 1: Create a VisualWebPart like NewsAndArticlesReadMore

STEP 2: Write a coding in NewsAndArticlesReadMoreUserControl.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="NewsAndArticlesReadMoreUserControl.ascx.cs" Inherits="VCSB01.INTRANET.WebPartDetailsPage.NewsAndArticlesReadMore.NewsAndArticlesReadMoreUserControl" %>
 <%@ 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) {
            $('#<%=btnSubmit.ClientID %>').hide();
            $('#<%=btnUpdate.ClientID %>').show();
        }
        function hidecontrolUpdate(upt) {
            $('#<%=btnSubmit.ClientID %>').show();
            $('#<%=btnUpdate.ClientID %>').hide();
        }

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

    function SelectAllCheckboxes(chk) {
      
        $('#<%=grdNewsAndArticleAll.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 = $('#<%=grdNewsAndArticleAll.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 {
            $('#<%=imgbtnEdit.ClientID %>').attr('disabled', 'disabled');
            $('#<%=imgbtnDelete.ClientID %>').attr('disabled', '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">

    <div class="content_inner" >

    <div class="first_part">
                        <div class="info">
                            <div class="infogry_left"></div>
                          <div class="info_bg"><h7>News And Articles</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_Click" />                                
                    <asp:ImageButton ID="imgbtnEdit" runat="server" Width="41" Height="21" align=""
                                    ImageAlign="Right" ImageUrl="/_layouts/Images/VCSB/btn_edit.jpg" onclick="imgbtnEdit_Click" />
                    <asp:ImageButton ID="imgbtnAdd" runat="server" Width="41" Height="21" align=""
                                    ImageAlign="Right" OnClientClick="javascript:hidecontrolUpdate();"
                                    ImageUrl="/_layouts/Images/VCSB/btn_add.jpg" /></div>
                        </div>
                       
                        <div class="clear">
                        </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="grdNewsAndArticleAll" Width="100%" runat="server" BorderStyle="None"
                                             AutoGenerateColumns="False" GridLines="None" ShowHeader="true" AllowSorting="true" OnSorting="grdNewsAndArticleAllDetails_Sorting">
                                             <Columns>
                                                 <asp:TemplateField>
                                                     <HeaderTemplate>
                                                         <asp:CheckBox ID="chkSelectAll" runat="server" ToolTip="Select All" onclick="javascript:SelectAllCheckboxes(this);" />
                                                     </HeaderTemplate>
                                                     <HeaderStyle Height="30px" />
                                                     <ItemTemplate>
                                                         <asp:CheckBox ID="chkSelect" Text="" onclick="javascript:CheckboxCount(this);" runat="server" />
                                                         <asp:HiddenField ID="hdnNewsAndArticle" Value='<%#DataBinder.Eval(Container.DataItem, "ID") %>' runat="server" />
                                                     </ItemTemplate>
                                                     <ItemStyle Width="7%" VerticalAlign="Top" HorizontalAlign="Center" />
                                                 </asp:TemplateField>
                                                 <asp:TemplateField  HeaderText="News And Articles Title" SortExpression="NewsTitle">
                                                     <ItemStyle />
                                                     <ItemTemplate>
                                                         <table width="100%">
                                                             <tr>
                                                                 <td width="100%">
                                                                     <%# Eval("NewsTitle")%>
                                                                     -
                                                                     <%# Eval("NewsDate") %>
                                                                 </td>
                                                             </tr>
                                                             <tr>
                                                                 <td width="100%">
                                                                     <div class="box_inn_mid2">
                                                                         <%# Eval("NewsDescription")%>
                                                                     </div>
                                                                 </td>
                                                             </tr>
                                                         </table>
                                                     </ItemTemplate>
                                                     <ItemStyle VerticalAlign="Top" />
                                                 </asp:TemplateField>
                                                 <asp:TemplateField HeaderText="News And Articles Image" SortExpression="NewsImage">
                                                     <ItemStyle />
                                                     <ItemTemplate>
                                                         <div class="box_inn_right2">
                                                             <asp:Image ID="imgNewsImage" ImageUrl='<%# Eval("NewsImage") %>' Height="150px" runat="server" />
                                                         </div>
                                                     </ItemTemplate>
                                                 </asp:TemplateField>
                                             </Columns>
                                         </SharePoint:SPGridView>
                                          
                                         &nbsp;
                                     </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>
 

          
<div id="newsdiv" class="bg_pop_up" style="display:none;" >
 <table width="100%" align="center" border="0" cellspacing="0" cellpadding="5" >
  <tr style="height:40px;">
    <td colspan="2" class="bg_pop_uphead">&nbsp;News And Articles</td>
    <td class="bg_pop_uphead">
        <asp:ImageButton ID="imgbtnClose" ImageUrl="/_layouts/images/VCSB/closebtn.png" Height="20px" runat="server"/> </td>
    </tr> 
  <tr>
    <td align="right" valign="top">Title</td>
    <td align="left" valign="top">
        <asp:TextBox ID="txtTitle" runat="server" Width="280px" ></asp:TextBox>
        </td>
  </tr>
  <tr>
    <td align="right" valign="top">Description</td>
    <td align="left" valign="top">
     <asp:TextBox ID="txtDescription" runat="server"  Columns="35" Rows="5"
            TextMode="MultiLine"></asp:TextBox>
  </td>

  </tr>
  <tr>
    <td align="right" valign="top">NewsAndArticleDate</td>
    <td align="left" valign="top">
     <asp:TextBox ID="txtArticleDate" runat="server" Width="130px"></asp:TextBox>
        <cc1:CalendarExtender ID="calexArticalDate" TargetControlID="txtArticleDate" runat="server">
        </cc1:CalendarExtender>

   </td>

  </tr>
  <tr>
    <td align="right" valign="top">Upload Image</td>
    <td align="left" valign="top">
        <asp:FileUpload ID="fldNewsImage"  runat="server" />   
    </td>
  </tr>
  <tr>
    <td align="right" valign="top">&nbsp;</td>
    <td align="left" valign="top">
        <asp:Button ID="btnSubmit" runat="server" CssClass="bg_pop_up_btn"
            Text="Submit" onclick="btnSubmit_Click" />
            <asp:Button ID="btnUpdate" runat="server" CssClass="bg_pop_up_btn"
            Text="Update" onclick="btnUpdate_Click" />
        <asp:Button ID="imgbtnClear" 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="mpupNewsAndArticlesAdd" TargetControlID="imgbtnAdd" BackgroundCssClass="modalBackground" PopupControlID="newsdiv" CancelControlID="imgbtnClose" PopupDragHandleControlID="header" runat="server">
</cc1:ModalPopupExtender>

<cc1:ModalPopupExtender ID="mpupNewsAndArticlesEdit" TargetControlID="hdnpopup" BackgroundCssClass="modalBackground" PopupControlID="newsdiv" CancelControlID="imgbtnClose" PopupDragHandleControlID="header"  runat="server">
</cc1:ModalPopupExtender>

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