$.ajax({ type: "POST", url: options.renderModalPartialViewUrl, data: options.renderModalPartialViewData,
load در پشت صحنه از همین متد ajax استفاده میکند. تمام متدهای کمکی از این دست فقط محصور کننده تابع ajax اصلی جیکوئری هستند.
نظرات مطالب
پایان پروژه ASP.NET Ajax Control Toolkit !
سلام آقای نصیری. من، هم با این کتابخانه و updatepanel کار کردم و هم jquery . درسته که خروجی کار با jquery بسیار با کیفیت تر و انعطاف پذیری هم بیشتره،ولی حقیقتش هر موقع از این روش استفاده می کنم احساس خوبی ندارم! به نظرم کدها بسیار نا مرتب و به قول معروف اسپاگتی هستن. من تمام تلاشم رو میکنم که در داخل فایل جاوااسکریپت بسیار با قاعده و طبقه بندی شده بنویسم،ولی بازهم .. به خصوص وقتی لازم میشه html رو داخل جاوااسکریپت و به صورت رشته ای تولید کنم.
می خواستم بدونم واقعا به همین صورته یا من از روش های نادرست استفاده میکنم.
می خواستم بدونم واقعا به همین صورته یا من از روش های نادرست استفاده میکنم.
مسیرراهها
Twitter Bootstrap
Bootstrap 2
- آغاز به کار با Twitter Bootstrap در ASP.NET MVC
- استفاده از Twitter Bootstrap در کارهای روزمره طراحی وب
- نگاهی به اجزای تعاملی Twitter Bootstrap
- استفاده از modal dialogs مجموعه Twitter Bootstrap برای گرفتن تائید از کاربر
- نمایش فرمهای مودال Ajax ایی در ASP.NET MVC به کمک Twitter Bootstrap
- ساخت قالبهای نمایشی و ادیتور دکمه سه وضعیتی سازگار با Twitter bootstrap در ASP.NET MVC
- استفاده از دکمههای CSS توئیتر در ASP.NET MVC
- استفاده از دکمههای CSS توئیتر در ASP.NET MVC - قسمت دوم
- اعمال کلاسهای ویژه اعتبارسنجی Twitter bootstrap به فرمهای ASP.NET MVC
- نمایش خطاهای اعتبارسنجی سمت کاربر ASP.NET MVC به شکل Popover به کمک Twitter bootstrap
- نمایش خطاهای اعتبارسنجی سمت کاربر ASP.NET MVC به شکل Tooltip به کمک Twitter bootstrap
- مشکل اعتبار سنجی jQuery validator در Bootstrap tabs
- ویرایش قالب پیش فرض Add View در ASP.NET MVC برای سازگار سازی آن با Twitter bootstrap
- ساخت منوهای چند سطحی در ASP.NET MVC
Bootstrap 3
- بوت استرپ (نگارش 3) چیست؟
- بررسی سیستم جدید گرید بوت استرپ 3
- تغییرات صورت گرفته در المانهای تایپوگرافی و شیوه نامههای بوت استرپ 3
- نگاهی به اجزای سیستم راهبری بوت استرپ 3
- اجزای جاوا اسکریپتی بوت استرپ 3
- کار با فرمها در بوت استرپ 3
- صفحات مودال در بوت استرپ 3
- نحوهی صحیح کار کردن با بوت استرپ
- نمایش اخطارها و پیامهای بوت استرپ به کمک TempData در ASP.NET MVC
- سازگارسازی کلاسهای اعتبارسنجی Twitter Bootstrap 3 با فرمهای ASP.NET MVC
اشتراکها
کتابخانه jquery.gsap.sprite
Sprite control plugin for jQuery & GSAP Demo
فرض کنید اطلاعات صفحهای بر اساس کوئری استرینگ دریافتی رندر میشوند. مثلا یک گرید و یا حتی یک صفحه ویرایش اطلاعات. در حین فراخوانی متد Ajax در jQuery اطلاعات کوئری استرینگهای موجود به سرور ارسال نخواهند شد و صرفا اطلاعاتی که در پارامتر data آن صریحا ذکر میشوند، به سرور ارسال میگردند.
برای رفع این نقیصه با استفاده از قطعه کد زیر میتوان کلیه کوئری استرینگهای صفحه را یافت و به شیءایی به نام urlParams به صورت خاصیت اضافه کرد:
سپس اگر قسمت ارسال اطلاعات متد ajax در حال فراخوانی چنین شکلی را داشته باشد:
نیاز خواهیم داشت تا urlParams را با آن یکی کنیم. اینکار نیز توسط متد extend خود jQuery قابل انجام است:
بنابراین در نهایت قسمت ارسال اطلاعات ما برای الحاق کلیه کوئری استرینگهای صفحه چنین شکلی را خواهد یافت:
و در سمت سرور امضای متدی که اطلاعات به آن ارسال میشوند، در این مثال خاص شامل items و surveyId به همراه نام کوئری استرینگهای مدنظر میتواند باشد و اطلاعات به صورت خودکار به آنها بایند خواهند شد.
برای رفع این نقیصه با استفاده از قطعه کد زیر میتوان کلیه کوئری استرینگهای صفحه را یافت و به شیءایی به نام urlParams به صورت خاصیت اضافه کرد:
var urlParams; (window.onpopstate = function () { var match, pl = /\+/g, // Regex for replacing addition symbol with a space search = /([^&=]+)=?([^&]*)/g, decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); }, query = window.location.search.substring(1); urlParams = {}; while (match = search.exec(query)) urlParams[decode(match[1])] = decode(match[2]); })();
$.ajax({ type: "POST", url: "@sortUrl", data: JSON.stringify({ items: items, surveyId: surveyId }),
function jsonConcat(defaults, options) { /* merge defaults and options, without modifying defaults */ return $.extend({}, defaults, options); }
var ajaxData = { items: items, surveyId: surveyId }; $.ajax({ type: "POST", url: "@sortUrl", data: JSON.stringify(jsonConcat(ajaxData,urlParams)),
حداقل دو علت میتونه داشته باشه:
الف) تصاویر رو نمیتونه پیدا کنه، یا صفحه کش شده بیش از حد. قسمت «اجرای کدهای jQuery Ajax فوق، چه تغییری را در صفحه سبب میشوند؟» را بررسی کنید که چه آدرسی توسط کدهای جیکوئری در حال پردازش است.
همچنین کش شدن نتایج قبلی رو هم میشود غیرفعال کرد:
ب) چند وقت قبل در یکی از بحثهای سایت دیدم که مورد زیر رعایت نشده بود و کدهای جیکوئری کار نمیکردند:
اجرای کدهای جیکوئری نیازی به DOM حاضر و آماده دارند که توسط متد document ready آن مانند کدهای فوق باید تدارک دیده شود. نیازی به این کد نخواهد بود اگر اسکریپتها در آخر صفحه و پیش از بسته شدن تگ body اضافه بشن.
الف) تصاویر رو نمیتونه پیدا کنه، یا صفحه کش شده بیش از حد. قسمت «اجرای کدهای jQuery Ajax فوق، چه تغییری را در صفحه سبب میشوند؟» را بررسی کنید که چه آدرسی توسط کدهای جیکوئری در حال پردازش است.
همچنین کش شدن نتایج قبلی رو هم میشود غیرفعال کرد:
$.ajax({ cache: false /* گاهی از اوقات خصوصا برای آی ایی نیاز است */ });
<script type="text/javascript"> $(function () { // کدهای جیکوئری در اینجا }); </script>
پروژهها
Mvc File Manager
به نظر من بهترین روش برای یادگیری برنامه نویسی انجام یک پروژه واقعی و کاربردی است . (هرچند ساده) به همین دلیل در حین یادگیری asp.net mvc تصمیم گرفتم یک فایل منجیر درست کنم که با پیشرفت در یادگیری asp.net mvc اون رو تکمیل کنیم.
پیاده سازی کنترلر های Browse,Download,Upload, CreateFolder,Delete
هدف از این مرحله یادگیری کنترلر ، ویو ، ویو مدل ، مدل بایندینگ ، روتینگ ، اکشن ریزالت و....
فاز دوم : (انجام شد) نسخه 0.2.3
پیاده سازی کنترلر های Rename,Properties
استفاده از WebGrid در مرورگر فایل
محاسبه حجم پوشه
نسخه اصلاحی آقای وکیلی:دریافت
تغییر در نوع چینش models
افزودن PlUploader برای آپلود فایل
تغییر در Partial به نام _breadCrumb
امکان چند انتخاب هم زمان - و همچنین حذف چند مورد هم زمان
باز شدن پوشهها و دانلود شدن فایلها با دابل کلیک
تغییرات مختصر در style
تغییر در ساختار لینک برگشت -> انتقال از model به view و پیاده سازی با jquery به دلیل سهولت بیشتر
فاز سوم:
پیاده سازی اعتبار سنجی کاربران و نقشهای آنان
تعریف نقشهای زیر (ایده خام)
Admin (Full access) FileManager_Read(readonly access) FileManager_Write(Creat Folder & upload file) FileManager_Change(Move & Rename) FileManager_Delete(Delete file and Folder
فاز چهارم :
پیاده سازی مراحل قبل تحت Ajax
فاز پنجم:
بهینه سازی و تکمیل پروژه
ایدههای پراکنده :
قابلیت کپی
قابلیت انتخاب چندتایی برای کپی و حذف و ...
قابلیت آپلود همزمان چند فایل
چند زبانه بودن
توسعه اینترفیس (درختواره پوشهها ، ویوهای مختلف جهت نمایش فایل (لیست، آیکونهای کوچک ، آیکونهای بزرگ))
نمایش و تغییر دسترسیهای ویندوز
آپلود فایل فشرده و اکسترکت کردن آن
جستجوی فایل
.
.
.
کتابخانهی ذکر شده را حذف و سپس به روش زیر برای فعال سازی remote validation عمل کنید:
- در اینجا در ابتدا متد remote کتابخانهی jQuery Validator غیرفعال میشود. سپس یک rule جدید، به kendoValidator به نام دلخواه remote اضافه شدهاست. چون ruleهای kendoValidator اعمال async را پشتیبانی نمیکنند، در درخواست ajax آن async: false تنظیم شدهاست. به این ترتیب سطر پس از ajax، پس از پایان کار عملیات ajax فراخوانی میشود و در این حالت kendoValidator بدون مشکل کار خواهد کرد.
- سمت سرور آن هم مانند قبل به همراه استفاده از ویژگی Remote است که از آن صرفا برای مقدار دهی data-val-remote-url و val-remote که در rule جدید استفاده میشوند، کمک گرفته خواهد شد.
$.validator.methods.remote = function () { /* disabled */ }; $("form").kendoValidator({ onfocusout: true, onkeyup: true, rules: { remote: function (input) { var remoteAttr = input.attr("data-val-remote-url"); if (typeof remoteAttr === typeof undefined || remoteAttr === false) { return true; } var isInvalid = true; var data = {}; data[input.attr('name')] = input.val(); $.ajax({ url: remoteAttr, mode: "abort", port: "validate" + input.attr('name'), dataType: "json", type: input.attr("data-val-remote-type"), data: data, async: false, success: function (response) { isInvalid = response; } }); return !isInvalid; } }, messages: { remote: function (input) { return input.data('val-remote'); } } });
- سمت سرور آن هم مانند قبل به همراه استفاده از ویژگی Remote است که از آن صرفا برای مقدار دهی data-val-remote-url و val-remote که در rule جدید استفاده میشوند، کمک گرفته خواهد شد.
نظرات مطالب
خلاصه اشتراکهای روز دو شنبه 18 مهر 1390
برای اینکه UpdatePanel از روش ارسال کل ViewState به سرور در طی یک Partial PostBack در پشت صحنه استفاده میکنه. یعنی یک سبب بروز Page life cycle متداول ASP.NET میشود. به همین جهت سنگین است اما سازگاری 100 درصد با ASP.NET Webforms دارد.