به آموزشگاه بیاموز خوش آمدید!

عیدانه بیاموز، فرصت یادگیری با 35٪ تخفیف (کد تخفیف: noruz96)

سبد خرید (0)

آموزش فریم ورک Kendo UI

آموزش Kendo UI (کندو یو آی)-معرفی Kendo UI

در این آموزش، قصد داریم در مورد فریم ورک Kendo UI (کندو یو آی) توضیحاتی را ارائه دهیم.

Kendo UI (کندو یو آی) از سری کامپوننت های شرکت Telerik هست و بر پایه HTML5 و jQuery و CSS3 می باشد.

برای اینکه با قدرت Kendo UI (کندو یو آی) آشنا شوید، بهتر است همراه با ما، مثال های ارائه شده در این مجوعه را مرور فرمایید.


شروع کار با Kendo UI

برای استفاده از امکانات Kendo UI (کندو یو آی) باید چند فایل را به صفحه لینک کنید:

فایل های CSS

در فایل های CSS زیر، تمام کلاس هایی که برای طراحی ظاهر ابزارهای Kendo (کندو) نیاز است، تعریف شده است:

  1. kendo.common.min.css
  2. kendo.default.min.css
  3. kendo.rtl.min.css

فایل ها JavaScript

باید کتابخانه jQuery و همچنین پلاگین اصلی kendo (کندو) که شامل کلیه کدهای مورد نیاز برای ساخت ابزارها است را به صفحه لینک کنیم:

  1. jquery.min.js
  2. kendo.web.min.js

توجه: متأسفانه بدلیل تحریم ایران، دسترسی به سایت اصلی Telerik، امکان پذیر نمی باشد. در انتهای این آموزش، فایل های بالا قرار داده شده است.

در مثال زیر، فایل های مورد نیاز به صفحه لینک شده است:

 

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="/style/kendo.common.min.css" type="text/css" />
    <link rel="stylesheet" href="/style/kendo.default.min.css" type="text/css" />
    <link rel="stylesheet" href="/style/kendo.rtl.min.css" type="text/css" />
 
    <script src="/js/jquery.min.js"></script>
    <script src="/js/kendo.web.min.js"></script>  
    <script>
        $(document).ready(function(){
          //دستـــــــــــــــــــورات
        });
    </script>
</head>
<body class="k-rtl">
   
</body>
</html>

توضیح:

  1. همان طور که گفته شد در Kendo UI از HTML5 استفاده می شود، بنابراین باید <!DOCTYPE html> را در ابتدای صفحه اعلان نمایید.
  2. برای مدیریت بهتر فایل های پروژه، فایل های CSS را داخل پوشه style و فایل های jQuery و Kendo UI را در پوشه js قرار داده ایم.
  3. همانطور که می دانید، تمام متدهای jQuery داخل رویداد ready آورده می شوند. این امر باعت می شود تا کدهای jQuery بعد ازبارگذاری کامل صفحه، اجرا شوند. همچنین با این تکنیک، قادر خواهید بود کدهای JavaScript را در قسمت <head> صفحه قرار دهید.
  4. برای استفاده از ابزارهای Kendo UI در زبان های راست به چپ، علاوه براینکه باید فایل kendo.rtl.min.css را به صفحه لینک کنید، باید کلاس "k-rtl" را در تگ <body> تنظیم نمایید.

دانلود فایل های Kendo UI

پاسورد: www.beyamooz.com

حجم: 907 کیلو بایت

دیدگاه‌ها  

+2 # amirahmad 1394-09-02 05:28
مرسی ممنون از شما
دست شما درد نکنه
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # yaser mahmodi 1394-06-30 16:32
با سلام و ممنون از سایت خوبتون
لطفا آموزش Angular js و sass را داخل سایت قرار بدید.
مچکرم.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # احسان عباسی 1394-07-06 09:01
سلام
آموزش angular به درخواست شما در سایت قرار داده شد.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+13 # ayuob 1393-04-05 23:19
afarin .khayli site khob o alie hastesh.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+13 # امیر پهلوان صادق 1393-01-24 08:46
به نقل از ایلماز:
با سلام
من می خوام از asp mvc برای استفاده از kendo استفاده کنم آیا همین تنظیماتی که گفتید کافی است یا باید تنظیمات دیگه ای هم قرار بدم ضمنا اگه امکانش هست آموزش کار با چارت هاو همچنین bootstrap را هم بگذارید
با تشکر از آموزش های خیلی عالیتون

آموزش kendo در حال کامل شدن است...!
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+7 # sara 1393-12-16 22:25
آیا با webcopier میشه. تورو خدا کامنتم رو پاسخ بدید.
خدا خیرتون بدهد
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # sara 1393-12-16 22:23
سلام
واقعا دستتون درد نکنه خیلی سایت خوبی دارید

میخاستم ببینم با چه برنامه ای میشه سایت خوبتون رو به صورت کامل دانلود کنم و روی لب تابم ذخیره کنم ، مثل w3schol.com
لطفا من راهنمایی کنید
با تشکر
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+8 # امیر پهلوان صادق 1393-12-17 15:01
سلام، ازتون یه خواهش دارم ... و اون اینکه تلاش 4 ساله ی تیم ما رو با قرار دادن اینگونه نسخه های آفلاین از بین نبرید و اگر لینکی را برای دانلود قرار داده اید، آنرا حذف کنید. بنده به عنوان مدیر ارشد تیم بیاموز ازتون خواهش می کنم که مطالب سایت را فقط از طریق پایگاه اینترنتی آن مشاهده بفرمایید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # ایلماز 1393-01-21 12:46
آموزش Kendo عالی بود.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن