Форум программистов, компьютерный форум, киберфорум
Наши страницы
C#: ASP.NET MVC
Войти
Регистрация
Восстановить пароль
 
Кадмий
0 / 0 / 0
Регистрация: 09.01.2018
Сообщений: 10
1

Оптимизация частичных представлений

09.01.2018, 21:17. Просмотров 257. Ответов 6
Метки mvc, view (Все метки)

Добрый день. Помогите разобраться с такой проблемой.
Имеется контроллер с методами которые возвращают частичные представления.
C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
    public class DailyTaskController : Controller
    {
        public ActionResult DailyTaskHeader()
        {
            List<DailyTaskHeaderModel> item = new List<DailyTaskHeaderModel>;
            item.Add(new DailyTaskHeaderModel()
            {
                Task_header_id = 457,
                Task_header_name = "head1"
            });
 
            return PartialView(item);
        }
 
        public ActionResult DailyTaskLine()
        {
            List<DailyTaskLineModel> item = new List<DailyTaskLineModel>;
            item.Add(new DailyTaskLineModel()
            {
                Task_line_id = 1456,
                Task_line_name = "line1"
            });
 
            return PartialView(item);
        }
    }
Вот код частичного представления DailyTaskHeader
C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
@model IEnumerable<WebAppNet.Models.DailyTaskHeaderModel>
 
<div>
    <div class="x-panel-header">Header</div>
    
    <div class="x-toolbar x-top-toolbar">
        <div class="x-toolbar-item">
            <a>Top Toolbar</a>
        </div>
        <div class="x-toolbar-search">
            <input class="x-form-text" type="text" size="18" autocomplete="off" />
            <div class="x-form-trigger x-form-clear-trigger"></div>
            <div class="x-form-trigger x-form-search-trigger"></div>
        </div>
    </div>
    
    <div class="x-panel-grid">
        <div class="x-grid-header">
            <div>
                <div id="gridcolumn-100" data-tableid="gridbody-1125" data-typecolumn="string" class="x-grid-header-cell" style="width:150px;" unselectable="on">@Html.DisplayNameFor(model => model.Task_header_id)</div>
                <div data-headerid="gridcolumn-100" class="x-grid-header-drag" unselectable="on"></div>
            </div>
            <div>
                <div id="gridcolumn-101" data-tableid="gridbody-1125" data-typecolumn="number" class="x-grid-header-cell" style="width:80px;" unselectable="on">@Html.DisplayNameFor(model => model.Task_header_name)</div>
                <div data-headerid="gridcolumn-101" class="x-grid-header-drag" unselectable="on"></div>
            </div>
        </div>
        <div class="x-grid-scroll">
            <table class="x-grid-body" id="gridbody-1125">
                <tbody>
 
                    @foreach (var line in Model)
                    {
                        <tr id="gridbody-1125-record-1">
                            <td><div data-columnid="gridcolumn-100" class="x-grid-body-cell" style="width:150px;">@Html.DisplayFor(modelItem => line.Task_header_id)</div></td>
                            <td><div data-columnid="gridcolumn-101" class="x-grid-body-cell" style="width:80px;">@Html.DisplayFor(modelItem => line.Task_header_name)</div></td>
                        </tr>
                    }
 
                </tbody>
            </table>
        </div>
    </div>
    
    <div class="x-toolbar x-bottom-toolbar">Bottom Toolbar</div>
</div>
Для представления DailyTaskLine разметка будет идентичной за исключением подстановок свойств из модели.
Собственно от этого дублирования кода хочу избавиться.

На ум приходят хелперы с помощью которых можно генерировать разметку и использовать его в каждом представлении, но тогда каким образом в один хелпер можно передавать разные модели (в конкретном случае DailyTaskHeaderModel и DailyTaskLineModel) и перебирать их свойства?
Думал может разбить каждое представление на куски из хелперов (шапка, тело, подвал) а тело генерировать непосредственно в представлении, но тогда будут дублироваться куски кода
C#
1
2
3
4
5
6
7
8
9
10
// ...
            <div>
                <div id="gridcolumn-100" data-tableid="gridbody-1125" data-typecolumn="string" class="x-grid-header-cell" style="width:150px;" unselectable="on">@Html.DisplayNameFor(model => model.Task_header_id)</div>
                <div data-headerid="gridcolumn-100" class="x-grid-header-drag" unselectable="on"></div>
            </div>
            <div>
                <div id="gridcolumn-101" data-tableid="gridbody-1125" data-typecolumn="number" class="x-grid-header-cell" style="width:80px;" unselectable="on">@Html.DisplayNameFor(model => model.Task_header_name)</div>
                <div data-headerid="gridcolumn-101" class="x-grid-header-drag" unselectable="on"></div>
            </div>
// ...
Что тоже нежелательно.
Вообщем нужен совет, чтоб по пацански все выглядело.
0
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
09.01.2018, 21:17
Ответы с готовыми решениями:

Создание независимо обновляющихся на одной странице частичных представлений
Как-то можно реализовать средствами MVC ?

Динамический выбор частичных представлений
Здравствуйте коллеги, нужен ваш совет. Есть форма редактирования товара, для всех товаров часть...

ixsso.Query, поис частичных совпадений.
Как настроить этот компонент чтобы он искал не точное совпаление слова а по его части. Например:...

Объединение представлений
В одном и том же методе данные DataTable посылаются через ViewBag в одну вьюху, и через return...

Сохранение пользовательских представлений
Добрый День. Пишу сайт на asp.net mvc. Есть необходимость дать пользователям возможность...

6
Cupko
463 / 452 / 127
Регистрация: 17.07.2012
Сообщений: 1,348
Записей в блоге: 1
Завершенные тесты: 2
09.01.2018, 21:49 2
Кадмий, Хедеры/футеры/навигация/бредкрамбы в partial views. Сами "тела", зависящие от модели, как по мне, никак не обобщать. Если уж сильно хочется, можно мелкие повторяющиеся куски разметки вынести в Razor хелперы.
Я тут не гуру MVC, что думаю - то говорю
0
Кадмий
0 / 0 / 0
Регистрация: 09.01.2018
Сообщений: 10
09.01.2018, 22:15  [ТС] 3
Вообщем в итоге получается вот такая картина:

1 представление
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// .........
// Куча однотипной разметки
// .........
@foreach (var line in Model)
{
    // ...
    <div /* Куча атрибутов */>
        <div /* Куча атрибутов */>@Html.DisplayFor(modelItem => line.Task_header_id)</div>
        <div data-headerid="gridcolumn-101" class="x-grid-header-drag" unselectable="on"></div>
    </div>
    // ...
}
// .........
// Куча однотипной разметки
// .........

2 представление
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// .........
// Куча однотипной разметки
// .........
@foreach (var line in Model)
{
    // ...
    <div /* Куча атрибутов */>
        <div /* Куча атрибутов */>@Html.DisplayFor(modelItem => line.Task_line_id)</div>
        <div data-headerid="gridcolumn-101" class="x-grid-header-drag" unselectable="on"></div>
    </div>
    // ...
}
// .........
// Куча однотипной разметки
// .........

3 представление
...
n представление

А если в разметку потребуется добавить атрибут?
Неужели никак нельзя это все шаблонизировать?
Может я не тот подход выбрал?
Я в печали
0
Usaga
Эксперт .NET
5706 / 3940 / 702
Регистрация: 21.01.2016
Сообщений: 15,508
Завершенные тесты: 2
10.01.2018, 06:51 4
Цитата Сообщение от Кадмий Посмотреть сообщение
Неужели никак нельзя это все шаблонизировать?
Кто вам сказал? Разве частичные представления (Partial View) и шаблоны отображения и редактирования уже отменили?
0
cunamy
7 / 7 / 1
Регистрация: 26.04.2013
Сообщений: 34
10.01.2018, 07:57 5
Создай универсальную ViewModel заполняй ее нужными данными (DailyTaskHeader или DailyTaskLine) и передавай ее в PartialView
0
Кадмий
0 / 0 / 0
Регистрация: 09.01.2018
Сообщений: 10
10.01.2018, 10:51  [ТС] 6
Цитата Сообщение от cunamy Посмотреть сообщение
Создай универсальную ViewModel заполняй ее нужными данными (DailyTaskHeader или DailyTaskLine) и передавай ее в PartialView
Набубенил класс модели "DailyTaskModels.cs"
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
    public class DailyTaskHeaderModel
    {
        [Display(Name = "Номер задания")]
        public int Task_header_id { get; set; }
        [Display(Name = "Тип")]
        public string Task_type_name { get; set; }
        [Display(Name = "Состояние")]
        public string Task_state_name { get; set; }
    }
 
    public class DailyTaskLineModel
    {
        public int Task_line_id { get; set; }
        public int Unit_id { get; set; }
    }
 
    public class DailyTaskViewModel
    {
        public DailyTaskHeaderModel DailyTaskHeader { get; set; }
        public IEnumerable<DailyTaskHeaderModel> DailyTaskHeaders { get; set; }
        public IEnumerable<DailyTaskLineModel> DailyTaskLines { get; set; }
    }

Набубенил класс контроллера "DailyTaskController.cs"
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
    public class DailyTaskController : Controller
    {
        public ActionResult Form()
        {
            return View();
        }
 
        [ChildActionOnly]
        public ActionResult DailyTaskHeader()
        {
            List<DailyTaskHeaderModel> headers = new List<DailyTaskHeaderModel>();
            headers.Add(new DailyTaskHeaderModel()
            {
                Task_header_id = 23541,
                Task_type_name = "Оболденный",
                Task_state_name = "Так себе"
            });
 
            DailyTaskViewModel taskvm = new DailyTaskViewModel
            {
                DailyTaskHeaders = headers
            };
 
            return PartialView("_DailyTaskHeader", taskvm);
        }
    }

Набубенил view "_DailyTaskHeader.cshtml"
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
@model WebAppNet.Models.DailyTaskViewModel
 
<div>
    <div class="x-panel-header">Header</div>
 
    <div class="x-toolbar x-top-toolbar">
        <div class="x-toolbar-item">
            <a>Top Toolbar</a>
        </div>
        <div class="x-toolbar-search">
            <input class="x-form-text" type="text" size="18" autocomplete="off" />
            <div class="x-form-trigger x-form-clear-trigger"></div>
            <div class="x-form-trigger x-form-search-trigger"></div>
        </div>
    </div>
 
    <div class="x-panel-grid">
        <div class="x-grid-header">
            <div>
                <div id="gridcolumn-100" data-tableid="gridbody-1125" data-typecolumn="string" class="x-grid-header-cell" style="width:150px;" unselectable="on">@Html.DisplayNameFor(model => model.DailyTaskHeader.Task_header_id)</div>
                <div data-headerid="gridcolumn-100" class="x-grid-header-drag" unselectable="on"></div>
            </div>
            <div>
                <div id="gridcolumn-101" data-tableid="gridbody-1125" data-typecolumn="number" class="x-grid-header-cell" style="width:80px;" unselectable="on">@Html.DisplayNameFor(model => model.DailyTaskHeader.Task_type_name)</div>
                <div data-headerid="gridcolumn-101" class="x-grid-header-drag" unselectable="on"></div>
            </div>
            <div>
                <div id="gridcolumn-102" data-tableid="gridbody-1125" data-typecolumn="date" class="x-grid-header-cell" style="width:100px;" unselectable="on">@Html.DisplayNameFor(model => model.DailyTaskHeader.Task_state_name)</div>
                <div data-headerid="gridcolumn-102" class="x-grid-header-drag" unselectable="on"></div>
            </div>
        </div>
        <div class="x-grid-scroll">
            <table class="x-grid-body" id="gridbody-1125">
                <tbody>
 
                    @foreach (var line in Model.DailyTaskHeaders)
                    {
                        <tr id="gridbody-1125-record-1">
                            <td><div data-columnid="gridcolumn-100" class="x-grid-body-cell" style="width:150px;">@Html.DisplayFor(modelItem => line.Task_header_id)</div></td>
                            <td><div data-columnid="gridcolumn-101" class="x-grid-body-cell" style="width:80px;">@Html.DisplayFor(modelItem => line.Task_type_name)</div></td>
                            <td><div data-columnid="gridcolumn-102" class="x-grid-body-cell" style="width:100px;">@Html.DisplayFor(modelItem => line.Task_state_name)</div></td>
                        </tr>
                    }
 
                </tbody>
            </table>
        </div>
    </div>
 
    <div class="x-toolbar x-bottom-toolbar">Bottom Toolbar</div>
 
</div>

Набубенил view "Form.cshtml"
Кликните здесь для просмотра всего текста

C#
1
2
3
<div class="x-panel-body" style="bottom:180px;top:0px;left:0px;right:250px;">
    @Html.Action("DailyTaskHeader")
</div>

Все работает, все визуализируется, просто пЭрсик (вот даже скрин формы есть).

Это представление написано для модели DailyTaskViewModel свойства DailyTaskHeaders, теперь необходимо написать идентичное представление для свойства DailyTaskLines.
По сути эти представления будут отличаться подстановками свойств из модели:
Кликните здесь для просмотра всего текста

C#
1
@Html.DisplayNameFor(model => model.DailyTaskLine.Task_line_id)
вместо
C#
1
@Html.DisplayNameFor(model => model.DailyTaskHeader.Task_header_id)

и вот тут еще
Кликните здесь для просмотра всего текста

C#
1
2
3
4
5
6
7
@foreach (var line in Model.DailyTaskLines)
{
    <tr id="gridbody-1125-record-1">
        <td><div data-columnid="gridcolumn-100" class="x-grid-body-cell" style="width:150px;">@Html.DisplayFor(modelItem => line.Task_line_id)</div></td>
        <td><div data-columnid="gridcolumn-101" class="x-grid-body-cell" style="width:80px;">@Html.DisplayFor(modelItem => line.Unit_id)</div></td>
    </tr>
}
вместо
C#
1
2
3
4
5
6
7
8
@foreach (var line in Model.DailyTaskHeaders)
{
    <tr id="gridbody-1125-record-1">
        <td><div data-columnid="gridcolumn-100" class="x-grid-body-cell" style="width:150px;">@Html.DisplayFor(modelItem => line.Task_header_id)</div></td>
        <td><div data-columnid="gridcolumn-101" class="x-grid-body-cell" style="width:80px;">@Html.DisplayFor(modelItem => line.Task_type_name)</div></td>
        <td><div data-columnid="gridcolumn-102" class="x-grid-body-cell" style="width:100px;">@Html.DisplayFor(modelItem => line.Task_state_name)</div></td>
    </tr>
}

Вся остальная разметка ничем не отличается.
Никак не пойму как это можно реализовать.
Может возможно перебирать циклом свойства модели и подставлять их в разметку а не прописывать жестко?
Вообщем хелп!
0
Wolfdp
896 / 801 / 207
Регистрация: 15.06.2012
Сообщений: 3,165
Записей в блоге: 1
Завершенные тесты: 1
10.01.2018, 12:21 7
#1
для отображения создаем отдельную базовую ViewModel

#2
создаем одну общую View, два Partial для Row, и скажем в ViewBag задаем нужное имя подставляемого partial
0
10.01.2018, 12:21
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
10.01.2018, 12:21

Размещение представлений на одной странице
Имеется два представления с разными моделями (первая модель таблица для хранения инфы по объектам,...

Использование MVC без представлений
Кто-нибудь так делает? Чем лучше с представлениями?

Как вернуть несколько представлений
Есть аякс в View: @Html.DropDownList(&quot;CategoryId&quot;, null, &quot;Выберете категорию&quot;, new {...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Рейтинг@Mail.ru