مشاوره رایگان
دریافت لینک های دانلود دریافت پستی درب منزل مبلغ کل: تومان
جهت دریافت کد تخفیف به کانال تلگرام مراجعه و یا با پشتیبان آنلاین هماهنگ نمایید

بررسی نحوه ایجاد کنترل های سفارشی در ASP.NET به همراه مثال


کنترل های سفارشی

ASP.NET به کاربران این امکان را می دهد که کنترل هایی را ایجاد نمایند. کنترل های تعریف شده توسط کاربر به دو دسته طبقه بندی می شوند:

  • کنترل های کاربر (user controls)
  • کنترل های سفارشی (custom controls)

کنترل های کاربر

کنترل های کاربر مانند صفحات مینیاتوری ASP.NET یا فرم های وب رفتار می کنند که می توانند توسط بسیاری از صفحات دیگر مورد استفاده قرار گیرند. این کنترل ها از کلاس System.Web.UI.UserControl مشتق می شوند و دارای ویژگی های زیر هستند:

  • آنها پسوند .ascx دارند.
  • آنها ممکن است دارای هیچ تگ <html> ، <body> یا <form> نباشند.
  • آنها به جای دایرکتیو Page ، دایرکتیو Control دارند.

برای درک بهتر این مفهوم ، بیایید یک کنترل کاربر ساده را ایجاد کنیم که به صورت footer برای صفحات وب عمل می کند. برای ایجاد و استفاده از کنترل کاربر ، باید مراحل زیر را دنبال کنید:

  • ایجاد یک web application جدید.
  • کلیک راست کردن در پوشه پروژه در بخش Solution Explorer و انتخاب گزینه Add New Item .

  • انتخاب کردن Web User Control از کادر محاوره ای  Add New Item و نام گذاری آن با نام footer.ascx . در شروع ، footer.ascx فقط حاوی یک دایرکتیو کنترل می باشد.
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="footer.ascx.cs" 
   Inherits="customcontroldemo.footer" %>
  • افزودن کد زیر به فایل:
<table>
   <tr>
      <td align="center"> Copyright ©2010 TutorialPoints Ltd.</td>
   </tr>

   <tr>
      <td align="center"> Location: Hyderabad, A.P </td>
   </tr>
</table>
  • برای افزودن کنترل کاربر به صفحه وب خود ، باید دایرکتیو Register و یک نمونه از کنترل کاربر را به صفحه افزود. کد زیر محتوای فایل content را نشان می دهد:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="customcontroldemo._Default" %>
   
<%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

   <head runat="server">
      <title>
         Untitled Page
      </title>
   </head>
   
   <body>
   
      <form id="form1" runat="server">
         <div>
         
            <asp:Label ID="Label1" runat="server" Text="Welcome to ASP.Net Tutorials "></asp:Label>
            <br />  <br />
            <asp:Button ID="Button1" runat="server" onclick="Button1_Click"  Text="Copyright Info" />
            
         </div>
         <Tfooter:footer ID="footer1" runat="server" />
      </form>
      
   </body>
</html>

هنگامی که برنامه اجرا می شود ، صفحه یک footer را نشان می دهد و این کنترل می تواند در تمامی صفحات وب سایت مورد استفاده قرار گیرد.

موارد ذیل را دنبال نمایید:

  1. دایرکتیو Register یک تگ name و هم چنین تگ prefix برای کنترل مشخص می کند.
<%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %>
  1. تگ name و Prefix زیر باید در حین افزودن کنترل کاربر به صفحه استفاده شود:
<Tfooter:footer ID="footer1" runat="server" />

کنترل های سفارشی

کنترل های سفارشی به عنوان مجموعه های جداگانه ای اعمال می شوند. آنها به داخل یک کتابخانه پیوند پویا (Dynamic Link Library (DLL)) کامپایل شده و به عنوان کنترل های سرور ASP.NET دیگری مورد استفاده قرار می گیرند. آنها می توانند به روش های زیر ایجاد شوند:

  • از طریق مشتق شدن کنترل سفارشی از یک کنترل موجود.
  • از طریق ساختن یک کنترل سفارشی جدید با ترکیب کردن دو یا چند کنترل موجود.
  • از طریق مشتق شدن از کلاس کنترل base .

