custom view برای گرید ویو

[b.paseban]

با سلام خدمت دوستان برنامه نویس.
نحوه نمایش به چند صورت مختلف توی گریدویو رو همه ماها توی فروشگاههای اینترنتی دیدیم.
مثلا نمایش بصورت عکس بزرگ و مفداری توضیح و نمایش دیگه بصورت فقط توضیح که کاربر بسته به نوع انتخاب میتونه هر کدوم رو نمایش بده.
میخوام بدونم این کار رو چطوری باید انجام بدم؟
آیا باید دو نوع صفحه بندی طراحی کنیم و با ajax اونهارو عوض کنیم یا راه حل دیگه ای برای اینکار وجود داره.
با تشکر از همه دوستان برنامه نویس.org

[b.paseban]

کسی در این مورد چیزی نمیدونه؟
نمونه این کار رو توی سایت های خرید و فروش اینترنتی مثل ebay و alibaba.com میتونید پیدا کنید.

[b.paseban]

کسی جواب این سوال مرا میداند؟

[baran_mehr]

برای اینکار من ListView رو پیشنهاد میکنم با تمپلیت ها خیلی راحت میتونید این کار رو انجام بدید

[b.paseban]

با تشکر از شما دوست عزیز.
من مشکلی با نوع تمپلیت ندارم بلکه میخوام بدونم اینکه از چند نوع تمپلیت برای نمایش داده ها استفاده میشه رو بدونم.
مثلا توی همین سایت ebay یا alibaba.com کاربر میتونه بسته به نوع سلیقه خودش یه تمپلیت رو انتخاب کنه.مثلا بصورت نوشته و عکس و یا فقط نمایش عکس خالی.
من این کار رو با قرار دادن کنترل خودمون داخل یه updatepanel میتونم انجام بدم ولی باید از دوتا کنترل دیتا استفاده کنم و یکی رو visible=false قرار بدم و دیگری رو true و دوتا دکمه انتخاب حالت نمایش برای کاربر بزارم و به اون اجازه جابجایی این کنترل ها رو از طریق false و یا true کردن اون کنترل ها بدم.میخوام بدونم این راه صحیحه یا نه.

[baran_mehr]

خوب شما به جای اینکه دو تا تمپلیت درست کنید و دوتا لیست و هر بار یکی را مخفی کنید چرا یک تمپلیت با تمام فیلدهای مورد نیاز درست نمیکنید و فیلد ها رو مخفی کنید؟ مثلا یک بار تمام فیلدهای عکس رو مخفی کنید و اکر کاربر عکس ها رو هم خواست دو باره نشونشون بدید

[b.paseban]

خوب ما میخواهیم از چند نوع تمپلیت استفاده کنیم و طبعا محل قرار گیری فیلدهای ماهم تغییر می کنه و با غیر فعال کردن برخی از فیلها این روش جواب نمیده.
به عکسای زیر یه نگاه بندازین متوجه منظورم من میشین:
عکس 1:
68506

عکس 2:
68504

عکس 3:
68505

[hlikehamed]

فکر می کنم شما یه همچین چیزی مد نظر دارید :

http://www.fluidbyte.net/jquery-listicon-view-mode-switcher

دموی :
http://www.fluidbyte.net/workshop/viewmode/

ببینید به درد می خوره. فکر می کنم اگر کمی دست کاری کنید بتونید به نتیجه برسید

[hlikehamed]

تقریبا بهترین گزینه به نظر میرسه :

یک نمونه بهتر و زیباتر :

http://designm.ag/tutorials/jquery-display-switch/

دمو :

http://www.sohtanaka.com/web-design/examples/display-switch/

همگی از ul و li استفاده کردند. فکر می کنم شما هم از این تگها استفاده کنید بهتر به جواب برسید

[b.paseban]

با تشکر از شما دوست عزیز.
اولی رو امتحان کردم (با repeater) جواب داد.:چشمک:
دومی هم به احتمال زیاد بشه استفاده کرد.
اینم برای کسایی که می خوان از ریپیتر استفاده کنن:
بعد از قرار دادن لینک css و jquery و کپی past کردن کدای جاوای هدر:




<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
<HeaderTemplate>
<div id="controls">
<a rel="list" class="active">List View</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a rel="icon">Icon
View</a></div>
<ul id="container" class="list">
</HeaderTemplate>
<ItemTemplate>
<li>
<div>
<a class="overlay" href="#link_to_item">
<!-- Fade Overlay -->
</a>
<h1>
Lorem ipsum dolor sit amet</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo massa,
vulputate in porttitor eu, ullamcorper ut odio. Suspendisse fermentum tellus eu
dui elementum a pharetra lectus adipiscing. Integer commodo orci ut urna commodo
sed fermentum felis feugiat. Sed sed lorem tellus. Nullam varius, lorem sit amet
molestie condimentum, nibh arcu hendrerit libero, vitae bibendum mauris felis ac
ipsum. Nam tristique fermentum lobortis. Sed euismod erat et ligula mollis suscipit.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis
egestas. Phasellus bibendum, elit eu commodo suscipit, augue eros dignissim urna,
vitae scelerisque nunc lorem quis massa. Aliquam erat volutpat. Aliquam erat volutpat.
Praesent vehicula ante sed elit imperdiet dictum.
</p>
</div>
<a>Read More &raquo;</a> </li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>