Is controller returning HTML to View wrong?

Asked

Viewed 1,073 times

14

I used this solution because when trying to render a Table in a view with many records the user’s browser gave Crash, I know it is a solution not much elegant but it was the only solution that came to mind. (In this view I have to load all the records on the screen to the user)

I created a method Gerartabela where I populate with the database data and return a String with HTML containing the data. In the View call I make an Ajax request that assemble the table pro user, basically do the rendering on the server-side.

What are the disadvantages of using this model and what alternative could be adopted? 1

Prototype:

Protótipo

1 On this page I cannot use pagination, all records must be loaded at once.

  • This table is for viewing and user actions only or is related to reports?

  • For visualization and interaction of some of the fields. I attached the screen prototype the question for a better understanding.

  • With the request being made by ajax the browser is crashing?

  • No. My View was typed and received a list (I made an Ajax request too, only the return was a List), so I rendered using Razor (in this case I crashed). Now I make an Ajax request and give an innerHTML in the table (the result of my request is HTML already with populated values, Razor’s responsibility previously).

  • To optimize this process you can select only the fields that will be displayed in this table. As for the view part I believe it makes no difference as both are processed on the server-side and with the ajax request you have the benefit of keeping the page responding!

  • I was already doing it man, the return of my list was just these 4 fields that you can see in the prototype.

  • How many records are you returning ?

  • 4,000 records.

  • Using Ajax does not assume that the HTML will come from the controller. You can make a request via ajax, exactly as you are doing, and it returns the HTML exactly as you are doing, but instead of the controller generating the html, it switches to the render view. A request with Ajax works exactly like a request without ajax, that is, it can have its own view and its js can write the text directly on the screen. Now if the browser is locking by the amount of data, I don’t know exactly how ajax is helping, unless you are implementing a Lazy load scheme. This is the case?

  • Your save button is not working, I kept clicking several times and did not save anything :(

  • @Rodrigoborth lol

  • @Luíshenrique It is because first I load the page then I make a request that searches a list and then returns the HTML with all the formatted tags, I only make the request for Ajax to give an "Append" of the HTML on the page returned from the Controller.

  • Well, if you say it improves, beauty. But, anyway, your controller does not need to return html. I don’t use ASP, but I imagine it has a way to do what I’m saying: what if the URL X (from where you take the data) had a simpler template containing only the table you need? It would have a view, where HTML would be and you would keep working, from the point of view of the page that requests the data, in exactly the same way.

  • Dude, I already tried this, before my screen had only the table structure and a foreach pro Razor popular the data that came in the list, my view was typed, I could understand?

Show 10 more comments

3 answers

15

I would use another solution.

Reason: Mounting HTML is View’s responsibility. The Controller must process the requests and execute the logic (to retrieve information, change the database, etc...).

Following this idea I would not feel good assembling HTML in Controller, I do not know if the implementation and maintenance of this would be cool, even for not having used this type of solution that you chose.

Disadvantage of using this model: One of the premises of Asp.net Mvc is the clear separation of your business logic from your UI code, but depending on your implementation, you may end up mixing your business logic with the HTML you are generating in the Controller, walking a little counter to this idea.

Usually when it is necessary to load many records in the View I use a pagination resource not to have to load all the data.

Already if I couldn’t use paging, would review/refactor/rethink the code. An alternative would create a HTML Helper to mount this table for example, but would not mount HTML in Controller.

  • In my case I cannot use paging, because the client wants all data to be loaded on the screen without paging.

  • @NULL Does not justify. You can generate any HTML only using what is explicit in the View. For paging: https://www.nuget.org/packages/PagedList/

  • @NULL edited the answer. If you cannot use paging, an alternative is to create an HTML Helper, where when rendering the View you call the HTML Helper created to render your table.

  • An exception to the rule is to program Response Body with an implementation of Composite. Very useful for small cases like checking the existence of a user name that does not justify an entire View Template (or at least an interaction with a View Engine) only for a simple pseudo-boolean.

2

You can have the same effect using a Partialview. I believe that if your project is object-oriented, with a well-defined model, it can help a lot. _Partials can be created in the same folder as your Views and you can add them right over the folder, Add, View and check the checkbox Create as a partial view.

Controller

[HttpGet]
public ActionResult Detalhar()
{
    var suaLista = _suaBll.Detalhar();
    return PartialView("_Detalhamento", suaLista);
}

Partialview

@model SeuNameSpace.ModelDaSuaLista

<table>
    <tr>
        <th>@Html.LabelFor(m => @Model[0].Propriedade)</th>
    </tr>
    @foreach (var item in @Model)
    {
        <tr>
            <td>@Html.DisplayFor(m => item.Propriedade)</td>
        </tr>
    }
</table>

View

<div id="detalhamentoDiv" style="display: none; min-height: 80px;" data-request-url="@Url.Action("Detalhar", "SeuController")"></div>

Javascript

var detalhamentoDiv = $("#detalhamentoDiv");
var url = detalhamentoDiv.data('request-url');
detalhamentoDiv.load(url);
detalhamentoDiv.fadeIn(500);

0

If this view is only viewed by the user (without printing) I do not advise loading much data, after all, it will have to check the information there. If it wants to do a much more complete search, use tabs, loading parts of the table for you, so it is less messy for the user to search for information...

Browser other questions tagged

You are not signed in. Login or sign up in order to post.