آموزش ASP.Net - کنترل HyperLink ایجاد لینک بین صفحات
چهارشنبه 24 خرداد 1391 9:26 AM
مقدمه و معرفی کنترل HyperLink :
از کنترل HyperLink برای ایجاد لینک به یک صفحه ، فایل و یا وبسایت دیگر استفاده می شود .
این کنترل کار تگ < a > در HTML را انجام داده و در هنگام اجرای صفحات ASP.Net توسط سرور ، خروجی آن در سورس کد صفحه به صورت تگ < a > خواهد بود .
این کنترل می تواند لینک را به صورت متن یا یک تصویر نمایش دهد . برای نمایش لینک به صورت متن ، باید متن مورد نظر خود برای عنوان لینک را در خاصیت Text کنترل تعیین نمایید . همچنین اگر می خواهید لینک به صورت تصویر باشد ، بایستی آدرس عکس مورد نظر را در خاصیت ImageUrl کنترل تعریف نمایید .
شکل کلی تعریف و نمایش دکمه فرمان HyperLink در صفحه های ASP.Net به صورت زیر است :
Syntax | < asp:HyperLink ID="عنصر id" runat="server" Text="عنوان لینک" NavigateUrl="آدرس صفحه یا فایل مقصد" /> مثال : < asp:HyperLink ID="HyperLink1" runat="server" Text="صفحه نخست" NavigateUrl="http://www.Developer1.ir/default.aspx" /> خروجی : صفحه نخست |
کنترل HyperLink را به صورت زیر هم می توان تعریف کرد :
Syntax | < asp:HyperLink ID="عنصر id" runat="server" Text="عنوان لینک" NavigateUrl="آدرس صفحه یا فایل مقصد" > < / asp:HyperLink > مثال : < asp:HyperLink ID="HyperLink2" runat="server" Text="صفحه نخست" NavigateUrl="http://www.Developer1.ir/default.aspx" > < / asp:HyperLink > |
مزایا و دلایل استفاده از کنترل HyperLink به جای تگ < a > در صفحات ASP.Net :
گفتیم که تگ < a > در HTML و کنترل HyperLink در ASP.Net دقیقا یک کار را انجام می دهند و شما می توانید از تگ < a > برای ایجاد لینک در صفحات ASP.Net خود استفاده نمایید . اما در چه جاهایی لازم است تا از کنترل HyperLink برای ایجاد لینک استفاده نماییم :
مثال های عملی :
در مثال های عملی زیر قصد داریم تا روش استفاده از کنترل HyperLink را در عمل به شما نمایش دهیم . در مثال دوم نیز روش برنامه نویسی و طراحی یک کد ساده برای دینامیک کردن کنترل را بررسی نموده ایم :
مثال 1 : در این مثال ، یک کنترل ساده HyperLink را طراحی کرده ایم ، که به یک صفحه لینک داده است :
Example | |
< asp:HyperLink ID="HyperLink2" runat="server" Text = " صفحه نخست " NavigateUrl = "http://www.Developer1.ir/default.aspx" /> | کد |
صفحه نخست | خروجی |
مثال 2 : استفاده از عکس به عنوان لینک در کنترل HyperLink : در این مثال یک عکس را به عنوان لینک در کنترل HyperLink قرار داده ایم . برای این منظور ، آدرس عکس مورد نظر را در خاصیت ImageUrl کنترل تعریف کرده ایم :
Example | |
< asp:HyperLink ID="HyperLinkHome" runat="server" ImageUrl = " ~/Pic/web.png " NavigateUrl = "http://www.Developer1.ir/default.aspx" /> | کد |
خروجی |
مثال 3 : در مثال زیر یک کد اکتیو برای لینک خود طراحی کرده ایم . عملکرد این کد به این صورت است که در یک کادر کرکره ایی چند عنوان آموزشی قرار دارد . شما اگر هر یک از این عنوان را انتخاب نمایید ،کنترل HyperLink به صورت خودکار یک لینک تولید می کند ، که عنوان آن متناسب با گزینه انتخابی بوده و در صورت کلیک بر روی لینک شما را به صفحه مرتبط با آن ارسال می کند . برای مشاهده عملکرد کد مثال ، گزینه مورد نظرتان را از کادر کرکرده ایی ، انتخاب نمایید ::
Example | |
< p class="matn" > چه مطلبی را می خواهید مطالعه نمایید : < /p > < asp:DropDownList runat="server" ID="Drp1" OnTextChanged="Drp1_SelectedIndexChanged" AutoPostBack="true" > < asp:ListItem Text="ASP.Net" Value="../AccessDataSource/OverView.aspx" > < /asp:ListItem > < asp:ListItem Text="HTML" Value="../../HTML/Main.aspx" > < /asp:ListItem > < asp:ListItem Text="CSS" Value="../../CSS/Introduce.aspx" > < /asp:ListItem > < asp:ListItem Text="SQL" Value="../../SQL/Introduce.aspx" > < /asp:ListItem > < /asp:DropDownList > < asp:HyperLink ID="HyperLink3" runat="server" Text="" Enabled="false" ID="H1" > < /asp:HyperLink > |
کد |
چه مطلبی را می خواهید مطالعه نمایید : |
خروجی |
کد برنامه در فایل کد صفحه ASP.Net :
کد زیر نیز در درون فایل کد صفحه ASP.Net مورد نظر برای تابع Drp1_SelectedIndexChanged قرار داده شده است . در هر بار تغییر آیتم در منوی کرکره ایی ، این تابع فراخوانی و اجرا می شود :
کد برنامه | protected void Drp1_SelectedIndexChanged(object sender, EventArgs e) { H1.Text = "مطالعه بخش : " + Drp1.SelectedItem.Text; H1.NavigateUrl = Drp1.SelectedItem.Value; H1.Enabled = true; } |
کریمی که جهان پاینده دارد تواند حجتی را زنده دارد
دانلود پروژه و کارآموزی و کارافرینی