ej2 mvc partialview

عرض عناصر تحكم Syncfusion ASP.Net Core UI في صفحة العرض الجزئي لـ MVC

هذا تطبيق تجريبي بسيط لاستخدام عناصر تحكم syncfusion Syncfusion ASP.Net Core UI في صفحة العرض الجزئي.

حل

اتبع الخطوات التالية لعرض التحكم Syncfusion ASP.Net Core UI (Essential JS 2) في عرض جزئي.

قم بإنشاء عنصر تحكم ASP.NET Core باستخدام البدء

https://ej2.syncfusion.com/aspnetcore/documentation/button/getting-started.html

تم إنشاء عناصر تحكم في العرض الجزئي وإضافة مكون Syncfusion إلى صفحة العرض الجزئي

 < p > Use this area to provide additional information. </ p >
< div >
    < h3 > Essential JS 2 Datepicker component </ h3 >
    < ejs-datepicker id =" datepicker " placeholder =" Choose a Date " > </ ejs-datepicker >
</ div >
< br />
< div >
    < h3 > Essential JS 2 Timepicker component </ h3 >
    < ejs-timepicker id =" timepicker " placeholder =" Select a time " > </ ejs-timepicker >
</ div >
< br />
< div >
    < h3 > Essential JS 2 Daterangepicker component </ h3 >
    < ejs-daterangepicker id =" daterangepicker " placeholder =" Choose a Range " > </ ejs-daterangepicker >
</ div >
< br />
< div >
    < h3 > Essential JS 2 Dropdownlist component </ h3 >
    < div >
        < ejs-dropdownlist id =" games " dataSource =" @ViewBag.data " placeholder =" Select a game " index =" 2 " popupHeight =" 220px " >
            < e-dropdownlist-fields text =" Game " value =" Id " > </ e-dropdownlist-fields >
        </ ejs-dropdownlist >
    </ div > </ div > 

تمت إضافة بيانات حقيبة العرض إلى التحكم في العرض الجزئي

 namespace PartialView . Controllers
{
    public class HomeController : Controller
    {
        public IActionResult PartialPage ( )
        {
            ViewBag . data = new string [ ] { "Badminton" , "Basketball" , "Cricket" , "Football" , "Golf" , "Gymnastics" , "Hockey" , "Tennis" } ;
            return PartialView ( ) ;
        }

    }
} 

قم بإنشاء عنصر div لعناصر التحكم الجزئية في الصفحة

 < div class =" row " >
    < div id =" PartialView " > </ div >
    </ div > 

قراءة عناصر التحكم في العرض الجزئي باستخدام Ajax:

 function clickAjax ( ) {
        var ajax = new ej . base . Ajax ( '/PartialPage/index' , 'GET' , true ) ;
        ajax . send ( ) . then ( function ( result ) {
              var fragment = document . createElement ( 'div' ) ;
              fragment . innerHTML = result ;
              ej . base . append ( fragment . children , document . getElementById ( 'PartialView' ) , true ) ;
        } ) ; ;
    }