برای درک این مفهوم ، بیایید یک کنترل سفارش بسازیم ، که به سادگی یک پیام متنی را در مرورگر رندر خواهد کرد. برای ایجاد این کنترل ، مراحل زیر را دنبال نمایید:

  • ایجاد یک وب سایت. در بخش solution (نه در project) در بالای درخت Solution Explorer کلیک راست کنید.

  • در کارد محاوره ای ، گزینه ASP.NET Server Control را از تمپلت های پروژه انتخاب کنید.

مراحل فوق یک پروژه جدید را اضافه نموده و یک تمپلت کنترل سفارشی برای solution به نام ServerControl1 ایجاد می کند. در این مثال ، نام پروژه CustomControls را قرار می دهیم. برای استفاده از این کنترل ، کنترل باید به عنوان یک مرجع (reference) به وب سایت ، قبل از رجیستر کردن آن در صفحه ، اضافه شود. برای افزودن یک مرجع به پروژه موجود ، بر روی  project (نه در solution) کلیک راست کرده و روی گزینه Add Reference کلیک می کنیم.

پروژه CustomControls را از بخش Projects از کادر محاوره ای Add Reference  انتخاب می کنیم. بخش Solution Explorer باید reference را نشان دهد.

برای استفاده از این کنترل در یک صفحه ، دایرکتیو Register را درست زیر دایرکتیو @Page اضافه می کنیم:

<%@ Register Assembly="CustomControls"  Namespace="CustomControls"  TagPrefix="ccs" %>

هم چنین، ما می توانیم از این کنترل مانند هر کنترل دیگر استفاده نماییم.

<form id="form1" runat="server">
   <div>
      <ccs:ServerControl1 runat="server" Text = "I am a Custom Server Control" />
   </div> 
</form>

در هنگام اجرا ، خصیصه Text از کنترل ، مطابق تصویر زیر در مرورگر رندر می شود:

کار با کنترل های سفارشی

در مثال های قبلی ، ما مقداری را برای خصیصه Text کنترل سفارشی تنظیم می کردیم. ASP.NET ، این خصیصه را به طور پیش فرض در هنگام ایجاد کنترل اضافه می کرد. کد زیر در پشت فایل کنترل ؛ این موضوع را روشن می سازد:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;

