تحميل ej2 aspmvc ej1compatibility - ej2 aspmvc ej1compatibility تنزيل كود المصدر

توافق Syncfusion Essential JS 1 وEssential JS 2 ASP.Net MVC

الغرض التجريبي هذا هو تجنب مشكلات توافق EJ1 وEJ2.

حل

تساعدك الإعدادات أدناه على عرض مكونات EJ1 وEJ2 Syncfusion في تطبيق ASP.NET MVC بصفحة واحدة.

إضافة التطبيق

يمكنك إنشاء عناصر تحكم Essential JS 1 وEssential JS 2 باستخدام روابط البدء أدناه

البدء في التحكم في EJ2 ASPMVC
البدء في التحكم في EJ1 ASPMVC

توافق النمط

إضافة أنماط التوافق. لدينا نمط توافق Essential JS 1 وEssential JS 2 والذي لن يؤثر على بعضهما البعض.

" style=";text-align:right;direction:rtl">

 
    @* Syncfusion Essential JS 1 Styles *@
    @Styles.Render("https://cdn.syncfusion.com/16.1.0.24/js/web/bootstrap-theme/ej.web.all.compatibility.min.css")

    @* Syncfusion Essential JS 2 Styles *@
    @Styles.Render("https://cdn.syncfusion.com/ej2/styles/compatibility/material.css")

توافق البرامج النصية

قم بإضافة نصوص برمجية لـ Essential JS 1 وEssential JS 2 على النحو التالي.

@* Syncfusion Essential JS 2 Scripts *@ " style=";text-align:right;direction:rtl">

 @* Syncfusion Essential JS 1 Scripts *@




@* Syncfusion Essential JS 2 Scripts *@

ملحوظة: تحتاج إلى إضافة برنامج ej1 قبل برامج ej2 وإلا فسوف يؤدي ذلك إلى حدوث خطأ في البرنامج النصي.

إضافة التوافق

لتحقيق هذا المتطلب، تحتاج إلى استخدام الكود أدناه في صفحة _Layout.cshtml . لأن EJ1 وEJ2 لهما نفس أسماء المكتبات لتنفيذ إجراءات مختلفة. لذلك قد تحدث تعارضات عندما نشير إلى كلا عنصري التحكم في نفس التطبيق. للتغلب على هذا نحتاج إلى توسيع هذه المكتبات في مساحة الاسم ej.

إضافة مدير البرنامج النصي

تحديد مدير البرامج النصية لكل من Essential JS 1 وEssential JS 2

 @Html.EJ().ScriptManager()
@Html.EJS().ScriptManager()

وأخيرا، تبدو صفحة التخطيط كما يلي:

@* Syncfusion Essential JS 1 Styles *@ @Styles.Render("http://cdn.syncfusion.com/16.3.0.21/js/web/flat-azure/ej.web.all.min.css") @* Syncfusion Essential JS 2 Styles *@ @Styles.Render("https://cdn.syncfusion.com/ej2/styles/compatibility/material.css") @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/bootstrap") @Scripts.Render("~/Scripts/jsrender.min.js") @* Syncfusion Essential JS 1 Scripts *@ @Scripts.Render("~/Scripts/ej/web/ej.web.all.min.js") @* Syncfusion Essential JS 2 Scripts *@ @Scripts.Render("~/Scripts/ej2/ej2.min.js") @RenderSection("scripts", required: false) @Html.EJ().ScriptManager() @Html.EJS().ScriptManager()

@RenderBody()

" style=";text-align:right;direction:rtl">

 
    
    
    @* Syncfusion Essential JS 1 Styles *@
    @Styles.Render("http://cdn.syncfusion.com/16.3.0.21/js/web/flat-azure/ej.web.all.min.css")
    @* Syncfusion Essential JS 2 Styles *@
    @Styles.Render("https://cdn.syncfusion.com/ej2/styles/compatibility/material.css")



    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/Scripts/jsrender.min.js")
    @* Syncfusion Essential JS 1 Scripts *@
    @Scripts.Render("~/Scripts/ej/web/ej.web.all.min.js")
    @* Syncfusion Essential JS 2 Scripts *@
    @Scripts.Render("~/Scripts/ej2/ej2.min.js")
    @RenderSection("scripts", required: false)

    
     
    @Html.EJ().ScriptManager()
    @Html.EJS().ScriptManager()

    
        @RenderBody()

أعلن عن التحكم الأساسي في JS 1 والتحكم الأساسي في JS 2

يمكنك تهيئة عناصر التحكم Essential JS 1 وEssential JS 2 باستخدام البدء. المقتطف أدناه قمنا بتهيئة عناصر تحكم واجهة المستخدم Eessential JS 1 & Essential JS 2 ASP.NET MVC.

)ViewBag.gridData) .AllowPaging().PageSettings(page => page.PageSize(4)) .Columns(col => { col.Field("OrderID").HeaderText("Order ID").TextAlign(TextAlign.Right).Width(75).Add(); col.Field("CustomerID").HeaderText("CustomerID").Width(80).Add(); col.Field("ShipName").HeaderText("ShipName").Width(100).Add(); col.Field("ShipCity").HeaderText("ShipCity").Width(100).Add(); col.Field("Freight").Format("{0:c3}").HeaderText("Freight").Width(80).TextAlign(TextAlign.Right).Add(); }) )