Página Inicial>Código fonte ASP>Outras categorias
Baixar

Renderizando controles de UI do Syncfusion ASP.Net Core na página de visualização parcial do MVC

Este é um aplicativo de demonstração simples para usar os controles de UI do Syncfusion ASP.Net Core na página de visualização parcial.

Solução

Siga as etapas abaixo para renderizar o controle Syncfusion ASP.Net Core UI (Essential JS 2) em uma visualização parcial.

Crie um controle ASP.NET Core usando os conceitos básicos

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

Criou controles de visualização parcial e adicionou o componente Syncfusion à página de visualização parcial


Essential JS 2 Timepicker component


Essential JS 2 Daterangepicker component


Essential JS 2 Dropdownlist component

">
 < 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 >

Adicionados dados de visualização do saco ao controle de visualização parcial 

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

    }
}

Crie um elemento div para controles parciais de página

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

Leia controles de visualização parcial usando 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 ) ;
        } ) ; ;
    }
Expandir
Informações adicionais
Aplicativos Relacionados
Recomendado para você
Informações Relacionadas Todos