ASP NET MVC - Download html table

Asked

Viewed 616 times

1

I have a view that has a whole table structure, by typing the view path in the navigation bar I opened the table. I would like to create a button that downloads this table and saves as . xls Can anyone help me? I already searched and only found downloading if I created the table in other ways and not the table already created in html. Thank you. Abs,

<table>
<tbody><tr height="20" style="height:15.0pt" bgcolor="#F0F8FF	">

        <td bgcolor="#ffffff"> </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="gray">   <b>Tópico </b>  </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#d3d3d3"><b>   Keyword </b>  </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#d3d3d3"><b>   Total de Postagens </b>  </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#d3d3d3"><b>   Alcance Total</b>   </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#9be29b"><b>   Positivas</b>   </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#FFFACD"><b>   Neutras  </b> </td>
        <td align="center" class="xl68" style="border-left:none" bgcolor="#ff9999"><b>   Negativas  </b> </td>
        <td align="center" class="xl68" style="border-left:none"> <b>  Twitter   </b>  </td>
        <td align="center" class="xl68" style="border-left:none"> <b>  Facebook  </b>  </td>
        <td align="center" class="xl68" style="border-left:none"> <b>  Instagram </b>  </td>
        <td align="center" class="xl68" style="border-left:none"> <b>  Youtube   </b>  </td>
        <td align="center" class="xl68" style="border-left:none"> <b>  Outras    </b>  </td>
        <td bgcolor="#ffffff"> </td>
    </tr>

<tr height="20" style="height:15.0pt">

            <td></td>
            <td align="center" class="xl68" style="border-left:none">@topico.name</td>
            <td align="center" class="xl68" style="border-left:none">@topico.name</td>
            <td align="center" class="xl68" style="border-left:none">@posts.Count</td>
            <td align="center" class="xl68" style="border-left:none">@reach</td>
            <td align="center" class="xl68" style="border-left:none">@positivo</td>
            <td align="center" class="xl68" style="border-left:none">@neutro</td>
            <td align="center" class="xl68" style="border-left:none">@negativo</td>
            <td align="center" class="xl68" style="border-left:none">@twitterCount</td>
            <td align="center" class="xl68" style="border-left:none">@facebookCount</td>
            <td align="center" class="xl68" style="border-left:none">@instagramCount</td>
            <td align="center" class="xl68" style="border-left:none">@youtubeCount</td>
            <td align="center" class="xl68" style="border-left:none">@outros</td>
            <td> </td>
        </tr>
        </tbody>
</table>

  • The table has pagination?

  • At first you want to create a crawler, which will read the page’s HTML data, populate an . xls with the same?

  • can you put an excerpt of your code? would make it easier for staff to help with this

  • Actually this html that I have in View is already a complete table, very simple, without CSS. If I click the other button on it I can save and put.xls and it opened in EXCEL.

  • Rodrigo, it would be more or less like this here, with more lines. https://jsfiddle.net/52fLry0s/

2 answers

1

You can do this using jQuery and window.open('data:application/vnd.ms-excel)...

I made a Fiddle for you to test, but basically you need to export HTML from your table.

Assuming your html is:

<div id="divResultado">
    <table>
        <tr>
            <th>Data</th>
            <th>Hora</th>
            <th>Carro</th>
        </tr>
        <tr>
            <td>@data</td>
            <td>@hora</td>
            <td>@carro</td>
        </tr>
    </table>
</div>

And the button:

<input type="button" id="btnExport" value=" Exportar para excel " />

And as his <table> is inside the div #divResultado, in Jquery:

$("#btnExport").click(function (e) {
    window.open('data:application/vnd.ms-excel,' + $('#divResultado').html());
    e.preventDefault();
});
  • Marllon, thank you so much for your help, however, I tested the friend option first, and it worked perfectly.

  • Yes, there are several ways to do it... but from what you wrote, it gave the impression that you did not want to go in the database again... I understood that you wanted to export the table that was in HTML... so I suggested the approach by jQuery.. :)

0


All you have to do is create a Action in your controller with the HTTP header who wishes, in your case to .xls.

In terms of code, it would look something like this:

   public ActionResult ExportarParaExcel()
    {
        var lista = db.ENTIDADE.ToList();//Sua lista que está enviando apra View.

        Response.AddHeader("content-disposition", "attachment; filename=NOMEARQUIVO.xls");
        Response.ContentType = "application/vnd.ms-excel";
        return View(lista);

    }

From the above way you don’t need to make any changes in your view. Just put the two lines in your Action already working you will see the result.

  • Hard to believe it was that simple. Thanks so much for helping Randrade!

  • @Arthurkeller Many things are so simple. I was also surprised when I discovered. kk

Browser other questions tagged

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