معرفی DNTBreadCrumb
فرصتی پیدا شد تا قالب سایت، با بوت استرپ 3 انطباق داده شود و در این بین یکی از کمبودهایی که احساس میشد، نبود bread crumb و مشخص نبودن عمق صفحهی جاری مورد مطالعه، در قسمتهای مختلف سایت بود:
پس از بررسی نمونههای bread crumbs موجود، مشکلی که اکثر آنها داشتند یا استفاده از سشن جهت تشکیل لیست آیتمها (سشن در سایت جاری غیرفعال است) و یا بیش از اندازه پیچیده بودن آنها بود. به همین جهت یک نمونهی سادهتر و سبکتر تهیه شد که در ذیل نحوهی نصب و استفادهی آنرا بررسی خواهیم کرد.
نصب DNTBreadCrumb
برای نصب این bread crumb مبتنی بر بوت استرپ 3، تنها کافی است دستور ذیل را در کنسول پاورشل نیوگت صادر کنید:
PM> install-package DNTBreadCrumb
تنظیمات اولیهی DNTBreadCrumb
پس از نصب، علاوه بر فایل اسمبلی DNTBreadCrumb، فایل جدید Views\Shared\_BreadCrumb.cshtml نیز به پروژهی شما اضافه میشود. این فایل، لیست نهایی آیتمهای تنظیم شدهی توسط اکشن متدها را به صورت یک bread crumb رندر میکند. مزیت کار کردن با فایلهای cshtml (بجای HTML Helperها)، امکان سفارشی سازی نهایی آنها توسط استفاده کنندهاست.
بنابراین برای نمایش لیست bread crumb تنها کافی است یک سطر ذیل را به فایل layout برنامه اضافه کنید:
@{Html.RenderPartial("_BreadCrumb");}
طراحی یک bread crumb سه سطحی
اگر به فایل Views\Shared\_BreadCrumb.cshtml مراجعه کنید، مشاهده خواهید کرد که سطح اول bread crumb یا همان نمایش Home، به صورت پیش فرض قرار داده شدهاست و در اینجا اگر میخواهید نام دیگری را بجای Home (مثلا خانه) تنظیم کنید، به سادگی قابل انجام است.
دو سطح بعدی یک bread crumb، نام کنترلر و سپس نام اکشن متد خواهند بود:
[BreadCrumb(Title = "News Root", UseDefaultRouteUrl = true, RemoveAllDefaultRouteValues = true, Order = 0, GlyphIcon = "glyphicon glyphicon-link")] public class NewsController : Controller { [BreadCrumb(Title = "Main index", Order = 1)] public ActionResult Index(string id) { if (!string.IsNullOrWhiteSpace(id)) { this.SetCurrentBreadCrumbTitle(id); } return View(); }
کار با تنظیم Title یا همان عناوینی که در لینکهای bread crumb ظاهر میشوند، شروع خواهد شد. سپس اگر علاقمند بودید، میتوانید یک گلیف آیکن را نیز در اینجا مشخص کنید تا در bread crumb نهایی، کنار عنوان مشخص شده، رندر شود.
هر ویژگی BreadCrumb دارای خاصیت Url نیز هست. اما با توجه به اینکه میتوان از طریق مسیریابیهای پیش فرض، این آدرسها را پیدا کرد، نیازی به ذکر آنها نیست. برای مثال تنظیم UseDefaultRouteUrl در BreadCrumb یک کنترلر، مقدار Url مرتبط با آنرا به صورت خودکار از مسیریابی پیش فرض آن دریافت و محاسبه میکند. خاصیت RemoveAllDefaultRouteValues به این معنا است که اگر در اکشن متد index، مقدار id تنظیم شده بود، نیازی نیست تا حین تشکیل آدرس ریشهی کنترلر، این مقدار نیز لحاظ شود.
و ... همین مقدار تنظیم، برای کار با این سیستم کافی است.
موارد تکمیلی
- نیاز است عنوان bread crumb به صورت پویا تنظیم شود. چگونه اینکار را انجام دهیم؟
برای اینکار میتوانید از متد الحاقی SetCurrentBreadCrumbTitle استفاده کنید. برای نمونه تصویر ابتدای مطلب نیز به همین ترتیب تولید شدهاست. در اینجا عنوان پویای مقاله، توسط متد SetCurrentBreadCrumbTitle بجای Title پیش فرض bread crumb تنظیم شدهاست.
- چگونه میتوان بیش از سه سطح را تعریف کرد؟
برای تعریف بیش از سه سطح پیش فرض خانه/کنترلر/اکشن متد، میتوانید از متد الحاقی AddBreadCrumb استفاده کنید:
[BreadCrumb(Title = "News Archive", Order = 2)] public ActionResult Archive(int? id) { if (id != null) { this.SetCurrentBreadCrumbTitle(string.Format("News item {0}", id.Value)); this.AddBreadCrumb(new BreadCrumb { Title = "News Archive", Order = 1, Url = Url.Action("Archive", "News", routeValues: new { id = "" }) }); } return View(); }
سورس کامل مثالهای مطرح شدهی در این مطلب را در پروژهی MVCBreadCrumbTest میتوانید مشاهده کنید.
مشکل در مقدار PageIndex در کد Jquery فایل ajax.methods.js تابع sorting
function resetSearch(progressId, form, pagerId, container, sortId, sortOrderId, pageSizeId) { $(pagerId).closest('.row').hide(); $(progressId).css("display", "block"); $(pagerId).data("page", 2); $(sortId).val($(sortId + " option:first").val()); $(sortOrderId).val($(sortOrderId + " option:first").val()); $(pageSizeId).val($(pageSizeId + " option:first").val()); $(form).find("input[type=text], textarea").val(""); $(form).find("select").each(function(key, val) { $(this).val($(this).find('option:first').val()); }); $(form).find('#PageIndex').val(1); $(form).find('#PageSize').val($(pageSizeId).val()); $(form).find('#CurrentSort').val($(sortId).val()); $(form).find('#SortDirection').val($(sortOrderId).val()); $(form).find('#PageIndex').val(1); $(container).html(""); $(form).submit(); }
.NET 5 Preview 7 is now available and is ready for evaluation. Here’s what’s new in this release:
- Blazor WebAssembly apps now target .NET 5
- Updated debugging requirements for Blazor WebAssembly
- Blazor accessibility improvements
- Blazor performance improvements
- Certificate authentication performance improvements
- Sending HTTP/2 PING frames
- Support for additional endpoints types in the Kestrel sockets transport
- Custom header decoding in Kestrel
- Other minor improvements
- Success
- Error
- Warning
- Verbose
- Debug
- Information
cmdlet | Name | Id |
Write-Output | Success | 1 |
Write-Error | Error | 2 |
Write-Warning | Warning | 3 |
Write-Verbose | Verbose | 4 |
Write-Debug | Debug | 5 |
Write-Information | Information | 6 |
به جز دو مورد اول، بقیه cmdletها خروجی را به صورت پیشفرض درون کنسول نمایش نمیدهند. به عنوان مثال اسکریپت زیر را در نظر بگیرید:
Write-Output 'Output' Write-Error 'This is an error' Write-Warning 'This is a warning' Write-Verbose 'This is verbose' Write-Debug 'This is Debug' Write-Information 'This is information'
با اجرای اسکریپت فوق خروجی زیر را خواهیم داشت:
Output Write-Error: This is an error WARNING: This is a warning
همانطور که مشاهده میکنید سه cmdlet فوق، خروجی را درون کنسول نمایش ندادهاند. این رفتار توسط مفهومی تحت عنوان Action Preference قابل تنظیم است که در واقع یک Enum است با مقدار زیر:
6 | Break | |
رخداد به صورت عادی مدیریت شده و برنامه ادامه پیدا میکند | 2 | Continue |
به طور کلی از رخداد صرفنظر خواهد شد؛ بدون اینکه چیزی در استریم نمایش داده شود | 4 | Ignore |
سوال پرسیده خواهد شد که برنامه را ادامه دهد یا متوقف کند | 3 | Inquire |
به طور کلی از رخداد صرفنظر خواهد شد | 0 | SilentlyContinue |
دستور را متوقف خواهد کرد | 1 | Stop |
دستور به نوعی معلق خواهد شد | 5 | Suspend |
بنابراین با تغییر Action Preference برای هر کدام از cmdletها میتوانیم رفتار اسکریپت قبلی را تغییر دهیم:
Write-Output 'Output' Write-Error 'This is an error' Write-Warning 'This is a warning' $VerbosePreference = 'Continue' Write-Verbose 'This is verbose' $DebugPreference = 'Continue' Write-Debug 'This is Debug' $InformationPreference = 'Continue' Write-Information 'This is information'
اکنون اگر اسکریپت فوق را اجرا کنید، سه خروجی آخر را نیز مشاهده خواهید کرد:
Output Write-Error: This is an error WARNING: This is a warning VERBOSE: This is verbose DEBUG: This is Debug This is information
هر کدام از استریمهای فوق قابل redirect شدن نیز هستند؛ برای اینکار میتوانیم از redirect operatorهایی که در PowerShell پشتیبانی میشود استفاده کنیم:
> >> >&1
به عنوان مثال میتوانیم تمام خطاها یا هشدارهای درون یک اسکریپت را به یک فایل منتقل کنیم:
./script.ps1 2>&1 > .\logs.txt
یا میتوانیم تمام Success streamها را به یک فایل هدایت کنیم:
.\script.ps1 > script.log
ارسال تمام Success, Warning, Errorها به یک فایل:
&{ Write-Warning "hello" Write-Error "hello" Write-Output "hi" } 3>&1 2>&1 > C:\Temp\redirection.log
ارسال تمام استریمها به یک فایل:
.\script.ps1 *> script.log
همچنین میتوانیم استریمی را به اصطلاح suppress کنیم که در خروجی نمایش داده نشود:
./script.ps1 1> $null 2> $null ./script.ps1 *> $null
از تکنیک فوق برای drop کردن خروجیهایی که نمیخواهیم نمایش داده شوند، استفاده میشود. در کد فوق دو Idهای ۱ و ۲ را به متغیر ویژهی null هدایت کردهایم؛ همچنین میتوانستیم از یک رشتهی خالی نیز بجای null استفاده کنیم. در خط بعدی از * استفاده کردهایم که به معنای تمامی استریمهای موجود است؛ با اینکار چیزی در خروجی نمایش داده نخواهد شد. یک روش دیگر برای drop کردن، استفاده از دستور Out-Null است:
Get-ChildItem | Out-Null
لازم به ذکر است که این cmdlet تا قبل از نسخه ۶ خیلی کند بود؛ زیرا همانند دیگر cmdletهای درون pipeline میبایست یک ورودی (InputObject) را دریافت کند که باعث میشد هزینهی پردازشی بالایی داشته باشد. اما در نسخه ۶ به بعد این مشکل رفع شدهاست و پارزر به محض رسیدن به این keyword به صورت کلی خروجی را discard میکند بدون اینکه Out-Null را فراخوانی کند؛ در واقع این cmdlet یک hint برای پارزر است. روش دیگر برای drop کردن خروجی، انتساب نتیجه یک دستور به متغییر null است:
New-Item -Type Directory -Path $path | Out-Null $null = New-Item -Type Directory -Path $path
همچنین میتوانیم خروجی یک دستور را به void تبدیل کنیم؛ که نتیجه مشابه با تکنیکهای فوق دارد:
[void](New-Item -Name test -ItemType Directory)
یک نکته در مورد Out-Null
در loopهای بزرگ ممکن است Out-Null حتی در PowerShell 7.x هم کند عمل کند:
PS > Measure-Command { for($i=0; $i -lt 1mb; $i++) { $i | Out-Null } } | Select-Object TotalSeconds TotalSeconds ------------ 4.3056315 PS > Measure-Command { for($i=0; $i -lt 1mb; $i++) { $null = $i } } | Select-Object TotalSeconds TotalSeconds ------------ 1.1210884 PS > Measure-Command { for($i=0; $i -lt 1mb; $i++) { [void]$i } } | Select-Object TotalSeconds TotalSeconds ------------ 1.130507 PS > Measure-Command { for($i=0; $i -lt 1mb; $i++) { $i > $null } } | Select-Object TotalSeconds TotalSeconds ------------ 1.3832427
تزریق خودکار وابستگیها در برنامههای ASP.NET MVC
public class HomeController : Controller { public readonly ITABMPCREWService aa ; public HomeController(ITABMPCREWService tabmpcrewService) { aa = tabmpcrewService; } public ActionResult Index() { TABMPCREWS tt = new TABMPCREWS() { DTLASTUPDATEDDATE = DateTime.Now, INTOTRATE = 122, INTRATE = 215, VCCODEDESCRIPTION = "fff858699", VCCODEVALUE = "fff858699", VCLASTUSERID = "fff858699", INTCREWCODE = 105652 }; aa.Add(tt); ViewBag.Message = "Welcome to ASP.NET MVC!"; return View(); } public ActionResult About() { ViewBag.Message = "Your app description page."; return View(); } public ActionResult Contact() { ViewBag.Message = "Your contact page."; return View(); } } }
StructureMap Exception Code: 202 No Default Instance defined for PluginFamily ServiceLayer.
ممنون میشم من را راهنمایی کنید.
columns: [ { field: "IsAvailable", title: "موجود است", template: '<input type="checkbox" #= IsAvailable ? checked="checked" : "" # disabled="disabled" ></input>' } ]
همانطور که در این مثال نیز مشاهده میکنید، قالبهای Kendo UI از Hash (#) syntax استفاده میکنند. در اینجا قسمتهایی از قالب که با علامت # محصور میشوند، در حین اجرا، با اطلاعات فراهم شده جایگزین خواهند شد.
برای رندر مقادیر ساده میتوان از # =# استفاده کرد. از # :# برای رندر اطلاعات HTML-encoded کمک گرفته میشود و # # برای رندر کدهای جاوا اسکریپتی کاربرد دارد. از حالت HTML-encoded برای نمایش امن اطلاعات دریافتی از کاربران و جلوگیری از حملات XSS استفاده میشود.
اگر در این بین نیاز است # به صورت معمولی رندر شود، در حالت کدهای جاوا اسکریپتی به صورت #\\ و در HTML ساده به صورت #\ باید مشخص گردد.
مثالی از نحوهی تعریف یک قالب Kendo UI
<!--دریافت اطلاعات از منبع محلی--> <script id="javascriptTemplate" type="text/x-kendo-template"> <ul> # for (var i = 0; i < data.length; i++) { # <li>#= data[i] #</li> # } # </ul> </script> <div id="container1"></div> <script type="text/javascript"> $(function () { var data = ['User 1', 'User 2', 'User 3']; var template = kendo.template($("#javascriptTemplate").html()); var result = template(data); //Execute the template $("#container1").html(result); //Append the result }); </script>
در ادامه باید این قالب را رندر کرد. برای این منظور یک div با id مساوی container1 را جهت تعیین محل رندر نهایی اطلاعات مشخص میکنیم. سپس متد kendo.template بر اساس id قالب اسکریپتی تعریف شده، یک شیء قالب را تهیه کرده و سپس با ارسال آرایهای به آن، سبب اجرای آن میشود. خروجی نهایی، یک قطعه کد HTML است که در محل container1 درج خواهد شد.
همانطور که ملاحظه میکنید، متد kendo.template، نهایتا یک رشته را دریافت میکند. بنابراین همینجا و به صورت inline نیز میتوان یک قالب را تعریف کرد.
کار با منابع داده راه دور
فرض کنید مدل برنامه به صورت ذیل تعریف شدهاست:
namespace KendoUI04.Models { public class Product { public int Id { set; get; } public string Name { set; get; } public decimal Price { set; get; } public bool IsAvailable { set; get; } } }
using System.Collections.Generic; using System.Linq; using System.Web.Http; using KendoUI04.Models; namespace KendoUI04.Controllers { public class ProductsController : ApiController { public IEnumerable<Product> Get() { return ProductDataSource.LatestProducts.Take(10); } } }
<!--دریافت اطلاعات از سرور--> <div> <div id="container2"><ul></ul></div> </div> <script id="template1" type="text/x-kendo-template"> <li> #=Id# - #:Name# - #=kendo.toString(Price, "c")#</li> </script> <script type="text/javascript"> $(function () { var producatsTemplate1 = kendo.template($("#template1").html()); var productsDataSource = new kendo.data.DataSource({ transport: { read: { url: "api/products", dataType: "json", contentType: 'application/json; charset=utf-8', type: 'GET' } }, error: function (e) { alert(e.errorThrown); }, change: function () { $("#container2 > ul").html(kendo.render(producatsTemplate1, this.view())); } }); productsDataSource.read(); }); </script>
هرچند خروجی دریافتی از سرور نهایتا یک آرایه از اشیاء Product است، اما در template1 اثری از حلقهی جاوا اسکریپتی مشاهده نمیشود. در اینجا چون از متد kendo.render استفاده میشود، نیازی به ذکر حلقه نیست و به صورت خودکار، به تعداد عناصر آرایه دریافتی از سرور، قطعه HTML قالب را تکرار میکند.
در ادامه برای کار با سرور از یک Kendo UI DataSource استفاده شدهاست. قسمت transport/read آن، کار تعریف محل دریافت اطلاعات را از سرور مشخص میکند. رویدادگران change آن اطلاعات نهایی دریافتی را توسط متد view در اختیار متد kendo.render قرار میدهد. در نهایت، قطعهی HTML رندر شدهی نهایی حاصل از اجرای قالب، در بین تگهای ul مربوط به container2 درج خواهد شد.
رویدادگران change زمانیکه data source، از اطلاعات راه دور و یا یک آرایهی جاوا اسکریپتی پر میشود، فراخوانی خواهد شد. همچنین مباحث مرتب سازی اطلاعات، صفحه بندی و تغییر صفحه، افزودن، ویرایش و یا حذف اطلاعات نیز سبب فراخوانی آن میگردند. متد view ایی که در این مثال فراخوانی شد، صرفا در روال رویدادگردان change دارای اعتبار است و آخرین تغییرات اطلاعات و آیتمهای موجود در data source را باز میگرداند.
یک نکتهی تکمیلی: فعال سازی intellisense کدهای جاوا اسکریپتی Kendo UI
اگر به پوشهی اصلی مجموعهی Kendo UI مراجعه کنید، یکی از آنها vsdoc نام دارد که داخل آن فایلهای min.intellisense.js و vsdoc.js مشهود هستند.
اگر از ویژوال استودیوهای قبل از 2012 استفاده میکنید، نیاز است فایلهای vsdoc.js متناظری را به پروژه اضافه نمائید؛ دقیقا در کنار فایلهای اصلی js موجود. اگر از ویژوال استودیوی 2012 و یا بالاتر استفاده میکنید باید از فایلهای intellisense.js متناظر استفاده کنید. برای مثال اگر از kendo.all.min.js کمک میگیرید، فایل متناظر با آن kendo.all.min.intellisense.js خواهد بود.
بعد از اینکار نیاز است فایلی به نام references.js_ را به پوشهی اسکریپتهای خود با این محتوا اضافه کنید (برای VS 2012 به بعد):
/// <reference path="jquery.min.js" /> /// <reference path="kendo.all.min.js" />
Tools menu –> Options -> Text Editor –> JavaScript –> Intellisense –> References
کدهای کامل این قسمت را از اینجا میتوانید دریافت کنید:
KendoUI04.zip
<div> @(Html.Kendo().TreeView() .Name("treeview") .TemplateId("treeview-template") .HtmlAttributes(new { @class = "demo-section" }) .DragAndDrop(true) .BindTo(Model.Where(e=>e.ParentFolderID==null).OrderBy(e=>e.Order), mappings => { mappings.For<DAL.Folder>(binding => binding .ItemDataBound((item, folder) => { item.Text = folder.FolderName; item.SpriteCssClasses = "folder"; item.Expanded=true; item.Id = folder.FolderID.ToString(); }) .Children(folder => folder.Folder1)); mappings.For<DAL.Folder>(binding => binding .ItemDataBound((item, folder) => { item.Text = folder.FolderName; item.SpriteCssClasses = " folder"; item.Expanded = true; item.Id = folder.FolderID.ToString(); })); }) ) </div>
<style type="text/css" scoped> .demo-section { width: 200px; } #treeview .k-sprite ,#treeview2 .k-sprite { background-image: url("@Url.Content("/Content/kendo/images/coloricons-sprite.png")"); } .rootfolder { background-position: 0 0; } .folder { background-position: 0 -16px; } .pdf { background-position: 0 -32px; } .html { background-position: 0 -48px; } .image { background-position: 0 -64px; } .delete-link,.edit-link { width: 12px; height: 12px; overflow: hidden; display: inline-block; vertical-align: top; margin: 2px 0 0 3px; -webkit-border-radius: 5px; -mox-border-radius: 5px; border-radius: 5px; } .delete-link{ background: transparent url("@Url.Content("/Content/kendo/images/close.png")") no-repeat 50% 50%; } .edit-link{ background: transparent url("@Url.Content("/Content/kendo/images/edit.png")") no-repeat 50% 50%; } </style>
<a href="#" id="serialize">ذخیره</a>
$('#serialize').click(function () { serialized = serialize(); window.location.href = "Folder/SaveMenu?serial=" + serialized + "!"; }); function serialize() { var tree = $("#treeview").data("kendoTreeView"); var json = treeToJson(tree.dataSource.view()); return JSON.stringify(json); } function treeToJson(nodes) { return $.map(nodes, function (n, i) { var result = { id: n.id}; //var result = { text: n.text, id: n.id, expanded: n.expanded, checked: n.checked }; if (n.hasChildren) result.items = treeToJson(n.children.view()); return result; }); }
var tree = $("#treeview").data("kendoTreeView"); var json = treeToJson(tree.dataSource.view());
var result = { id: n.id}; //var result = { text: n.text, id: n.id, expanded: n.expanded, checked: n.checked }; if (n.hasChildren) result.items = treeToJson(n.children.view());
return JSON.stringify(json);
window.location.href = "Folder/SaveMenu?serial=" + serialized + "!";
"[{\"id\":\"2\"},{\"id\":\"5\",\"items\":[{\"id\":\"3\"},{\"id\":\"6\"},{\"id\":\"7\"}]}]!"
همانطور که میبینید گره دوم که "پوشه چهارم45" نام دارد شامل سه فرزند است که در رشته داده شده با عنوان item شناخته شده است. حال باید این رشته با برنامه نویسی سی شارپ جداسازی کرد :
string serialized; Dictionary<int, int> numbers = new Dictionary<int, int>();
public ActionResult SaveMenu(string serial) { var newfolders = new List<Folder>(); serialized = serial; calculte_serialized(0); return RedirectToAction("Index"); }
void calculte_serialized(int parent) { while (serialized.Length > 0) { var id_index=serialized.IndexOf("id"); if (id_index == -1) { return; } serialized = serialized.Substring(id_index + 5); var quote_index = serialized.IndexOf("\""); var id=serialized.Substring(0, quote_index); numbers.Add(int.Parse(id), parent); serialized = serialized.Substring(quote_index); var condition = serialized.Substring(0,3); switch (condition) { case "\"},": break; case "\",\"": calculte_serialized(int.Parse(id)); break; case "\"}]": return; break; default: break; } } }
calculte_serialized با گرفتن 0 کار خود را شروع میکند یعنی از گره هایی که پدر ندارند و تمام idها را همراه با پدرشان در یک دیکشنری میریزد و هرکجا که به فرزندی برخورد به صورت بازگشتی فراخوانی میشود. پس از اجرای کامل آن ما درخت را در یک دیکشنری به صورت عنصرهای مجزا در اختیار داریم که میتوانیم در پایگاه داده ذخیره کنیم.
در زامارین 2 نوع layout داریم
FindViewbyid در پارامتر ورودی خود از طریق Resource.id، نام کنترل را دریافت نموده و بصورت Object باز میگرداند که بایستی نتیجه خروجی را به کلاس همان کنترل Cast نماییم:
Button btn = FindViewById<Button>(Resource.Id.button1);
FindViewById<EditText>(Resource.Id.txtname).Text = "";
هر layout یک اکتیویتی مربوط به خودش را دارد. اگر بخواهیم بین فرمهای مختلف حرکت کنیم، به ازای هر فرم، یک Activity کنترل کننده همان فرم را اضافه میکنیم. در یک Activity با ارسال سیگنالی به نام Intent که پارامتر اول آن، Activity مبدا یا This و پارامتر دوم آن، Activity مقصد میباشد. سپس به سیستم عامل اطلاع میدهیم که میخواهیم این سیگنال را ارسال کنیم و ارسال آن با StartActivity میباشد:
Intent _intent = new Intent(this, typeof(Activity2)); StartActivity(_intent);
ارسال پارامتر
جهت ارسال دادههای معمولی bool,double,string,float,long,... و آرایه ای از آن، از دستور PutExtra استفاده میشود:
Intent _intent = new Intent(this, typeof(Activity2)); string Test="Vlaueone"; _intent.PutExtra("mainactivity", Test); StartActivity(_intent);
گرفتن پارامتر
در Activity مقصد، اطلاعات مربوط به سیگنال ارسال شده، در مقادیر Global intent ذخیره میشود و بر اساس نوع داده ارسال شده، تابع GetExtra را مینویسیم:
string Getintent = Intent.GetStringExtra("mainactivity");
ارسال object از کلاسها بین Activityها
در زامارین، object کلاسها را به یک string استاندارد بصورت json تبدیل میکنیم و به این عملیات Serialization گفته میشود. این کار نیز توسط کتابخانههای مختلفی انجام میشود مانند NewtonSoft. سپس رشته json ایجاد شده را با تابع PutExtra، به همراه سیگنال Intent، به Activity دوم پاس میدهیم:
List<Product> products; products = new List<Product>(); Product p = new Product { name = FindViewById<EditText>(Resource.Id.mainedittextname).Text, price = Convert.ToInt32(FindViewById<EditText>(Resource.Id.mainedittextprice).Text) }; products.Add(p); Intent _intent = new Intent(this, typeof(Activity2)); _intent.PutExtra("products", JsonConvert.SerializeObject(products)); StartActivity(_intent);
var p = JsonConvert.DeserializeObject<List<Product>>(Intent.GetStringExtra("products")); foreach (var item in p) { Toast.MakeText(this, $" {item.name} , {item.price}", ToastLength.Long).Show(); };
در ادامه کلاسهای مورد نظر را جهت تعریف در دایرکتوری Model ایجاد میکنیم. مثل کلاس Product که بصورت Public نیز میباشد. از منوی Tools -> Nuget Package Management -> Manage nuget Package for Solution را انتخاب و سپس NewtonSoft را اضافه میکنیم.
AlertDialog زیر کلاس Dialog است که میتواند یک، دو و یا سه دکمه را نمایش دهد. اگر فقط میخواهید یک رشته را در این کادر محاوره ای نمایش دهید، از روش SetMessage استفاده کنید. قطعه کد زیر میتواند برای ایجاد یک AlertDialog ساده با دو دکمه حذف و لغو استفاده شود:
//set alert for executing the task AlertDialog.Builder alert = new AlertDialog.Builder(this); alert.SetTitle("Confirm delete"); alert.SetMessage("Lorem ipsum dolor sit amet, consectetuer adipiscing elit."); alert.SetPositiveButton("Delete", (senderAlert, args) => { Toast.MakeText(this, "Deleted!", ToastLength.Short).Show(); }); alert.SetNegativeButton("Cancel", (senderAlert, args) => { Toast.MakeText(this, "Cancelled!", ToastLength.Short).Show(); }); Dialog dialog = alert.Create(); dialog.Show();
Fragment
public class DialogFragmentActivity : DialogFragment { public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { var dlg = inflater.Inflate(Resource.Layout.layoutDialog, container, false); return dlg; } }
DialogFragmentActivity dlg = new DialogFragmentActivity (); dlg.Show(this.FragmentManager, "Fragment");
public override void OnStart() { base.OnStart(); Dialog dialog = Dialog; if (dialog != null) { dialog.Window.SetLayout(ViewGroup.LayoutParams.MatchParent, ViewGroup.LayoutParams.WrapContent); dialog.Window.SetBackgroundDrawable(new ColorDrawable(Color.Transparent)); } }
public override Dialog OnCreateDialog(Bundle savedInstanceState) { Dialog NotTitle = base.OnCreateDialog(savedInstanceState); NotTitle.Window.RequestFeature(WindowFeatures.NoTitle); return NotTitle; }
در پستهای قبلی مروری بر jQuery داشته و در چند پست انواع روشهای انتخاب عناصر صفحه وب را توسط jQuery بررسی کردیم. در پستهای آینده با مباحث پیشرفتهتری همچون انجام عملیاتی روی المانهای انتخاب شده، خواهیم پرداخت؛ امید است مفید واقع شود.
٢ -٢ - ایجاد عناصر HTML جدید
گاهی اوقات نیاز میشود که یک یا چند عنصر جدید به صفحهی در حال اجرا اضافه شوند. این حالت میتواند به سادگی قرار گرفتن یک متن در جایی از صفحه و یا به پیچیدگی ایجاد و نمایش یک جدول حاوی اطلاعات دریافت شده از بانک اطلاعاتی باشد.
ایجاد عناصر به صورت پویا در یک صفحه در حال اجرا کار ساده ای برای jQuery میباشد، زیرا همانطور که در پست آموزش (jQuery) جی کوئری 1# مشاهده کردیم ()$ با دریافت دستور ساخت یک عنصر HTML آن را در هر زمان ایجاد میکند، دستور زیر :
$("<div>Hello</div>")
دقت کنید که یک راه کوتاهتر نیز برای ایجاد یک عنصر <div> خالی وجود دارد که به شکل زیر است:
$("<div>") // همه اینها معادل هستند
$("<div></div>")
$("<div/>")
برای اینکه مزه اینکار را بچشید بد نیست نگاهی به مثال زیر بیندازید (نگران قسمتهای نامفهوم نباشید به مرور با آنها آشنا خواهیم شد):
$("<div class='foo'>I have foo!</div><div>I don't</div>") .filter(".foo").click(function() { alert("I'm foo!"); }).end().appendTo("#someParentDiv");
برای اجرا این کد میتوانید کد آن را دانلود کرده و فایل chapter2/new.divs.htmlرا اجرا کنید خروجی مانند تصویر زیر خواهد بود:
جهت تکمیل مطلب فعلی یک مثال کاملتر از این سایت جهت بررسی انتخاب کردم:
$( "<div/>", { "class": "test", text: "Click me!", click: function() { $( this ).toggleClass( "test" ); } }).appendTo( "body" );
با توجه به اینکه مطالب بعدی طولانی بوده و تقریبا مبحث جدایی است؛ در پست بعدی به بررسی توابع و متدهای مدیریت مجموعه انتخاب شده خواهیم پرداخت.