using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomControls
{
   [DefaultProperty("Text")]
   [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1 >")]
   
   public class ServerControl1 : WebControl
   {
      [Bindable(true)]
      [Category("Appearance")]
      [DefaultValue("")]
      [Localizable(true)]
      
      public string Text
      {
         get
         {
            String s = (String)ViewState["Text"];
            return ((s == null) ? "[" + this.ID + "]" : s);
         }
         
         set
         {
            ViewState["Text"] = value;
         }
      }
      
      protected override void RenderContents(HtmlTextWriter output)
      {
         output.Write(Text);
      }
   }
}

کد فوق به صورت خودکار برای یک کنترل سفارشی ایجاد شده است. رویدادها و متدها می توانند به کلاس کنترل سفارشی اضافه شوند.

مثال

بیایید کنترل سفارشی قبل را که با نام SeverControl1 ایجاد کرده ایم ، توسعه دهیم. برای انجام این کار ، بیایید یک متد با نام checkpalindrome به آن اختصاص دهیم ، که به کنترل قدرت بررسی کردن برای palindromes را می دهد.

Palindromes کلمات/واژه هایی هستند که در حالت معکوس نیز به همان حالت اول تلفظ می شوند ، مانند: Malayalam ، madam ، saras و غیره.

کد توسعه یافته برای کنترل سفارشی به صورت زیر می باشد:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;

using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomControls
{
   [DefaultProperty("Text")]
   [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1  >")]
   
   public class ServerControl1 : WebControl
   {
      [Bindable(true)]
      [Category("Appearance")]
      [DefaultValue("")]
      [Localizable(true)]
      
      public string Text
      {
         get
         {
            String s = (String)ViewState["Text"];
            return ((s == null) ? "[" + this.ID + "]" : s);
         }
         
         set
         {
            ViewState["Text"] = value;
         }
      }
      
      protected override void RenderContents(HtmlTextWriter output)
      {
         if (this.checkpanlindrome())
         {
            output.Write("This is a palindrome: <br />");
            output.Write("<FONT size=5 color=Blue>");
            output.Write("<B>");
            output.Write(Text);
            output.Write("</B>");
            output.Write("</FONT>");
         }
         else
         {
            output.Write("This is not a palindrome: <br />");
            output.Write("<FONT size=5 color=red>");
            output.Write("<B>");
            output.Write(Text);
            output.Write("</B>");
            output.Write("</FONT>");
         }
      }
      
      protected bool checkpanlindrome()
      {
         if (this.Text != null)
         {
            String str = this.Text;
            String strtoupper = Text.ToUpper();
            char[] rev = strtoupper.ToCharArray();
            Array.Reverse(rev);
            String strrev = new String(rev);
            
            if (strtoupper == strrev)
            {
               return true;
            }
            else
            {
               return false;
            }
         }
         else
         {
            return false;
         }
      }
   }
}

هنگامی که کد را برای کنترل تغییر می دهیم ، ما باید solution را از طریق کلیک کردن بر روی گزینه Build > Build Solution بسازیم ، به طوری که تغییرات بتوانند در پروژه ما منعکس شوند. یک text box و یک کنترل button به صفحه اضافه می کنیم ، تا کاربر بتواند یک متن را وارد نماید. هنگامی که بر روی این کلید کلیک می شود ، متن وارد شده برای وجود palindrome مورد بررسی قرار می گیرد.

<form id="form1" runat="server">
   <div>
      Enter a word:
      <br />
      <asp:TextBox ID="TextBox1" runat="server" style="width:198px"> </asp:TextBox>
      
      <br /> <br />
      
      <asp:Button ID="Button1" runat="server onclick="Button1_Click" Text="Check Palindrome" style="width:132px" />
      
      <br /> <br />
      
      <ccs:ServerControl1 ID="ServerControl11" runat="server" Text = "" />
   </div>
</form>

هندلر رویداد Click برای کلید ، به سادگی متن را از text box به خصیصه text کنترل سفارشی کپی می کند.

protected void Button1_Click(object sender, EventArgs e)
{
   this.ServerControl11.Text = this.TextBox1.Text;
}

در هنگام اجرا ، کنترل با موفقیت وجود palindrome ها در متن را بررسی می کند.

موارد زیر را دنبال نمایید:

  1. هنگامی که یک reference به کنترل سفارشی اضافه می کنیم ، این مرجع به toolbox اضافه شده و ما می توانیم به طور مستقیم آن را از toolbox مشابه سایر کنترل ها استفاده نماییم.

  1. در اینجا متد RenderContents   از کلاس کنترل سفارشی لغو می شود ، به طوری که ما می توانیم متدها و رویدادهای خود را اضافه نماییم.
  2. متد RenderContents    ، یک پارامتر از نوع HtmlTextWriter  را دریافت می کند ، که مسئول رندر کردن در مرورگر می باشد.

 

 

فصلِ: 5 , تعداد قسمت ها: 176 , سطح: صفر تا صد

این فصل در یک نگاه:

در این فصل پس از بررسی سیستم مسیریابی و طراحی صفحه نمایش ویدیو ها، به سراغ پنل کاربری خواهیم رفت و مباحث Model Binding و…

توجه: این دوره آموزشی به صورت پیوسته بر اساس آخرین نسخه ی ASP.NET Core بروزرسانی خواهد شد.   آموزش صفر تا صد طراحی سایت اشتراک ویدیو مشابه آپارات با استفاده از  ASP.NET CORE  MVC 3.0 و V…
فصلِ: 8 , تعداد قسمت ها: 357 , سطح: صفر تا صد

این فصل در یک نگاه:

توضیحات کلی مجموعه: در این مجموعه قصد داریم تا فروشگاه اینترنتی دیجی کالا رو با Asp.Net Core3 پیاده سازی کنیم. ابتدا طراحی قالب دیجی کالا رو به صورت کامل انجام خواهیم داد. در مرحله میریم …
فصلِ: 5 , تعداد قسمت ها: 135 , سطح: صفر تا صد

این فصل در یک نگاه:

توضیحات کلی مجموعه: در این مجموعه آموزشی، با استفاده از جدیدترین تکنولوژی ها و ابزار های مایکروسافت (دات نت)، به یک پروژه جذاب مدیریت آگهی مشابه دیوار می پردازیم. این آموزش در دو بخش کلی و…
فصلِ: 7 , تعداد قسمت ها: 153 , سطح: صفر تا صد
موضوعات: آموزش ASP.NET

این فصل در یک نگاه:

در این دوره به آموزش صفر تا صد جدیدترین نسخه ASP یعنی CORE جدیدترین ورژن خواهیم پرداخت.این آموزش از سطح مقدماتی تا فوق …

دوره آموزش کامل طراحی وب به همراه پروژه ساخت سیستم مدیریت کتابخانه  این دوره  با کور 1 آغاز می شود و در ادامه پروژه به کور 2 تبدیل می شودو پروژه نهایی (سیستم مدیریت کتابخانه) با Asp.net کور…
فصلِ: 1 , تعداد قسمت ها: 5 , سطح: متوسط

این فصل در یک نگاه:

ساخت محیط کاربریآموزش نحوه ی ارسال ایمیل در Asp.net MVCآموزش تنظیمات Gmail برای استفادهاستفاده از Yahooاستفاده از سرویس …

به نام خدا... در خدمتتون هستم با آموزش ارسال ایمیل در Asp.net MVC... ارسال ایمیل یکی از اجزای اصلی ییک سایت به شمار می رود و واقعا سایتی که برای اجزای مختلفش همانند ثبت کاربر جدید و یا ارسال…
فصلِ: 2 , تعداد قسمت ها: 62 , سطح: صفر تا صد

این فصل در یک نگاه:

فصل دوم در یک نگاه:فصل دوم در یک نگاه:…

در این پکیج به مبحث طراحی وب ، در قالب ساخت یک سایت فروشگاهی 5040 به آدرس http://5040.ir می پردازیم که به جرات مشهورترین و یکی از برترین فروشگاه های مجازی در کشور است. در این مجموعه قصد داری…
فصلِ: 4 , تعداد قسمت ها: 78 , سطح: متوسط

این فصل در یک نگاه:

در این دوره آموزشی، وبسایت ورزش3 را با استفاده از ASP.NET Core پیاده سازی می کنیم و همچنین اپ اندروید آن را هم با Xamarin متصل به سرور سایت طراحی و در نهایت نحوه انتشار آن در مارکت هایی مثل …
فصلِ: 1 , تعداد قسمت ها: 14 , سطح: متوسط

این فصل در یک نگاه:

کاملترین آموزش هاست و کار با سی پنل.در هنگام خرید سرویس هاست کلمه ای به نام “کنترل پنل” را زیاد خواهید دید آیا تا به حال…

سی پنل یک کنترل پنل هاست محبوب و معروف در جهان و ایران است. در فیلم آموزش سی پنل هم توصیه اکید شده تا افراد مبتدی و حتی افراد حرفه ای از این کنترل پنل هاست سی پنل استفاده کنند. آموزش cpanel …
فصلِ: 5 , تعداد قسمت ها: 25 , سطح: صفر تا صد

این فصل در یک نگاه:

فصل پنجم…

توضیحات کلی مجموعه: درباره گیت: لذت پیش بردن پروژه های برنامه نویسی خود را با بهترین ورژن کنترل سیستم جهان تجربه کنید کامل ترین دوره ی آموزشی گیت و گیت هاب به همراه مثال های کاربردی گی…
فصلِ: 1 , تعداد قسمت ها: 15 , سطح: متوسط

این فصل در یک نگاه:

رشد و درآمدزایی یک وب سایت یا کسب و کار اینترنتی کاملا به ذوق و مهارت وب مستر یا همان مدیر اصلی وب سایت گره خورده و متاس…

 اصول مدیریت وب سایت برای وب مستر شدن برای موفقیت یک وب سایت لازم الاجراست. زیرا شما دوست دارید وب سایت خود را به کارخانه پولسازی تبدیل کنید. این واقعیت رویا نیست. هرکس این اصول را بداند به …

تولید شده توسط کلیک سایت

پشتیبانی آنلاین
آماده پاسخگویی هستیم
انتخاب تصویر جهت ارسال:
در حال ضبط صدا

(جهت توقف و یا لغو ضبط از دکمه های زیر استفاده کنید)

توقف و ارسال :
لغو ضبط
در حال حاضر تمامی کارشناسان آفلاین هستند. همواره می توانید با شماره تلگرام / واتساپ 09010005000 به صورت آنلاین با ما در ارتباط باشید. جهت ورود به واتساپ کلیک کنید
0 پیام جدید
پشتیبان در حال تایپ ...
ارسال تصویر ضبط صدا
0 کارشناسان آنلاین می باشند
این گفت و گو توسط پشتیبان به اتمام رسید