@helper ListItem(string content) { <li>@content</li> } <ul> @foreach(var item in Model) { @ListItem(item) } </ul>
@{ Func<dynamic, HelperResult> ListItem = @<li>@item</li>; } <ul> @foreach(var item in Model) { @ListItem(item) } </ul>
<header> @if (IsSectionDefined("Header")) { @RenderSection("Header") } else { <div>Default Content for Header Section</div> } </header>
public static HelperResult RenderSection(this WebViewPage page, string name, Func<dynamic, HelperResult> defaultContent) { if (page.IsSectionDefined(name)) { return page.RenderSection(name); } return defaultContent(null); }
<header> @this.RenderSection("Header", @<div>Default Content for Header Section</div>) </header>
@model IEnumerable<string> @{ ViewBag.Title = "Test"; }
public ActionResult Index() { var names = new string[] { "Vahid Nasiri", "Masoud Pakdel", ... }; return View(names); }
public static HelperResult Repeater<T>(this HtmlHelper html, IEnumerable<T> items, Func<T, HelperResult> itemTemplate, Func<T, HelperResult> alternatingitemTemplate = null, Func<T, HelperResult> seperatorTemplate = null) { return new HelperResult(writer => { if (!items.Any()) { return; } if (alternatingitemTemplate == null) { alternatingitemTemplate = itemTemplate; } var lastItem = items.Last(); int ii = 0; foreach (var item in items) { var func = ii % 2 == 0 ? itemTemplate : alternatingitemTemplate; func(item).WriteTo(writer); if (seperatorTemplate != null && !item.Equals(lastItem)) { seperatorTemplate(item).WriteTo(writer); } ii++; } }); }
@Html.Repeater(Model, @<div>@item</div>, @<p>@item</p>, @<hr/>)
public class Product { public int Id { set; get; } public string Name { set; get; } }
<table> <tr> <td>Id</td> <td>Name</td> </tr> @Html.Repeater(Model, @<tr><td>@item.Id</td><td>@item.Name</td></tr>) </table>
ابزار فرمول نویسی ریاضی و شیمی به همراه قابلیت تشخیص دست خط
CKEDITOR.replace(this.id, { allowedContent : true });
CREATE TABLE `Users` ( id int NOT NULL AUTO_INCREMENT, first_name VARCHAR(255) NOT NULL, last_name VARCHAR(255) NOT NULL, email VARCHAR(255) NOT NULL, gender ENUM('Male','Female') NOT NULL, PRIMARY KEY (`id`) )
SELECT *, CONCAT(first_name, '', last_name) AS full_name FROM Users;
ALTER TABLE Users ADD COLUMN full_name TEXT GENERATED ALWAYS AS (CONCAT(first_name, ' ', last_name))
ALTER TABLE Users ADD COLUMN full_name TEXT GENERATED ALWAYS AS (CONCAT(first_name, ' ', last_name)) STORED
- generated columnsها نمیتوانند شامل subqueries, parameters, variables, stored procedure, user-defined functions باشند.
- بر روی یک ستون generated نمیتوان AUTO_INCREMENT گذاشت یا اینکه از یک ستون AUTO_INCREMENT برای محاسبه generated column استفاده کرد.
- کلیدهای خارجیای که در generated columnsها استفاده میشوند، قابلیت استفاده از CASCADE, SET NULL, or SET DEFAULT as ON UPDATE or ON DELETE را نخواهند داشت.
ALTER TABLE productMetadata ADD COLUMN id INT GENERATED ALWAYS AS (JSON_UNQUOTE(JSON_EXTRACT(data, '$.id'))) STORED NOT NULL
SELECT data ->> "$.description.shortDescription" FROM productMetadata WHERE id = 1;
همانطور که مشاهده میکنید مقدار type به ALL تنظیم شدهاست؛ همچنین مقدار rows نیز تعداد ردیفهای جدول است که در اینجا ۱۳ ردیف دیتا را داریم. قاعدتاً با اضافه شدن دیتای جدید به جدول، جستجو نیز به مراتب کندتر خواهد شد. بنابراین با اضافه کردن ایندکس میتوانیم مشکل این کند بودن را رفع کنیم. به همین جهت در ادامه یک ایندکس را براساس ستون id که یک generated column است ایجاد خواهیم کرد:
CREATE INDEX idx_json_data ON productMetadata (id);
اکنون اگر یکبار دیگر کوئری قبلی را اجرا کنیم، خواهیم دید که تعداد rows به ۱ و همچنین type به ref ست شدهاند:
ابتدا یک پروژه Asp.Net MVC ایجاد کنید. در فولدر scripts تمام فایلهای جاوااسکریپ پروژه قرار خواهند داشت. اگر قصد داشته باشیم که فایلهای جاوااسکریپی سایر فریم ورکها را استفاده نماییم (مثل backbone.js و ExtJs و...) برای طبقه بندی بهتر فایل ها، بهتر است که یک فولدر با نامی مشخص بسازیم و فایلهای مورد نیاز را در آن قرار دهیم. البته اگر از nuget برای نصب این فریم ورکها استفاده نمایید عموما این کار انجام خواهد شد.
حال با استفاده از Package Manager Console و اجرای دستور زیر، اقدام به نصب requireJs کنید
PM> Install-package requireJs
یک فولدر به نام MyFiles در فولدر Scripts بسازید و فایلهای purchase.js و product.js و credits.js در پروژه قبل را در آن کپی نمایید. کد فایلهای پروژه قبل به صورت زیر بوده است:
purchase.js
define(["credits","products"], function(credits,products) { console.log("Function : purchaseProduct"); return { purchaseProduct: function() { var credit = credits.getCredits(); if(credit > 0){ products.reserveProduct(); alert('purchase done');' return true;
} alert('purchase cancel'); return false; } } });
products.js
define(function(products) { return { reserveProduct: function() { console.log("Function : reserveProduct"); return true; } } });
define(function() { console.log("Function : getCredits"); return { getCredits: function() { var credits = "100"; return credits; } } });
برای قدم بعدی، در متد RegisterBundles فایل bundleConfig پروژه دستور زیر را وارد نمایید:
bundles.Add( new ScriptBundle( "~/bundles/require" ).Include( "~/Scripts/require.js" ) );
حال برای استفاده و لود ماژول purchase در انتهای فایل Index فولدر Home تغییرات زیر را اعمال نمایید:
@section scripts { <script type="text/javascript"> require(['purchase'], function (purchase) { purchase.purchaseProduct(); }); </script> }
SASS #1
SASS چیست؟
SASS مخفف Syntactically Awesome Style Sheets است که توسط آقای Hampton Catlin طراحی و ایجاد شده است و همانند CoffeeScript که پس از کامپایل به جاوااسکریپت تبدیل میشد، SASS نیز پس از کامپایل به CSS تبدیل میشود. SASS با استفاده از متغیرها، mixins، ارث بری و قوانین تودرتو، CSS را با مهارت زیادی در بهترین حالت تولید میکند.
SASS باعث کمتر نوشتن کد CSS، سبب افزایش خوانایی و دستکاری کردن راحتتر و پویای آن میشود. این مساله راهی عالی برای نوشتن کدهای CSS کاربردیتر است و میتواند سرعت گردش کار هر توسعه دهنده و یا طراح وب را افزایش دهد.
وقتی اولین بار SASS عرضه شد، syntax آن تفاوت قابل توجهی با CSS داشت (پسوند فایلهای آن SASS. است) که به جای نوشتن براکتها، از تورفتگی استفاده میشد و دیگر نیازی به نوشتن ";" نبود. البته با عدم استقبال از این syntax مواجه شد و با عرضهی نسخه 3 SASS، (که پسوند فایلهای آن SCSS. است) syntax آن بسیار شبیه به CSS شد؛ البته با همهی ویژگیهای SASS.
برای مثال کد CSS زیر را میخواهیم به دو روش بنویسیم:
header { margin: 0; padding: 0; color: #fff; }
$color: #fff; header { margin: 0; padding:0; color: $color; }
$color: #fff header margin: 0 padding: 0 color: $color
توجه: syntax ایی که در این سری آموزشی با آن کار میکنیم SCSS. است.
کامپایل کردن SASS
روشهای مختلفی برای کامپایل فایلهای SASS وجود دارند:- روش اصلی استفاده از SASS در Ruby است که پس از نصب Ruby و اجرای فرمان SASS ،gem install sass نصب میشود و برای کامپایل، اجرای فرمان زیر:
sass myfile.scss myfile.css
- استفاده از برنامههای گرافیکی مانند Hammer , CodeKit و Compass.
- استفاده از برنامههای رایگان مانند libsass که با یک کامپایلر سریع نوشته شده با ++C/C است و همچنین میتوانید libsass را از طریق NPM با node-sass نصب کنید.
npm install node-sass
- استفاده از افزونه Web Essentials در Visual Studio
خب سوالی که ممکن است برای شما پیش آمده باشد این است که باید از کدام یک از این روشها را استفاده کنیم؟
بستگی به این دارد که شما چه کاری را میخواهید انجام دهید.
- در صورتیکه بر روی یک پروژهی بزرگ با میزان کد زیاد کار میکنید، استفاده از Ruby SASS، کمی کند کار کامپایل را انجام میدهد.
- اگر بخواهید از libsass استفاده کنید، این مسئله وجود دارد که به طور %100 با قابلیتهای Ruby SASS برابری ندارد.
- در صورتیکه نمیخواهید از command line استفاده کنید، برنامههای گرافیکی گزینهای عالی هستند. شما میتوانید طوری تنظیم کنید که تمامی تغییراتی که در فایل SASS انجام میشود، به صورت خودکار کار کامپایل انجام شود.
- اگر هم فقط میخواهید کدی را که نوشتهاید تست کنید، میتوانید از ابزارهای آنلاین مانند SassMeister استفاده کنید.
ایجاد یک موتور جستجوی سفارشی جهت search bar فایرفاکس
بعد از نصب افزونه و ورود به صفحه اصلی گوگل، روی textbox سرچ کوگل کلیک راست کرده و گزینه add to search bar رو انتخاب کنید و بعد OK.