Rotativa.AspNetCore
Rotativa.AspNetCore copied to clipboard
Javascript not running DOM modification
When I turn my view into a PDF using Rotativa.AspNetCore, all of my javascript DOM modification are not enabled, for example, I use stretchy.js, that onload set the proper size for every input based on their content.
I was wondering if javascript should be working in Rotativa.AspNetCore just as the regular Rotativa in Asp.Net Mvc?
How to let javascript run before Rotativa turns the view in a PDF?
here's how I return my ActionResult
[HttpPost, ActionName("Convert")]
public ActionResult Convert(string html)
{
if (string.IsNullOrEmpty(html))
{
return BadRequest();
}
var decodedHtml = Encoding.UTF8.GetString(
System.Convert.FromBase64String(html)
);
var headerPath = _hostingEnvironment.ContentRootPath + "\\wwwroot\\PrintHeader.html";
var footerPath = _hostingEnvironment.ContentRootPath + "\\wwwroot\\PrintFooter.html";
var customSwitches = $"--header-html \"{headerPath}\" " +
"--header-spacing \"0\" " +
$"--footer-html \"{footerPath}\" " +
"--footer-spacing \"10\" " +
"--footer-font-size \"10\" " +
"--header-font-size \"10\" " +
"--debug-javascript " +
"--no-stop-slow-scripts " +
"--javascript-delay \"1000\" ";
return new ViewAsPdf("Convert", new ConvertViewModel(decodedHtml))
{
PageSize = Size.A4,
PageOrientation = Orientation.Portrait,
CustomSwitches = customSwitches
};
}
And here's the view I'm trying to convert in pdf
@model SomeProject.ViewModel.ConvertViewModel
@{
Layout = "";
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" charset="utf-8" content="width=device-width, initial-scale=1.0"/>
<title>QuotingPlus</title>
<!--Custom CSS-->
<link rel="stylesheet" href="~/css/site.min.css"/>
<!-- Material Design for Bootstrap CSS -->
<link rel="stylesheet" href="~/css/boostrap-material-design.min.css"/>
<link rel="stylesheet" href="~/css/jquery.mCustomScrollbar.min.css"/>
<script>
function SetFormat(id) {
const input = $("#" + id);
const cost = parseFloat(input.val());
input.val(
Number.parseFloat(cost).toFixed(2)
);
}
</script>
</head>
<body class="bg-white">
@Html.Raw(Model.HtmlContent)
<script src="~/js/cookie-handler.js"></script>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/js/popper.min.js"></script>
<script src="~/js/boostrap-material-design.min.js"></script>
<script src="~/js/stretchy.js"></script>
<script>$(document).ready(function() { $('body').bootstrapMaterialDesign(); });</script>
<script src="~/js/jquery.mCustomScrollbar.concat.min.js"></script>
</body>
</html>
@webgio @HenrikBacher @dnl1 @evinoid
If this is not implemented, is there a way to tell it in the readme?
I believe I'm experiencing the same issue. I'm setting up a graphing view in a similar way, also using ViewAsPDF, and have experimented with all the relevant flags / options, with no good outcome. The graph is never drawn in the PDF, no matter what I do. Note that this approach works for our desktop product which calls WKHTMLTOPDF as an external process.