PDA

View Full Version : سوال: نحوه تغییر id تگ های Html.



hdv212
پنج شنبه 28 شهریور 1387, 13:02 عصر
سلام و خسته نباشید
من از کد زیر برای ساخت منو در MasterPage استفاده کردم (در نظر داشته باشید که برای Style هم از Css استفاده کردم) :

<div id="menu">
<ul>
<li><a href="contactUs.aspx">تماس با ما</a></li>
<li><a href="aboutUs.aspx">درباره ی ما</a></li>
<li><a href="news.aspx">اخبار و مقالات</a></li>
<li><a href="services.aspx">محصولات و خدمات</a></li>
<li id="current"><a href="Default.aspx">خانه</a></li> // Change id="current" to another <a> tag
</ul>
</div>
اینم Element هایی که در Css براش در نظر گرفته شده :

#menu ul {
float: right;
list-style: none;
margin:0; padding: 0;
}
#menu ul li {
display: inline;
}
#menu ul li a {
display: block;
float: left;
padding: 0 8px;
color: #FFF;
text-decoration: none;
}
#menu ul li a:hover {
background-color: #ECECEC;
color: #333;
}
#menu ul li#current a {
background-color: #FFF;
color: #333;
}

همانطور که میبینید عنصر Current در Css مورد نظر توسط زیر منوی Default.aspx به id اون اختصاص داده شده که نشون میده کدم صفحه در حال نمایش هست، سوالات :

اولا من میخوام هر صفحه ای که روش کلیک میشه "id="current برای اون صفحه در نظر گرفته بشه.

ثانیا اینکه من اینا رو توی MasterPage قرار دادم، در صفحاتی که MasterPage رو به ارث میبرن، چطوری این خاصیت رو برای اونا تنظیم کنم ؟ آیا تنظیم خاصیت تغییر "id="current برای لینکی که کلیک شده، در فایل MasterPage کافیه ؟
مرسی

Behrouz_Rad
پنج شنبه 28 شهریور 1387, 14:56 عصر
به تمامی تگ های a صفت "runat="server رو بده.
کافیه در Page_Load صفحه ی Master، نام صفحه ی جاری رو به دست بیاری و متناسب با اون به لینک فرمت بدی. از تابعی به شکل ذیل می تونی برای به دست آوردن نام صفحه استفاده کنی:


public string GetCurrentPageName()
{
string sPath = System.Web.HttpContext.Current.Request.Url.Absolut ePath;
System.IO.FileInfo oInfo = new System.IO.FileInfo(sPath);
string sRet = oInfo.Name;
return sRet;
}

موفق باشید.

hdv212
پنج شنبه 28 شهریور 1387, 15:16 عصر
ه تمامی تگ های a صفت "runat="server رو بده.
کافیه در Page_Load صفحه ی Master، نام صفحه ی جاری رو به دست بیاری و متناسب با اون به لینک فرمت بدی. از تابعی به شکل ذیل می تونی برای به دست آوردن نام صفحه استفاده کنی
بهروز جان ممنونم، اما اگه دقت کنی، در تگ li خاصیت id اون تنظیم شده، به نظرت نباید "runat="server رو در تگ li قرار بدم ؟
ثانیا میشه یه مثال عملی بزنی که من چه خاصیتی رو باید در رویداد load مربوط به MasterPage ام تغییر بدم ؟
مرسی

Behrouz_Rad
پنج شنبه 28 شهریور 1387, 15:59 عصر
اگه دقت کنی، در تگ li خاصیت id اون تنظیم شده، به نظرت نباید "runat="server رو در تگ li قرار بدم ؟

متوجه منظورت هستم اما در اینجا یک برداشت اشتباه داشتی. اون هم اینه که میخوای متناسب با صفحه ی انتخاب شده، id رو به تگ نسبت بدی!
id رو باید برای تمامی تگ هایی که میخوای با برنامه نویسی بهشون دسترسی داشته باشی تعریف کنی نه یک id برای همه!
ضمن اینکه باید یک Class Selector مجزا برای تگ a ای که فرمت مشخصی در هنگام ملاقات صفحه می پذیره تعریف کنی:


.current {
...
}



میشه یه مثال عملی بزنی که من چه خاصیتی رو باید در رویداد load مربوط به MasterPage ام تغییر بدم ؟

خاصیتی که باید تغییر بدی، class هست:


myPageLinkName.Attributes.Add("class", "className");

موفق باشید.

hdv212
پنج شنبه 28 شهریور 1387, 18:23 عصر
ممنونم، ولی من بازم متوجه منظورت نشدم که چکار باید بکنم.
من در Css ام کلاس زیر رو تعریف کردم(همون خواصی که برای #current تعریف شده بود رو کپی کردم) :

.current
{
background-color: #FFF;
color: #333;
}

و در رویداد Page_Load مسترپیجم اینو نوشتم :

if (this.GetCurrentPageName() == "services.aspx")
{
this.Attributes.Add("class", "current");
}
ولی در runTime وقتی روی لینک services کلیک میکنم هیچ اتفاقی نمیفته، چکار باید بکنم ؟

Behrouz_Rad
پنج شنبه 28 شهریور 1387, 18:30 عصر
این چیه نوشتی؟ >>>


this.Attributes.Add("class", "current");


باید برای هر تگ a یک id تعریف کنی. runat رو هم برابر با server قرار بده. به جای اون this، مقداری که در id برای نام لینک تعیین کردی رو قرار بده.

موفق!

hdv212
پنج شنبه 28 شهریور 1387, 18:56 عصر
بله، درسته، همین کار رو کردم، تا حدی مشکلم حل شد، یعنی برای تگ <li> خاصیت "id="currentv رو برداشتم، و به جاش برای هر لینک یک id و یک runAt گذاشتم، همچنین در Page_Load مسترپیج هم این کد رو نوشتم :

if (this.GetCurrentPageName() == "Default.aspx" || this.GetCurrentPageName() == "default.aspx")
{
this.Default.Attributes.Add("class", "current");
}
else if (this.GetCurrentPageName() == "services.aspx")
{
this.services.Attributes.Add("class", "current");
}
else if (this.GetCurrentPageName() == "news.aspx")
{
this.news.Attributes.Add("class", "current");
}
else if (this.GetCurrentPageName() == "aboutUs.aspx")
{
this.aboutUs.Attributes.Add("class", "current");
}
else if (this.GetCurrentPageName() == "contactUs.aspx")
{
this.contactUs.Attributes.Add("class", "current");
}
کلاس Css رو هم همونی هست که در پست قبل نوشتم، منتها مشکل اینجاست که مقدار color در کلاس current به text لینکم اعمال نمیشه!
من فکر میکنم به خاطر Elementهایی هست که در پست 1 در Css تعریف شده، شما چی فکر میکنی ؟
چطوری باید این مشکل رو حل کنم ؟

Behrouz_Rad
پنج شنبه 28 شهریور 1387, 19:07 عصر
بحثی در CSS هست در مورد تشخیص ارجحیت Selector ها برای تگ ها توسط مرورگر که از چهار مولفه در این زمینه استفاده میشه که بحث گسترده ای هست و توضیح در مورد اون از حوصله خارجه.
خلاصه بگم که اون قواعدی که در پست 1 تعریف کردی، کلاس current رو override می کنن.
در این حالت خاص و با توجه به سناریویی که داری، پیشنهاد می کنم که برای تگ های a ی دیگه، کلاس متفاوتی ایجاد کنی و از Descendant Selector ها برای فرمت دهی به اونها استفاده نکنی.

موفق باشید.