I am trying to convert from view that there is file svg to PDF. See image below.
enter image description here
See that the word "Febraban" was disappeared... Does anyone know why?
If image from PNG, the system works perfect, but with format .svg nope :(
See the codes below:
CSHTML:
<html>
<head>
#Styles.Render("~/Content/Site.css")
<title>Certificado</title>
</head>
<body>
<table style="width:100%; height:100%;">
<tr>
<td style=" background: #e4e4e2 url('../../Content/Imagens/Imagem_Direita_AQ.svg') top right no-repeat; background-size: auto 100%; text-align: center;">
<h1 class="txt-font-certificado">C E R T I F I C A D O</h1>
<p class="txt-18-preto">
Declaremos que
</p>
<p class="txt-30-azul-Participante">
ÉLITA BORGES SIMIONATO
</p>
<p class="txt-18-preto">
participou do
</p>
<p class="txt-20-azul-evento">
8º Congresso Combate e Prevenção a Lavagem de Dinheiro
<p align="center" class="txt-20-azul-evento">e ao Financiamento do Terrorismo</p>
<p class="txt-18-preto">
de 7/6 a 12/6/18, na cidade de São Paulo/SP,
</p>
<p class="txt-18-preto">
promovido pela Federação Brasileira de Bancos.
</p>
<p class="txt-18-preto">
Carga horária: 18 horas.
</p>
<br />
<img class="txt-assinatura" src="~/Content/Imagens/Assinatura.png" />
</td>
</tr>
</table>
#using (Html.BeginForm("Gerar", "Pdf", FormMethod.Post))
{
<button type="submit">Gerar PDF</button>
}
</body>
</html>
CONTROLLER:
public class PdfController : Controller
{
[HttpGet]
public ActionResult Certificado()
{
return View();
}
public ActionResult Gerar()
{
return new ActionAsPdf("Certificado")
{
PageSize = Rotativa.Options.Size.A4,
PageOrientation = Rotativa.Options.Orientation.Landscape,
PageMargins = new Rotativa.Options.Margins(0, 0, 0, 0),
FileName = Server.MapPath("~/Content/Certificado.pdf")
};
}
}
I hope that you can help me!
Related
i am trying to get an image uploader working inside my MVC project, but everytime i click the upload file button, i get "Error undefined", i am not sure where i am going wrong.
The page is a partial view, loaded inside a #Html.BeginForm . below is the code i am using.
Index.cshtml
#using (Html.BeginForm("Register", "Account", FormMethod.Post))
{
#Html.AntiForgeryToken()
<div class="container">
<div class="row">
<article class="col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
<div id="wid-id-0">
<!-- widget div-->
<div role="content">
<!-- widget content -->
<div class="widget-body">
<div class="row" style="background: white">
<form id="wizard-1" novalidate="novalidate">
<div id="bootstrap-wizard-1" class="col-sm-12">
<div class="tab-content">
#*Tab 1 (Step 1)*#
<div class="tab-pane active" id="tab1">
<br>
#Html.Partial("Registration/_Step1")
<div class="form-actions">
<div class="row">
<div class="col-sm-12">
<ul class="pager wizard no-margin">
<li class="previous disabled">
Previous
</li>
<li data-target="#step2" class="next">
Next
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="form-bootstrapWizard">
<ul class="bootstrapWizard form-wizard" style="background: coral">
<li class="active" data-target="#step1">
<span class="step">1</span> <span class="title">Step 1: Profile Information</span>
</li>
<li data-target="#step2" class="">
<span class="step">2</span> <span class="title">Step 2: Profile Picture</span>
</li>
<li data-target="#step3" class="">
<span class="step">3</span> <span class="title">Step 3: Identification</span>
</li>
<li data-target="#step4">
<span class="step">4</span> <span class="title">Step 4: Submit Profile</span>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
</form>
</div>
</div>
<!-- end widget content -->
</div>
<!-- end widget div -->
</div>
<!-- end widget -->
</article>
</div>
</div>
}
_Step1.cshtml
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(document).ready(function () {
$("#Upload").click(function (e) {
e.preventDefault();
var formData = new FormData();
var totalFiles = document.getElementById("FileUpload").files.length;
for (var i = 0; i < totalFiles; i++)
{
var file = document.getElementById("FileUpload").files[i];
formData.append("FileUpload", file);
}
$.ajax({
type: "POST",
url: '#Url.Action("UploadFiles", "Account")',
data: formData,
dataType: 'json',
contentType: false,
processData: false,
success: function (response) {
alert('succes!!');
},
error: function (error) {
alert("error: " + error.statusMessage);
}
});
});
});
</script>
<table align="center">
<tr>
<td style="text-align: center;"><label>Upload Profile Picture</label></td>
<td></td>
</tr>
<tr>
<td valign="top"><img id="imgPreview" src="~/Content/Images/upload_holder.PNG" class="img-holder" style="width: 180px; height: 180px;" /></td>
<td>
#*<input type="submit" class="btn btn-lg" style="width: 200px; background: #0091d9; color: white;" value="Upload Photo" />*#
#*<input id="input-4" name="input4[]" type="file" multiple class="file-loading" style="width: 200px; background: #0091d9; color: white;" value="Upload Photo">*#
<input type="file" id="FileUpload" multiple />
<input type="submit" id="Upload" value="Upload"/>
<br />
<br />
<label>Acceptable file formats: jpg, gif or png file</label>
<br />
<label>Under 1 MB</label>
</td>
</tr>
</table>
any help is greatly appreciated!
EdIT: Below is the controller function, but its never hit.
[HttpPost]
public ActionResult UploadFiles()
{
// Checking no of files injected in Request object
if (Request.Files.Count > 0)
{
try
{
// Get all files from Request object
HttpFileCollectionBase files = Request.Files;
for (int i = 0; i < files.Count; i++)
{
//string path = AppDomain.CurrentDomain.BaseDirectory + "Uploads/";
//string filename = Path.GetFileName(Request.Files[i].FileName);
HttpPostedFileBase file = files[i];
string fname;
// Checking for Internet Explorer
if (Request.Browser.Browser.ToUpper() == "IE" || Request.Browser.Browser.ToUpper() == "INTERNETEXPLORER")
{
string[] testfiles = file.FileName.Split(new char[] { '\\' });
fname = testfiles[testfiles.Length - 1];
}
else
{
fname = file.FileName;
}
// Get the complete folder path and store the file inside it.
fname = Path.Combine(Server.MapPath("~/Uploads/"), fname);
file.SaveAs(fname);
}
// Returns message that successfully uploaded
return Json("File Uploaded Successfully!");
}
catch (Exception ex)
{
return Json("Error occurred. Error details: " + ex.Message);
}
}
else
{
return Json("No files selected.");
}
}
I have a table like following
CREATE TABLE [dbo].[Movies] (
[fname] NVARCHAR(50) NULL,
[lname] NVARCHAR(50) NULL,
[MoviePoster] VARCHAR (50) NULL,
how to save image to movie poster field and how to view it
[MoviePoster] [varbinary](max) NULL
-- You have to insert image as a BLOB
-- Insert blob script :
INSERT INTO [Movies](MoviePoster)
VALUES (SELECT * FROM OPENROWSET (BULK 'your img url', SINGLE_BLOB))
--Display image in views:
<img src='data:image/jpeg;base64, <--data from db-->' />
How about saving movie poster on your server let's say:
/content/images/movieposters/thearrival.jpg
and storing in MoviePoster field only the filename thearrival.jpg
I personally prefer this approach because if let's say your database will grow and you will have more visitors ...well, you will be able to move all your movie posters to a different server and free up a lot of load from application server.
Creat an "Images" folder in Solution explorer.
Create an ADO.NET Entity Data Model (in this example is "Database1Entities")
Home Controller
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace test2.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult FileUpload(HttpPostedFileBase file)
{
if (file != null)
{
Database1Entities db = new Database1Entities();
string ImageName = System.IO.Path.GetFileName(file.FileName);
string physicalPath =Server.MapPath("~/images/"+ ImageName);
// save image in folder
file.SaveAs(physicalPath);
//save new record in database
tblA newRecord = new tblA();
newRecord.fname = Request.Form["fname"];
newRecord.lname = Request.Form["lname"];
newRecord.MoviePoster = ImageName;
db.tblAs.Add(newRecord);
db.SaveChanges();
}
//Display records
return RedirectToAction("../home/Display/");
}
public ActionResult Display()
{
return View();
}
}
}
Index View
#{
ViewBag.Title = "Index";
}
#using (Html.BeginForm("FileUpload", "Home", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div>
First name<br />
#Html.TextBox("fname") <br />
Last name<br />
#Html.TextBox("lname") <br />
Image<br />
<input type="file" name="file" id="file" style="width: 100%;" /> <br />
<input type="submit" value="Upload" class="submit" />
</div>
}
DisplayView
#{
ViewBag.Title = "Display";
}
#{
test2.Database1Entities db = new test2.Database1Entities();
}
#using (Html.BeginForm())
{
<table border="1">
<thead>
<tr>
<th>Image</th>
<th>First name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
#foreach (var item in db.tblAs)
{
<tr>
<td><img src="~/images/#item.imageUrl" width="100" height="100" /> </td>
<td>#item.fname</td>
<td>#item.lname</td>
</tr>
}
</tbody>
</table>
}
The OutPut will be a table with viewed image from the database
Actually you can store the image on Db as well. You don't need to keep it on the server as a file if you don't want to (if you have lots of movies it would be a problem to manage).
If you are using SQL Server there is a "image" data type. If you are using MySql you should use BLOB.
I am using MVC, so:
The Model (partial code) (while in SqlServer you will declare image, inside the model the type will be byte[]:
public byte[] PersonImage { get; set; }
Inside the same model you are going to need a method to retrieve the path:
public string GetPicture()
{
if (PersonImage == null)
{
return null;
}
var base64Image = System.Convert.ToBase64String(PersonImage);
return $"data:{ImageContentType};base64,{base64Image}";
}
The create action inside the controller (The action declaration will need to receive an IFormFile PersonImage), on my case I am handling the image upload on the register action of my controller (Some of the controller code has been taken off to be more concise):
public async Task<IActionResult> Register(RegisterViewModel model, Client client, Employee employee, Person person, IFormFile PersonImage, string returnUrl = null)
if (PersonImage != null)
{
using (var stream = new MemoryStream())
{
await PersonImage.CopyToAsync(stream);
person.PersonImage = stream.ToArray();
person.ImageContentType = PersonImage.ContentType;
}
}
_context.Add(person);
await _context.SaveChangesAsync();
And now the view, you need to add the enctype to the form:
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4">
<form asp-route-returnUrl="#ViewData["ReturnUrl"]" method="post" enctype="multipart/form-data">
<h2 class="text-center font-weight-bold">Create a new account.</h2>
<hr />
<div asp-validation-summary="All" class="text-danger"></div>
<div class="form-group">
<label asp-for="#person.PersonImage" class="control-label"></label>
<input type="file" asp-for="#person.PersonImage" class="form-control" />
<span asp-validation-for="#person.PersonImage" class="text-danger"></span>
</div>
<button type="submit" class="btn btn-default">Register</button>
</form>
</div>
<div class="col-md-4"></div>
</div>
Again, I took off most of the code to get a better and concise example. I had a hard time to find this when I was trying to put some images to the Db.
[HttpPost]
public ActionResult AddEmployee(HttpPostedFileBase file)
{
using(DbEntities DB = new DbEntities())
{
TblImage tblimg=new TblImage();
if (file != null)
{
var fileName = Path.GetFileName(file.FileName);
file.SaveAs(Server.MapPath("~/Data/EmployeeProfileImage/" + fileName));
tblimg.image = "~/Data/EmployeeProfileImage/" + fileName;
}
DB.TblImages.Add(tblimg);
DB.SaveChanges();
}
return View();
}
INDEX
#{
ViewBag.Title = "Index";
}
<link href="~/bootstrapp/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/bootstrapp/js/bootstrap.min.js"></script>
<style>
table, th, td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
<h2>Index</h2>
#using (Html.BeginForm("Index", "Candidate", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div class="container">
<table>
<tr><td colspan="2" style="width:800px;height:50px">candidate</td></tr>
<tr><td>#*<label>Id</label><input type="number" name="candidateID" />*#</td></tr>
<tr>
<td style ="width:10px;height:10px">
<label>Name</label> <input type="text" name="Name" />
</td>
<td style="width:80px;height:50px"><label>Binary Image</label>
<input type="file" name="file1" id="file1" style="width: 100%;" /> <br />
</td>
</tr>
<tr>
<td>
<label>Address</label> <input type="text" name="address" />
</td>
<td>
<label>Path Image</label> <input type="file" name="file2" id="file2" style="width: 100%;" />
</td>
</tr>
<tr>
<td>
<label>JobProfile</label> <input type="text" name="JobProfile" />
</td>
<td>
<label>Email</label> <input type="text" name="email" />
</td>
</tr>
<tr><td>
<label>Phone No.</label> <input type="number" name="phone" />
</td><td ><input type="submit" value="Submit"/></td></tr>
</table>
</div>
}
#Html.Partial("~/Views/Candidate/detail.cshtml")
DETAIL
#*#model List< angularmvcdemo.CandidateDetail>*#
#using angularmvcdemo.Models;
<link href="~/bootstrapp/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/bootstrapp/js/bootstrap.min.js"></script>
<style>
table, th, td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
#{
modeldataEntities db = new modeldataEntities();
//angularmvcdemo.modeldataEntities db = new angularmvcdemo.modeldataEntities();
}
<table>
<tr><td colspan="2" style="width:800px;height:50px">candidate</td></tr>
#foreach(var detail in db.CandidateDetails){
<tr>
<td style="width:10px;height:10px">
<label>Name</label>#detail.Name
#*<input type="text" name="Name" />*# </td>
<td> binary image
#if (detail.BinaryPhoto != null)
{ var base64 = Convert.ToBase64String(detail.BinaryPhoto);
var imgsrc = string.Format("data:image/jpg;base64,{0}", base64);
<img src='#imgsrc' style="max-width:100px;max-height:100px" />
}
else { <img src="~/img/avatar-default.jpg" style="max-width:100px;max-height:100px" /> } </td>
</tr>
<tr>
<td>
<label>Address</label> #detail.address </td>
<td><label>path image</label>
#if(#detail.PathPhoto!=null){ <img src="#detail.PathPhoto" width="100" height="100" />
}else{ <img src="~/img/avatar-default.jpg" style="max-width:100px;max-height:100px" /> } </td>
</tr>
<tr>
<td>
<label>JobProfile</label>#detail.JobProfile </td>
<td>
<label>Email</label> #detail.email </td>
</tr>
<tr><td></td><td><label>Phone No.</label>
#detail.phone</td><</tr>
}
</table>
Hi I have a problem when I try to access a page in my application directly. When I navigate within the application to the page, does everything work.
<input type="button"
class="btn btn-primary"
id="calulate"
value="Finanzierungsrate berechnen"
onclick="location.href ='#Url.Action("calculate", "RatesKit", new { id = "bc338d8d-58b9-4867-9730-6b92a516a496"}) '" />
Here the controller method:
[HttpGet]
public ActionResult calculate(string id, string objectDescription, string objectPrice)
{
if (string.IsNullOrEmpty(id))
{
return RedirectToAction("NotValid");
}
else
{
if (Validator.ValidateToken(id, out bob))
{
OfferRequest request = Session["RequestOffer"] as OfferRequest;
if (request != null)
{
ViewData["Dealer"] = bob;
//..
}
}
else
{
return RedirectToAction("NotValid");
}
return View();
}
}
when I reload the page with F5, the page loaded without Problems. But if I try to access the site directly (Just hit enter in the address bar of Browser), I get the following error message:
Definitely, theres is no mistake at this point! If I remove the Razor Syntax #DateTime.Now.Year the fault is located at a different point with Razor syntax.
I do not know, why there is an error only with direct access.
Similar problems I've already looked at, unfortunately without solution to my problem.
System.NullReference Exception occurred in App_Web_XXX.dll - Error in Partial View
System.NullReferenceException in App_Web_*.dll
Thanks for any advice
Her the full page:
#{
ViewBag.Title = "Finanzierungsrate berechnen";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<meta charset="utf-8" />
<div align="center">
<h2>Finanzierungsrate berechnen</h2>
<div style="max-width:700px;">
<div id="ratesView">
#{Html.RenderPartial("ViewCalculateRate", ViewData);}
</div>
</div>
</div>
<table>
<tr>
<td valign="top" class="footerContent" style="padding-top: 20px;color: #878780; font-size: 11px; text-align: left;">
© #DateTime.Now.Year XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX Alle Rechte vorbehalten. Impressum
</td>
</tr>
<tr valign="top" class="footerContent" style="padding-top: 20px; color: #878780; font-size: 11px; text-align: left;">
<td>Wir übernehmen keine Gewähr für die Richtigkeit dieser Berechnung.</td>
</tr>
</table>
<div id="backbutton" style="padding:20px 0; display:inline-block;">
<input type="button"
class="btn btn-primary btn-xs"
id="backButton"
value="Zurück"
onclick="location.href ='#Request.UrlReferrer.AbsoluteUri'" />
</div>
I got it....
<div id="backbutton" style="padding:20px 0; display:inline-block;">
<input type="button"
class="btn btn-primary btn-xs"
id="backButton"
value="Zurück"
onclick="location.href ='#Request.UrlReferrer.AbsoluteUri'" />
</div>
Request does not exist when I go directly to the page. So I was unable to create the button ...
THX Sometimes you have to look at the code times from the outside.
I have a question , I have in my view a form, this form contains a list , this list contains four attributes , vendor , application , product and value , these 4 we display only two ( as seen in the code) would like to display in a modal product and the value of the order , the list is displayed in the same position already has such data , how do I display that data through an action of my button that has the action " getFornecedor " ( this action has not yet been implemented , I do not know if it is necessary because the elements are in the same position in the list )
View
#model Test.Models.Order
<head>
<meta charset="utf-8" />
<title>Teste</title>
<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css">
<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
#Styles.Render("~/Content/bootstrap.css")
#Scripts.Render("~/bundles/modernizr")
<style>
th {
height: 10px;
}
</style>
</head>
<body>
<div id="divbody">
<nav class="navbar navbar-inverse">
</nav>
#using (Html.BeginForm("Save", "Cab", FormMethod.Post))
{
<div class="table-responsive" id="table">
<table id="myTable" class="table table-striped" cellspacing="0">
<thead style="position:static">
<tr>
<th style="font-size:10px">SELECT</th>
<th style="font-size:10px">CONTACT</th>
<th></th>
<th style="font-size:10px">SUPPLY</th>
<th style="font-size:10px">ORDER</th>
</tr>
</thead>
#for (int i = 0; i < Model.listOrder.Count(); i++)
{
<tr>
<td align="center" height="2px">#Html.CheckBoxFor(m => m.listOrder[i].isEdit, new { #onclick = "habilit(" + i + ")", #id = "c" + i })</td>
<td colspan="2">
<a href="#Url.Action("getFornecedor", "MyController")" class="btn btn-xs btn-primary">
<i class="glyphicon glyphicon-phone-alt"></i>
</a>
<a href="#Url.Action("sendEmail", "MyController")" class="btn btn-xs btn-primary">
<i class="glyphicon glyphicon-envelope"></i>
</a>
</td>
<td height="2px"> #Html.TextBoxFor(m => m.listOrder[i].supply, new { #readonly = "readonly", #size = "18px", #class = "form-controlSupply" }) </td>
<td height="2px"> #Html.TextBoxFor(m => m.listOrder[i].order, new { #readonly = "readonly", #size = "75px", #class = "form-controlOrder" }) </td>
<td></td>
</tr>
}
</table>
</div>
<br />
<input type="submit" value="Salve" id="btn" disabled="disabled" class="btn btn-small btn-primary" />
}
</div>
</body>
</html>
MVC doesn`t have modal on fly .. (like control in web forms for example) i suggest you to use third party library , may be something like jquery UI .. You can see example here : https://jqueryui.com/dialog/
You just need client side event to show modal dialog. In that container you can put any data that you want.
Just melt my brain out trying to figure out why I'm getting Parser Error with this code:
#foreach(var news in Model.News)
{
if (news.Order > 0)
{
<text>
<div class="colPrincipal newsTop newsBlue">
<article>
<a href="news.html">
</text>
if (news.LayoutExibitionMainImage)
{
<text>
<span class="newsImg">
<img src="~/Content/img/news/not2.jpg" alt="" title="" />
</span>
</text>
}
<text>
<hgroup>
</text>
if (news.LayoutExibitionMainTitle)
{
<text>
<h1>
#Html.Raw(news.Title)
</h1>
</text>
}
if (news.LayoutExibitionMainSummary)
{
<text>
<h2>
#Html.Raw(news.Summary)
</h2>
</text>
}
<text>
</hgroup>
<span class="btnMais">Ler este artigo</span>
</a>
</article>
</div>
</text>
}
}
Its throwing this error on my last <text> tag:
Is there a way to fix this or a better way to print that HTML code? I hope this is not a silly question because is wierd to me.
Try this, i think you have an issue with all those text tags. Also text is not allowed in the hgroup tags.
#foreach(var news in Model.News)
{
#if (news.Order > 0)
{
<div class="colPrincipal newsTop newsBlue">
<article>
<a href="news.html">
#if (news.LayoutExibitionMainImage)
{
<span class="newsImg">
<img src="~/Content/img/news/not2.jpg" alt="" title="" />
</span>
}
<hgroup>
#if (news.LayoutExibitionMainTitle)
{
<h1>
#Html.Raw(news.Title)
</h1>
}
#if (news.LayoutExibitionMainSummary)
{
<h2>
#Html.Raw(news.Summary)
</h2>
}
</hgroup>
<span class="btnMais">Ler este artigo</span>
</a>
</article>
</div>
}
}