پیشنیازهای بحث:
- « صفحه بندی، مرتب سازی و جستجوی پویای اطلاعات به کمک Kendo UI Grid »
- « استفاده از Kendo UI templates »
صورت مساله
میخواهیم به یک چنین تصویری برسیم؛ که دارای گروه بندی اطلاعات است، فرمت شرطی روی ستون قیمت آن اعمال شده و تاریخ نمایش داده شده در آن نیز شمسی است. همچنین برای مثال ستون قیمت آن دارای ته جمع صفحه بوده و به علاوه یک دکمهی سفارشی به نوار ابزار آن اضافه شدهاست. ...
در مطلب « صفحه بندی، مرتب سازی و جستجوی پویای اطلاعات به کمک Kendo UI Grid » در انتهای بحث، ستون IsAvailable به صورت زیر تعریف شد: columns: [
{
field: "IsAvailable", title: "موجود است",
template: '<input type="checkbox" #= IsAvailable ? checked="checked" : "" # disabled="disabled" ></input>'
}
]
Templates، جزو یکی از پایههای Ken ...
پس از آشنایی مقدماتی با Kendo UI DataSource ، اکنون میخواهیم از آن جهت صفحه بندی، مرتب سازی و جستجوی پویای سمت سرور استفاده کنیم. در مثال قبلی، هر چند صفحه بندی فعال بود، اما پس از دریافت تمام اطلاعات، این اعمال در سمت کاربر انجام و مدیریت میشد.
مدل برنامه
در اینجا قصد داریم لیستی را با ساختار کلاس Product در اختیار Kendo UI گرید قرار دهیم: namespace KendoUI03.Models
{
public class Product
...
Kendo UI DataSource جهت تامین دادههای سمت کلاینت ویجتهای مختلف KendoUI طراحی شدهاست و به عنوان یک اینترفیس استاندارد قابل استفاده توسط تمام کنترلهای دادهای Kendo UI کاربرد دارد. Kendo UI DataSource امکان کار با منابع داده محلی، مانند اشیاء و آرایههای جاوا اسکریپتی و همچنین منابع تامین شده از راه دور، مانند JSON، JSONP و XML را دارد. به علاوه توسط آن میتوان اعمال ثبت، ویرایش و حذف اطلاعات، به همراه صفحه بندی، گروه بندی و مرتب سازی ...
ویجتهای وب Kendo UI کدامند؟
ویجتهای وب Kendo UI مجموعهای از کنترلهای سفارشی HTML 5 هستند که برفراز jQuery تهیه شدهاند. این کنترلها برای برنامههای وب و همچنین برنامههای دسکتاپ لمسی طراحی شدهاند.
بهترین روش برای مشاهدهی این مجموعه، مراجعه به فایل examples\index.html پوشهی اصلی Kendo UI است که لیست کاملی از این ویجتها را به همراه مثالهای مرتبط ارائه میدهد. تعدادی از اعضای این مجموعه شامل کنترل ...
Kendo UI چیست؟ Kendo UI یک فریم ورک جاوا اسکریپتی ساخت برنامههای مدرن و تعاملی وب است و برای رسیدن به این مقصود، از JavaScript، CSS 3، HTML 5 و jQuery کمک میگیرد.
امکانات فراهم شده توسط Kendo UI
1) انواع و اقسام ویجتها: کنترلهای وب تهیه شده برفراز jQuery
ویجتهای آن در سه گروه کلی قرار میگیرند:
- گروه وب، مانند گرید، tree-view و ...
برای تغییر سایز ستونهای جداول HTML با استفاده از ماوس، افزونههای زیادی تدارک دیده شده است که از جمله مطرحترین آنها میتوان به colResizable اشاره کرد. حتی اگر از DataGridهای مطرح وب هم استفاده کرده باشید، اکثر آنها از تغییر سایز ستونها توسط کاربر پشتیبانی میکنند. اما مشکل بزرگی که در همهی آنها مشترک است این است که فقط از چیدمانهای چپ به راست پشتیبانی میکنند و به محض اینکه شما ساختار راست به چپ را به جدول مورد نظر اعمال کنید، ...
jsTree یکی از افزونههای بسیار محبوب jQuery جهت نمایش ساختارهای سلسله مراتبی، خود ارجاع دهنده و تو در تو است. روش ابتدایی استفاده از آن تعریف یک سری ul و li ثابت در صفحه و سپس فراخوانی این افزونه بر روی آنها است که سبب نمایش درختوارهای این اطلاعات خواهد شد. روش پیشرفتهتر آن به همراه کار با دادههای JSON و دریافت پویای اطلاعات از سرور است که در ادامه به بررسی آن خواهیم پرداخت.
دریافت افزونهی jsTree
...
عموما از ajax برای ارائه سایتهایی سریع، با حداقل ریفرش و حداقل مصرف پهنای باند سرور، استفاده میشود. اما این روش، مشکلات خاص خود را نیز دارا است. عموما محتوای پویای بارگذاری شده، سبب تغییر آدرس صفحهی جاری در مرورگر نمیشود. برای مثال اگر قرار است چندین برگه در صفحه به صورت ajax ایی بارگذاری شوند، تغییر سریع محتوا را مشاهده میکنید، اما خبری از تغییر آدرس جاری صفحه در مرورگر نیست. همچنین روشهای ajax ایی عموما SEO friendly نیستند. زیرا اک ...
با استفاده از چهارچوب بوت استرپ میتوان رابطهای کاربر استانداردی ساخت که قبلا دوستان در این سایت مطالبی را در این باب نوشته اند. در مطلب صفحات مودال در بوت استرپ 3 در مورد ترکیب قالب بوت استرپ با سیستم اعتبارسنجی MVC و jQuery validation و نمایش فرمهای مودال بوت استرپ صحبت شده و بسیار کامل هست.
مشکل: هنگام کار با بوت استرپ اگر از tabهای آن در فرم برنامه استفاده کنید، هنگام validate کردن فرم متوجه میشوید که ف ...