Kendo Ui PanelBar динамическая загрузка

1

У меня есть 2 таблицы CourseCatalog и курсы, и я хочу отображать их с помощью панели Kendoui Panelbar, как я могу это достичь?

содержание заголовков панели будет динамическим, а также каждая панель динамической

надеюсь, я объяснил свои потребности четко

здесь образец кода

public class CourseCatalog
{
    public int CatalogId{get; set;}
    public string Name {get; set;}
}

public class Course
{
    public int CourseId{get; set;}
    public int CatalogId{get; set;}
    public string CourseName{get; set;}
    public int Hours{get; set;}
}

контроллер

public class AvailableCourses:Controller
{
    public ActionResult Index()
    {
         return View();
    }

    public ActionResult Courses(int id)
    {
         return PartialView();
    } 
}

вид

@(Html.Kendo().PanelBar().Name("avaliableCoursesPanelBar")
       .Items(i=>{
             i.Add().Text("Training Courses").LoadContentFrom(Url.Action("Courses","AvailableCourses",new {id=1}));
       });
  )

моя проблема в том, что я могу вручную добавить элементы на панель панели и назначить параметр вручную id = 1, но как автоматизировать этот процесс полностью?

  • 0
    я могу добавить панели панели вручную, но не динамически
  • 0
    Да, я понял это из вопроса, но без какого-либо кода, как люди должны помогать?
Показать ещё 1 комментарий
Теги:
asp.net-mvc
kendo-ui

1 ответ

2
Лучший ответ

Вы можете сделать следующее:

1- ваш контроллер, предполагающий, что вы используете entityframework и контекст, называемый db

// function to return the course catalog list
public List<CourseCatalog> GetCourseCatalogs()
{
    var details=db.CourseCatalogs.ToList();
    return details;
}

// your index action
public ActionResult Index()
{
    ViewBag.Catalogs=GetCourseCatalogs();
    return View();
}

// partial view for your Course details with parameter id to filter the course catalog

public ActionResult CourseDetails(int id)
{
    var details = db.Courses.Where(t=>t.CatalogId==id).ToList();
    return PartialView(details);
}

2- ваш индексный указатель

 Html.Kendo()
    .PanelBar()
    .Name("catalogBar")
    .ExpandMode(PanelBarExpandMode.Single)
            .Items(items =>
            {
                // here is the trick to add the items dynamically
                foreach (YourApplication.Models.Catalog detail in ViewBag.Catalogs)
                {
                    items.Add()
                        .Text(detail.Name)
                        .LoadContentFrom(Url.Action("CourseDetails", "YourController", new { id = detail.Id }));
                }

            })
)

3- просмотр вашего курса

контент зависит от того, как вы его отобразите, здесь я предполагаю, что вы отобразите его в ul

  @model IEnumerable<YourApplication.Models.Course>


      <ul>
        @foreach(YourApplication.Models.Course detail in Model)
        {
           <li>@detail.Name</li>
        }
        </ul>

Надеюсь, что это поможет вам

  • 0
    спасибо за подробности, попробую
  • 0
    как вы будете отображать контент? используя <ul> или <table> или другой элемент управления kendo ui?
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню