نحوه سفارشی‌سازی ستون‌های GridView

framework new logo

framework logo

پیش از نگارش مطلب جدید به چند پرسش که در بخش نظرات پرسیده شده بود پاسخ می دهم . حسین آهنگری در مورد نصب SQL Server 2008 روی ویندوز ویستا پرسیده بود که باید بگم خود من الان ویندوز ویتا دارم و Sql Server 2008 Enterprise روش نصب کردم و هیچ مشکلی نداره . احتمالا مشکل پیش اومده بخاطر رعایت نکردن پیش نیازهای نصب هست مثل Service Pack 1 .netFramework 3.5 و مسایلی از این قبیل . خطاب به خانم شاهزاده احمدی در مورد نوشتن اعداد فارسی در وبلاگ و احتمالا جستجو نشدن آن توسط گوگل باید بگم که علت نگارش فارسی اعداد بخاطر ایجاد مطلب فارسی در این زمینه هست ، همه اعداد وبلاگ با همین دلیل به فارسی و یونیکد  تولید میشن تا بدون مشکل در گوگل جستجو بشن اینکه شما یک متن رو که فارسی می نویسی اعداد انگلیسی داشته باشه به نظر من کاملا اشتباهه . در صورتی که در همون مطالب وقتی معادل انگلیسی اونها اومده دقیقا از اعداد معادل انگلیسی استفاده کردم که همه اینها نهایتا به نتیجه بهتر در موتورهای جستجو کمک بسیار زیادی می کنه . و در آخر خطاب به آقای ولی نوری به ابزار سایت DomainTools زیاد اعتماد نکنید چون همونطور که خودشون در سایتشون نوشتن بسیاری از فاکتورها رو ندیده می گیرن مثل pagerank گوگل و موارد دیگه ای که در خود سایت نوشته شده .

اما مطلب امروز هم پاسخ به پرسش یکی از خوانندگان وبلاگ به اسم مسعود هست که خواسته بود نحوه سفارشی سازی GrivView رو براش توضیح بدم.

همونطور که همه می دونید به روش های مختلفی میشه به یک GridView اطلاعات اراسل و نتیجه رو ملاحظه کرد . در اینجا به نحوه bind کردن اطلاعات در GridView کاری نداریم و صرفا مطالب در مورد چگونگی سفارشی سازی GridView به منظور نمایش بهینه اطلاعات هست .

یک GridView انواع مختلفی از ستون ها رو پشتیبانی می کنه مثل :‌ ‌BoundField و ButtonField و CheckBoxField و CommandField و HyperLinkField و ImageFiled و TemplateField . هر کدام ازاین انواع مختلف برای موارد مختلفی بکار گرفته می شوند . اگرخصوصیت AutoGenerateColumns یک GridView را بصورت True در آورده باشید . خود کنترل بسته به نوع فیلدی که در DataBase وجود دارد یکی از این انواع خاص را مثلا BoundField را انتخاب کرده و مطالب شما را در آن نمایش می دهد مثلا اگر در پایگاه داده یک نوع boolean داشته باشید در هنگام انتخاب نوع ستون ،‌نوع CheckBoxField انتخاب می شود . و در صورتی که در تنظیمات GridView مشخص کرده باشید که می‌خواهید از ویرایش و انتخاب و … هم استفاده کنید CommandField هم به این ستونها اضافه خواهد شد.

حالا فرض کنید که شما می خواهید هنگام نمایش یکی از ستون ها بجای Label ساده از یک دستور (‌مثلا یک تابع برای تبدیل تاریخ میلادی به شمسی ) استفاده کنید و هنگام ویرایش از یک DatePicker بجای TextBox . راه حل موجود برای این کار سفارشی سازی GridView است. برای سفارشی سازی GridView باید مراحل زیر را طی کنید ( توجه کنید که از قسمت Design هم امکان انجام مراحل زیر وجود دارد که به آن اشاره نمی‌شود )

     ۱-     پس از باز کردن Module یا Page مورد نظر به قسمت Source ( که نشان دهنده کدهای Asp هست بروید )

     ۲-     از قسمت خصوصیات GridView ، خصوصیت AutoGenerateColumn را برابر False قرار دهید.

     ۳-     در قسمت <columns> یک ستون جدید از نوع <TemplateFiled> ایجاد کنید .

                    نکته :‌ یک TemplateField از اجزای مختلفی تشکیل شده مثل Header ، Footer ، Item و Edit و AlternatingItem و Insert شما بسته به نوع تغییراتی که می خواهید انجام دهید باید نوع تغییر را با انتخاب یکی از این انواع مشخص کنید . مثلا اگر مایلید تغییرات در هنگام Edit را کنترل کنید باید بخش <EditTemplate> را انتخاب کنید و اگر تغییرات حالت پیش فرض برای شما مهم است باید <ItemTemplate> را انتخاب کنید . به همین شکل برای سایر قسمت ها عمل کنید .

     ۴-     ( فرض کنید که در گام اول تغییرات مرحله نمایش پیش فرض را می خواهید کنترل کنید به این منظور ) <ItemTemplate> را انتخاب کرده و داخل آن یک <asp:label> بگذارید در این اینجا ( یعنی بین تگ باز و بسته ItemTemplate ) هر چیزی که بگذارید هنگام نمایش GridView به کاربر نشان داده می شود

                    نکته : به منظور مشخص کردن نام ستونی که از DataSource شما ( که احتمالا در code-behind مشخص شده و ) باید به این Label متصل (bind) شود باید در خصوصیت مرتبط با نمایش کنترل مذکور ( در اینجا text که حالت نمایش متنی Label را مشخص می کند ) ، به این صورت عمل کنید مثلا

