Editable cshtml View Page save as PDF

2019-09-12 14:10发布

站内问答 / JavaScript
591 1 6

I'm trying to create web application that consisting an

  1. editable cshtml view page

and then

  1. save that edited content as a PDF once I click the button

So this is the whole cshtml view page , 

        @model IEnumerable<int>

        @{
            ViewBag.Title = "Create Template";
        }
        <!DOCTYPE html>
        <html>
        <head>
            <title>Create a Template</title>
        </head>
        <body>
                    <div id='template'>
                       <h1 contentEditable='True'>Product Name</h1>
                        <div >
                          <h2 contentEditable='True'>Product Description</h2>       
                          <p contentEditable='True'>London is the capital city of England.</p>
                       </div>
                   </div>

          <button id="btn_sumbit" type="button" class="btn btn-danger submit">Save as PDF</button>

        </body>
        </html>

        @section Scripts {

            @Scripts.Render("~/bundles/jqueryval")
            @Scripts.Render("~/bundles/jqueryui")

            <script type="text/javascript">

                $('#btn_sumbit').on('click', function () {

                    var div_value = document.getElementById('template').innerHTML;

                    RazorPDF.PdfResult(div_value, "PDF");
                });

            </script>

        }

I'm using RazorPDF to do this task , but once I click this button it doesn't saving to PDF

I can edit this cshtml view page , I want to save that finally edited content as pdf (which is dynamic view)

1条回答
淡お忘
2楼-- · 2019-09-12 15:00

I think you're doing it wrong. The line "RazorPDF.PdfResult(...)" belongs in the Controller not in the View.

Watch this Video: http://nyveldt.com/blog/post/Introducing-RazorPDF It should give you a clearer understanding of how things work in RazorPDF.

EDIT:

Just create a Controller method, that generates a PDF-View based on Parameters.

public ActionResult Pdf(string name, string description) {
    var product = new Product();
    product.Name = name;
    product.Description = description;

    var pdfResult = new PdfResult(product, "Pdf");

    return pdfResult;
}

Of course you need to create a Product-Class that holds the information.

In your Javascript part you can write:

location.href = @Url.Action("Pdf", "Controllername") + "?name=" + name + "&description=" + description;

This will hopefully generate a link that you can follow in Javascript. name and description are Javascript variables that hold the information that was typed by the user.

Do you understand? My approach would be to generate the PDF content in a different view (like in that video) based on the information of your editable view.

Tell me if it worked. ;-)

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)