User Control:
A user control is a kind of composite control that works much like an ASP.NET Web page—you can add existing Web server controls and markup to a user control, and define properties and methods for the control. You can then embed them in ASP.NET Web pages, where they act as a unit.
Here in this example, you can see how to use date picker user control in web page.
For that, create a user control and add CSS and JS files whatever you required for date picker.
- <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DatePicker.ascx.cs" Inherits="CodeSamples.DatePicker" %>
- <link href="css/Jquery-ui.css" rel="stylesheet" />
- <script src="js/jquery-1.10.2.js"></script>
- <script src="js/jquery-ui.js"></script>
- Here take one textbox and bind date picker by using JavaScript.
-
- <script type="text/javascript">
- $(function () {
- $("#datepicker").datepicker();
- });
- </script>
- Date:
- <input type="text" id="datepicker">
Now user control is completed with date picker. Now you can this user control wherever you want in web pages with taking this user control as reference.
- <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Sample.aspx.cs" Inherits="CodeSamples.Sample" %><%@ Register Src="~/DatePicker.ascx" TagPrefix="uc1" TagName="DatePicker" %>
- <!DOCTYPE html>
- <html
- xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title></title>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <uc1:DatePicker runat="server" id="DatePicker" />
- </div>
- </form>
- </body>
- </html>
Then the output will be as follows:
Figure 1: Calendar
Like this you can easily work with user controls and your work also very simple.