Asp.net mvc 4 从淘汰版JS视图创建pdf&；视图模型

场景：在我们的应用程序中，用户可以通过在淘汰视图中填写某些字段来创建发票。可以通过另一个淘汰页面预览此发票。我想在我们的PDF创建者（EVOPdf）中使用预览url，以便我们可以向用户提供此发票中的PDF

为了预览发票，我们通过ajax请求加载数据（在准备好文档时）：

var InvoiceView = function(){
    function _start() {
        $.get("invoice/GetInitialData", function (response) {
            var viewModel = new ViewModel(response.Data);
            ko.applyBindings(viewModel, $("#contentData").get(0));
        });
    };
    return{
        Start: _start
    };
}();

当PDF创建者请求url时，我的问题是数据绑定：viewModel为空。这是有意义的，因为当PDF创建者执行请求时，不会调用

GetInitialData

操作。直接从页面末尾的预览页面调用此

\u start

函数也没有帮助

<script type="text/javascript">
    $(document).ready(function() {
        InvoiceView.Start();
    });
</script>

Javascript:

var model = this;
model.invoiceToEdit = ko.observable(null);

model.downloadInvoice = function (invoice) {
    model.invoiceToEdit(invoice);
    var url = '/invoice/preview';
    window.location.href = '/invoice/pdfDownload?url=' + url;
};

---

xdumaine的评论让我想到了另一个方向，谢谢你

加载Ajax请求确实花了一些时间，但在pdf creator对象上放置了一个

ConversionDelay

之后，我还发现了一些JavaScript（例如，敲除绑定）错误

pdfConverter.ConversionDelay = 5; //time in seconds

这是我目前的解决方案，现在对我有效：

要启动绑定单击事件的流程，请执行以下操作：

model.downloadInvoice = function (invoice) {
    var url = '/invoice/preview/' + invoice.Id() + '?isDownload=true';
    window.open('/invoice/pdfDownload?url=' + url);
};

public ActionResult Preview(string id, bool isDownload = false)
{
    return PartialView("PdfInvoice", new InvoiceViewModel
    {
        IsDownload = isDownload,
        InvoiceId = id
    });
}

这将导致对控制器操作执行

GET

resquest

public FileResult PdfDownload(string url)
{
    var pdfConverter = new PdfConverter { JavaScriptEnabled = true };

    // add the Forms Authentication cookie to request
    if (Request.Cookies[FormsAuthentication.FormsCookieName] != null)
    {
        pdfConverter.HttpRequestCookies.Add(
            FormsAuthentication.FormsCookieName,
            Request.Cookies[FormsAuthentication.FormsCookieName].Value);
    }

        pdfConverter.ConversionDelay = 5; 
        var absolutUrl = ToAbsulte(url);
        var pdfBytes = pdfConverter.GetPdfBytesFromUrl(absolutUrl);

        return new FileContentResult(pdfBytes, "application/pdf");
}

Pdf创建者正在控制器上请求此操作，且

isDownload=true

（请参阅绑定单击事件）：

将返回此局部视图：

部分观点：

// the actual div with bindings etc.
@if (Model.IsDownload)
{
    //Include your javascript and css here if needed
    @Html.Hidden("invoiceId", Model.InvoiceId);

    <script>
        $(document).ready(function () {
            var invoiceId = $("#invoiceId").val();
            DownloadInvoiceView.Start(invoiceId);
        });
    </script>
}

---

这可能是由ajax请求的延迟引起的。对于PDF创建者来说，javascript已经执行，文档已经准备好了，但实际上，您正在等待ajax完成和viewmodel填充。您可以尝试在初始页面请求中交付ajax，以消除在页面加载时立即执行ajax调用的需要。

// the actual div with bindings etc.
@if (Model.IsDownload)
{
    //Include your javascript and css here if needed
    @Html.Hidden("invoiceId", Model.InvoiceId);

    <script>
        $(document).ready(function () {
            var invoiceId = $("#invoiceId").val();
            DownloadInvoiceView.Start(invoiceId);
        });
    </script>
}

DownloadInvoiceView = function() {
   function _start(invoiceId) {
        $.get("invoice/GetInvoice/" + invoiceId, function(response) {
            var viewModel = new DownloadInvoiceView.ViewModel(response.Data);
            ko.applyBindings(viewModel, $("#invoiceDiv").get(0));
        });
    };

    return {
        Start: _start
    };

}();

DownloadInvoiceView.ViewModel = function (data) {
    var model = this;
    var invoice = new Invoice(data); //Invoice is a Knockout model

    return model;
};