Text='<%# Eval(“DataSourceColumnName”) %>’

                    نکته : توجه داشته باشید که انواع مختلفی برای Bind کردن اطلاعات (‌مثل # و $ و … ) وجود دارد که در بحث دیگری به آنها خواهم پرداخت.

     ۵-     نهایتا برای حالت های دیگری که مایل به سفارشی سازی آن هستید هم اقدام به سفارشی سازی کنید مثلا در حالت EditTemplate یک TextBox بگذارید.

     ۶-     نکته مهم اینکه برای گذاشتن دستورات باید یک TemplateField ایجاد کنید و در آن از LinkButton استفاده کنید و خصوصیت CommandName را در LinkButton ها برابر با دستور انتخابی مثل Edit یا Select یا غیره قرار دهید .

<asp:LinkButton ID=”lnbEdit” runat=”server” Text=”Edit” CommandName=”Edit” />

                    نکته : توجه کنید که برای این LinkButton لزومی ندارد که On_Click تعریف کنید ، چرا که Eventی که باید فراخوانی شود درواقع همان event مربوط به GridView است که با نام OnRowEditing شناخته می‌شود . برای حالت های دیگر مثل Select هم نیازی نیست و درواقع event مربوط به GridView است که fire می‌شود.

     ۷-     کار تمام است از GridView سفارشی شده لذت ببرید.

امیدوارم کامل و ساده توضیح داده باشم. پرسشی بود توی قسمت نظرات بنویسید . با سپاس ناصر حاجلو

این هم یک Reference خوب برای توضیحات بیشتر

سفارشی سازی GridView

6 Responses to نحوه سفارشی‌سازی ستون‌های GridView

  1. Masoud says:

    من اون مسعوده نیستم.ولی یه سوال دارم.

    این ترکیب رنگ هایی که استفاده می کنید رو از خدتون انتخاب می کنید یا چیز دیگه ای هست؟

  2. ترکیب رنگ ها از خودم هستو در حال حاضر در برنامه ERP شرکت فراکنش که شامل یازده سیستممختلف هست استفاده میشه . اینgridview از skin هم پشتیبانی می کنه و من چند تا رنگبندی مختلف براش درست کردم نمونه دیگریاز رنگبندی که ابی هسترو در وب سایتشرکت فراکنش کهلینکش کنار وبلاگ من هست می تونید ببینید . وقتی وارد سایت شدید یک سیستم رو مثل سیستم حسابداری شرکت فراکنش انتخاب کنیدو روی عکس های برنامه کلیک کنید . تا رنگ بندی آبی رو همببیینید .
    خود GridView هم GridView استاندارد Asp.net هست.
    اگر سوال دیگه ای هم بوددر خدمتم

  3. Masoud says:

    قربانت آقا .

    همینم زیادی بود.

    با این گرید ویو مشکلی ندارم.همه کار باهاش می کنم.من کلا تو رنگ بندی کارام لنگم :دی

    راستی برای اون Hover برای Gridview از Jquery استفاده کنید قشنگ تر میشه.یه ذره افکت و اینها هم می خوره .

  4. پریسا says:

    سلام یکی می تونه به من کمک کنه من با .net 2005 کار کردم اما الان .net 2008 را نصب کردم برا اینمه بتوانم ابزار را که به صفحه درگ می کنم حرکت دهم چی کار کنم من تیکه change را هم tools/optionدر قسمت html desiner را هم زدم اما نمی شه من چی کار کنم

  5. متوجه منظور شما نشدم. اما برداشت من از حرفهای شما این است که می خواهید بصورت absolute position کار کنید که در این صورت باید تیک مربوط به آن را بزنید

  6. الکی says:

    سلام
    کسی هست که بتونه در مورد یه tableless GridView به من کمک کنه؟!؟!؟!؟!؟؟

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: