1

начал знакомиться с ASP.NET-MVC-5 и Ajax. Задачка в принципе простенькая, но я на ней заткнулся. суть такая: есть некая html страница на которой отрисовывается web-форма, на этой форме присутствует кнопка, по клику которой должно "вываливаться" всплывающее окно, внутри которого некие данные из БД. Моя проблема в том, что PartialView возвращается мне не как всплывающее окно, а как отдельная вьюха.

HomeController:

public ActionResult GetKarmanDetails(string _mnemoName, string _stackName, int? _pocketNum)
{
    new Mapper().LoadDataKarman(_mnemoName, _stackName, Convert.ToInt32(_pocketNum));
    return PartialView("GetKarmanDetails", GlobalCache.GetKarmanDetails);
}

Всплывающее окно:

@model Mimic_Panel_Sklad3.WebUI.Models.KarmanDetails


<div class="modal-content">
    <div class="modal-header">
        <h4>Данные о сортаменте кармана</h4>
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    </div>
    <div class="modal-body">
        <table class="table table-custom">
            <thead>
            <tr>
                <th>Диаметр</th>
                <th>Толщина</th>
                <th>Марка стали</th>
                <th>НТД</th>
                <th>Количество труб</th>
            </tr>
            </thead>
            <tbody>
            @foreach (var element in Model.Karmans)
            {
                <tr>
                    <td>@element.DIAMETER</td>
                    <td>@element.THICKNESS</td>
                    <td>@element.STAL</td>
                    <td>@element.GOST</td>
                    <td>@element.COUNT_PIPES</td>
                </tr>
            }
            </tbody>
        </table>
    </div>
</div>

Блок из html-страницы откуда я беру свое окно:(внимание на GetKarmanDetails)

 <div class="panel-line">
    <div class="panel-item" style="background-color: @Model.GetStatusKarman(item_karman.COUNT_PIPE_PERCENT)">
        <a href="@Url.Action("GetKarmanDetails", "Home", new {@_stackName = item_karman.STACK_NAME, @_pocketNum = item_karman.POCKET_NUM, @_mnemoName = Model.MNEMO_NAME})">
            <div>
                @foreach (var item_noms in item_karman.Noms)
                {
                    if (item_noms.DIAMETER != null)
                    {
                        <div class="panel-line-nom">
                            <div class="panel-item-nom">@item_noms.DIAMETER</div>
                        </div>
                    }
                    else if (item_noms.DIAMETER == null && item_noms.COUNT_DIAMETER == 0)
                    {
                        <div class="panel-line-nom-empty">
                            <div class="panel-item-nom-empty">@item_noms.DIAMETER</div>
                        </div>
                    }

                }
            </div>
        </a>
    </div>
</div>

UPD: Я ожидаю, что результатом будет вывод высплывающего окна на той же html-странице, пример: страница при загрузке:главное представление загрузка частичного представления на той же странице:вывод окна поверх основного

но я получаю ситуацию другую. Мое частичное представление переводит меня на новую страницу, пример: загрузка страницы

загрузка частичного представления происходит путём перехода на другую страницу

9
  • Моя проблема в том, что PartialView возвращается мне не как всплывающее окно, а как отдельная вьюха. я как возвращается всплывающее окно?
    – tym32167
    7 ноя 2019 в 13:12
  • @tym32167 т.е. я ожидаю, что мое окно будет показано на той же странице, без перехода
    – Sosiska
    7 ноя 2019 в 13:15
  • отображайте его тогда как partialView на той же странице
    – tym32167
    7 ноя 2019 в 13:17
  • @tym32167 так я так и делаю, вызываю его на той же странице <a href="@Url.Action("GetKarmanDetails", "Home", new {@_stackName = item_karman.STACK_NAME, @_pocketNum = item_karman.POCKET_NUM, @_mnemoName = Model.MNEMO_NAME})">
    – Sosiska
    8 ноя 2019 в 5:35
  • metanit.com/sharp/mvc5/14.6.php
    – 4per
    9 ноя 2019 в 11:54

1 ответ 1

0

Решение: вкратце: решил выводить частичное представление в виде строки, а потом выводить ее на html.

  1. Создал новый проджект
  2. Добавил 2 новых класса

ControllerExtensions.cs:

public static string RenderPartialViewToString(this Controller controller, string viewName, object model)
    {
        if (string.IsNullOrEmpty(viewName))
        {
            viewName = controller.ControllerContext.RouteData.GetRequiredString("action");
        }

        controller.ViewData.Model = model;

        using (var sw = new StringWriter())
        {
            // Find the partial view by its name and the current controller context.
            ViewEngineResult viewResult = ViewEngines.Engines.FindPartialView(controller.ControllerContext, viewName);

            // Create a view context.
            var viewContext = new ViewContext(controller.ControllerContext, viewResult.View, controller.ViewData, controller.TempData, sw);

            // Render the view using the StringWriter object.
            viewResult.View.Render(viewContext, sw);

            return sw.GetStringBuilder().ToString();
        }
    }

JSONClass.cs:

public class JSONClass : Controller
{
    public class Messages
    {
        public String Success { get; set; }
        public String Info { get; set; }
        public String Error { get; set; }
    }
    /// <summary>
    /// Флаг пришли ли данные или нет.
    /// </summary>
    public bool Success { get; set; }
    /// <summary>
    /// Сообщение пользователю
    /// </summary>
    //public String Message { get; set; }
    public Messages Message = new Messages();
    /// <summary>
    /// Вывод сообщения об ошибках(На стороне клиента используется для консольки)
    /// </summary>
    public String ConsoleMessage { get; set; }
    /// <summary>
    /// Возвращаемые данные(Обычно это HTML строка, но в разных методах используется по разному)
    /// </summary>
    public String ResultHtml { get; set; }

    public Object Object_j { get; set; }
    /// <summary>
    /// Устанавливаем сообщение ошибкию Используется когда срабатывает Exception
    /// </summary>
    /// <param name="ex"></param>
    public void InstallErrorMessage(Exception ex, string message = null)
    {
        if (message != null)
            Message.Error = message;
        else
            Message.Error = String.Format("Возникла непредвиденная ошибка. По техническим вопросам, связанным с работой сайта, обращаться по телефону: 1111. Направьте свой вопрос в ОМК-ИТ, описав последовательность Ваших действий.");

        ConsoleMessage = String.Format("Message - {0}\r\n\r\n" +
                                                 "InnerException - {1}\r\n\r\n" +
                                                 "StackTrace - {2}", ex.Message, ex.InnerException, ex.StackTrace);
        Success = false;
    }
    /// <summary>
    /// Метод преобразования данных класса в формат JSON
    /// </summary>
    /// <returns>Строка в формате JSON</returns>
    public JsonResult ToJson()
    {
        return Json(
            new
            {
                success = Success,
                message = Message,
                consoleMessage = ConsoleMessage,
                resultHtml = ResultHtml,
                object_j = Object_j
            });
    }
}

После того, я подкорректировал контроллеры

ControllerInitializer.cs:

    public class ControllerInitializer : Controller
{
    public IServiceLayer _serviceLayer { get; set; }
    public JSONClass jsonClass { get; set; }
    public ControllerInitializer(IServiceLayer serviceLayer)
    {
        _serviceLayer = ServiceLayer.Instance(serviceLayer);

        jsonClass = new JSONClass()
        {
            Message = new JSONClass.Messages()
        };
    }
}

Ну и соответственно HomeController.cs:

public ActionResult GetKarmanDetails(string _mnemoName, string _stackName, int? _pocketNum)
    {
        try
        {
            new Mapper().LoadDataKarman(_mnemoName, _stackName, Convert.ToInt32(_pocketNum));


            jsonClass.ResultHtml = this.RenderPartialViewToString("GetKarmanDetails", GlobalCache.GetKarmanDetails);

            jsonClass.Success = true;
        }
        catch (Exception ex) { jsonClass.InstallErrorMessage(ex); }

        return jsonClass.ToJson();
    }

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

<div class="panel-line-nom" data-plain-mnemo="@Model.MNEMO_NAME"
     data-plain-stack="@item_karman.STACK_NAME"
     data-plain-pocket="@item_karman.POCKET_NUM" >
     @Html.ActionLink(@item_noms.DIAMETER, "GetKarmanDetails", new
     {
        _stackName = item_karman.STACK_NAME,
        _pocketNum = item_karman.POCKET_NUM,
        _mnemoName = Model.MNEMO_NAME
     }, new
     {
        @class = "karmanItem"
     })
</div>

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

    $("body").on('click', '.karmanItem', function (e) {
    e.preventDefault();
    var href = $(this).attr('href');
    AJAXGlobals({
        url: href,

        data: {
            _mnemoName: $(this).data('plainMnemo'),
            _stackName: $(this).data('plainStack'),
            _pocketNum: $(this).data('plainPocket')
        },
        success: function (data) {

            $('#dialogContent').html(data.resultHtml);

            $('#modDialog').modal('show');

        }
    });
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.