آموزش نکات کاربردی ASP.NET MVC 4 (قسمت پنجم: بخش دوم helperها)
قسمت پنجم :
در کدهای cshtml هم یک فرم ساده (مشابه شکل بعد) ایجاد می کنیم که شامل سه تکست باکس است:
بد نیست بدانید شکل کامل متد Send چنین است:
رسم نمودار (Chart)توسط کلاس Chart به راحتی می توان به رسم نمودار پرداخت؛ یک مثال ساده چنین است:
سازنده کلاس Chart همچنین می تواند شکل گرافیکی (تم) دلخواه نمودار را تعیین کند؛ خود این کلاس چند تم به رنگ های مختلف دارد؛ همچنین شما می توانید قالب دلخواه خود را داشته باشید. به طور نمونه اگر مثال بالا را این گونه تغییر دهید:
رسم نمودار با داده های دیتابیسبه طور معمول در پروژه های خود می خواهیم داده های یک جدول از بانک اطلاعات را به شکل نمودار نشان دهیم؛ کلاس Chart دو متد برای این کار تدارک دیده است: اول: متد DataBindTable برای ایجاد نمودار بر اساس دو فیلد (افقی و عمودی)؛ دوم: متد DataBindCrossTable برای ایجاد نمودار بر اساس سه فیلد (افقی، عمودی و فیلدی برای تعیین گروه بندی).
قبل از هرچیز باید یادآور شوم که من به جدول Students (که در قسمت قبلی این مقاله معرفی کردم) یک فیلد به نام Average اضافه کردم که معدل دانش آموز را نگه می دارد؛ سپس دو کلاس کوچک ذیل را به مدل خود (StudentsDB.cs) اضافه کردم:
برای استفاده از متد DataBindTable ابتدا متد زیر را به کنترلر خود اضافه کنید:
مثال ها کاملا روشن است و نیاز به توضیح نیست؛ فقط یادآور می شوم که متد DataBindTable یک شیء از نوع IEnumerable را به عنوان پارامتر می پذیرد؛ همچنین این متد چون روی دو فیلد کار می کند، فقط کافی است متد افقی (xField) آن را تعیین کرد، فیلد دیگر به طور خودکار داده های عمودی را نشان خواهد داد.
متد DataBindCrossTable نیز مشابه همین است؛ با این تفاوت که شما به یک فیلد اضافی برای گروه بندی نیاز دارید؛ برای استفاده از این متد، ابتدا متد زیر را به کنترلر خود اضافه کنید:
در این بخش به دو مورد دیگر از کاربرد کتابخانه System.Web.Helpers پرداخته و خواهیم آموخت که چگونه با استفاده از آن، می توان به راحتی به ارسال ایمیل و استفاده از نمودار (Chart) در پروژه های خود پرداخت. ضمنا یادآوری کنم که این بخش در واقع تکمیل پروژه قبلی است و پروژه جدیدی ایجاد نمی کنیم.
ارسال ایمیل
برای ارسال ایمیل از کلاس WebMail استفاده می کنیم؛ روش کار هم ساده است؛ ابتدا دو متد ذیل را به کنترلر HelperController.cs بیافزایید:
public ActionResult SendMail() { return View(); } [HttpPost] public ActionResult SendMail2() { try { var subject = Request["txtSubject"]; var to = Request["txtTo"]; var message = Request["txtMessage"]; WebMail.SmtpServer = "mail.domain.com"; WebMail.SmtpPort = 25; WebMail.EnableSsl = true; WebMail.UserName = "username"; WebMail.Password = "password"; WebMail.From = "your@email.com"; WebMail.Send(to: to, subject: subject, body: message); ViewBag.Message = "ایمیل فرستاده شد"; } catch (Exception ex) { ViewBag.Message = "خطا: " + ex.Message; } return View("SendMail"); }بر روی متد اول کلیک راست کرده و با انتخاب Add View... یک View خالی ایجاد کنید؛ سپس کد cshtml ذیل را در آن بنویسید:
@{ ViewBag.Title = "SendMail"; } @using (Html.BeginForm("SendMail2", "Helper", FormMethod.Post)) { <fieldset style="direction:rtl"> <legend>فرستادن ایمیل:legend> <p>موضوع:<input type="text" name="txtSubject" />p> <p>گیرنده:<input type="text" name="txtTo" />p> <p><textarea name="txtMessage" cols="45" rows="4">textarea>p> <input type="submit" value="فرستادن" /> fieldset> if (IsPost) { <span>@ViewBag.Messagespan> } }توضیح: متد اول فقط برای رفتن به صفحه فرستادن ایمیل است؛ اما در متد دوم که کار ارسال ایمیل را انجام می دهد، ابتدا سه متغیر اعلان کردیم که موضوع، گیرنده و متن پیام ایمیل را از TextBoxها می گیرد؛ سپس مشخصات سرور، نام کاربری، رمز عبور و... را مشخص می کنیم (طبق مشخصاتی که هاست شما به شما می دهد)؛ آنگاه با استفاده از متد Send ایمیل را می فرستیم.
در کدهای cshtml هم یک فرم ساده (مشابه شکل بعد) ایجاد می کنیم که شامل سه تکست باکس است:
بد نیست بدانید شکل کامل متد Send چنین است:
public static void Send(string to, string subject,
string body,
string from = null, string cc = null,
IEnumerablefilesToAttach = null,
bool isBodyHtml = true,
IEnumerableadditionalHeaders = null,
string bcc = null, string contentEncoding = null,
string headerEncoding = null,
string priority = null, string replyTo = null);
رسم نمودار (Chart)توسط کلاس Chart به راحتی می توان به رسم نمودار پرداخت؛ یک مثال ساده چنین است:
@{ ViewBag.Title = "ChartBasic"; } <h2>ChartBasich2> @{ var chart = new Chart(width: 600, height: 400) .AddTitle("Students positions:") .AddSeries( name: "Student", xValue: new[] {"Ali", "Mohammad", "Mehdi", "Ahmad", "Hasan"}, yValues: new[] { "18", "18.50", "19", "16", "17" }) .Write(); }در این مثال از دو آرایه برای مقادیر افقی و عمودی استفاده شده است؛ شکل ذیل اجرای آن را نشان می دهد:
البته در متد AddSeries می توان نوع نمودار (Column, Bar, Pie, Stock,...) را نیز مشخص کرد؛ اگر مثال بالا را این گونه تغییر دهید:
شکل ذیل را خواهید داشت:
.AddSeries( name: "Student", chartType:"Pie", ....
سازنده کلاس Chart همچنین می تواند شکل گرافیکی (تم) دلخواه نمودار را تعیین کند؛ خود این کلاس چند تم به رنگ های مختلف دارد؛ همچنین شما می توانید قالب دلخواه خود را داشته باشید. به طور نمونه اگر مثال بالا را این گونه تغییر دهید:
var chart = new Chart(شکل ذیل را خواهید داشت:
width: 600, height: 400, theme: ChartTheme.Vanilla3D
) ....
رسم نمودار با داده های دیتابیسبه طور معمول در پروژه های خود می خواهیم داده های یک جدول از بانک اطلاعات را به شکل نمودار نشان دهیم؛ کلاس Chart دو متد برای این کار تدارک دیده است: اول: متد DataBindTable برای ایجاد نمودار بر اساس دو فیلد (افقی و عمودی)؛ دوم: متد DataBindCrossTable برای ایجاد نمودار بر اساس سه فیلد (افقی، عمودی و فیلدی برای تعیین گروه بندی).
قبل از هرچیز باید یادآور شوم که من به جدول Students (که در قسمت قبلی این مقاله معرفی کردم) یک فیلد به نام Average اضافه کردم که معدل دانش آموز را نگه می دارد؛ سپس دو کلاس کوچک ذیل را به مدل خود (StudentsDB.cs) اضافه کردم:
public class ChartData { public string FirstName { get; set; } public double Average { get; set; } } public class ChartData2 { public string FirstName { get; set; } public DateTime BirthDate { get; set; } public double Average { get; set; } }شما هم بهتر است این تغییرات را انجام داده پروژه را Build کرده و سپس به ادامه کار بپردازید:
برای استفاده از متد DataBindTable ابتدا متد زیر را به کنترلر خود اضافه کنید:
public ActionResult ChartAdvanced() { var avs = from s in db.Students.Take(6) select new ChartData { FirstName= s.FirstName, Average= s.Average }; return View(avs.ToList()); }سپس بر روی متد کلیک راست کرده و با انتخاب AddView... یک View ساده به پروژه افزوده و کد cshtml آن را این گونه بنویسید:
@model IEnumerable<MyHelpers.Models.ChartData> @{ ViewBag.Title = "ChartAdvanced"; var chart = new Chart(width: 600, height: 400) .AddTitle("معدل") .DataBindTable(dataSource: Model, xField: "FirstName") .Write(); }شکل ذیل نتیجه کار را نشان می دهد:
مثال ها کاملا روشن است و نیاز به توضیح نیست؛ فقط یادآور می شوم که متد DataBindTable یک شیء از نوع IEnumerable را به عنوان پارامتر می پذیرد؛ همچنین این متد چون روی دو فیلد کار می کند، فقط کافی است متد افقی (xField) آن را تعیین کرد، فیلد دیگر به طور خودکار داده های عمودی را نشان خواهد داد.
متد DataBindCrossTable نیز مشابه همین است؛ با این تفاوت که شما به یک فیلد اضافی برای گروه بندی نیاز دارید؛ برای استفاده از این متد، ابتدا متد زیر را به کنترلر خود اضافه کنید:
public ActionResult ChartAdvanced2() { var avs = from s in db.Students select new ChartData2 { FirstName = s.FirstName, BirthDate=s.BirthDate, Average = s.Average }; return View(avs.ToList()); }بر روی متد کلیک راست کرده و با انتخاب AddView... یک ویو به پروژه خود افزوده و کد آن را این گونه اصلاح کنید:
@model IEnumerable<MyHelpers.Models.ChartData2> @{ ViewBag.Title = "ChartAdvanced2"; var chart = new Chart(width: 800, height: 300) .AddTitle("معدل ها بر اساس سن") .DataBindCrossTable(dataSource: Model,
groupByField: "FirstName", xField: "BirthDate", yFields: "Average") .Write(); }
شکل ذیل هم نتیجه کار را نشان می دهد:
+ نوشته شده در ۱۳۹۲/۰۱/۱۲ ساعت 0:51 توسط آرش وهابی
|
a day without learning is a lost day