Bootstrap for ASP.Net MVC Published!

7283OS

I’m very proud and happy to announce that my book, Bootstrap for ASP.NET MVC has been published and is available for purchase.

This book guides developers on what is Bootstrap, how to include it in your project and even how to create HTML Helpers as well as T4 templates to generate Bootstrap ready Razor views.

I hope developers will find it a useful resource, and will enjoy the book as much as I enjoyed writing it.

 

 

 

You can purchase Bootstrap for ASP.NET MVC from the following stores:

Calling Yahoo Weather web-service from an Outlook add-in

It’s been a while since my last blog post and today we start the first in a series of exciting blog posts on integrating Microsoft Office applications with web-based services. The web is growing bigger and bigger by the day and there are a wide range of applications and services available on the internet which you can use to provide your users with more features and functionality inside Microsoft Outlook.

In today’s article, we’ll build an Outlook Add-in that displays the current weather conditions and time of day for all recipients of an e-mail using the Yahoo Weather web-service. At the end of this article, our Outlook add-in will resemble the following screenshot:

outlook-addin-intergrated-webservice

Read more at Add-in Express.

To see all my recent Add-in Express blog posts visit my author page.

Returning a Crystal report as a PDF ActionResult in ASP.Net MVC

In a recent project I needed to display a generated PDF contract document inside the browser. I found a great article by Patrick Kalkman illustrating how to create a custom ActionResult that converts a HTML string into a PDF using the iTextSharp library.

This seemed like the perfect solution, however, I later found that the conversion from HTML to PDF is not perfect at all and getting your design to look the same in PDF as it does in HTML is not easy. So I found another article by Hasibul Haque, where he shows how to return a Crystal Report as PDF using ASP.Net MVC.

The Crystal Report approach works well, as your design will look perfect. The only problem I had was Hasibul’s approach returned the PDF as a download and I wanted to display it inside the browser. I combined Patrick and Hasibul’s approaches and what I came up with was a CrystalReportPdfResult

The CrystalReportPdfResult is an ASP.Net ActionResult, that return the Crystal Report as a PDF file. The result (using an iframe) looks like this inside the browser:

image

Creating the CrystalReportPdfResult class

To generate the result as indicated by the previous image, follow these steps:

  1. Create a folder inside your ASP.Net MVC project called Pdf.
  2. Add a new class to this folder called CrystalReportPdfResult.cs.
  3. The new class will inherit from the ASP.Net MVC ActionResult class.

The entire code listing for the CrystalReportPdfResult class follows:

CrystalReportPdfResult.cs
  1. public class CrystalReportPdfResult : ActionResult
  2. {
  3.     private readonly byte[] _contentBytes;
  4.  
  5.     public CrystalReportPdfResult(string reportPath, object dataSet)
  6.     {
  7.         ReportDocument reportDocument = new ReportDocument();
  8.         reportDocument.Load(reportPath);
  9.         reportDocument.SetDataSource(dataSet);
  10.         _contentBytes = StreamToBytes(reportDocument.ExportToStream(ExportFormatType.PortableDocFormat));
  11.     }
  12.  
  13.     public override void ExecuteResult(ControllerContext context)
  14.     {
  15.  
  16.         var response = context.HttpContext.ApplicationInstance.Response;
  17.         response.Clear();
  18.         response.Buffer = false;
  19.         response.ClearContent();
  20.         response.ClearHeaders();
  21.         response.Cache.SetCacheability(HttpCacheability.Public);
  22.         response.ContentType = "application/pdf";
  23.         
  24.         using (var stream = new MemoryStream(_contentBytes))
  25.         {
  26.             stream.WriteTo(response.OutputStream);
  27.             stream.Flush();
  28.         }
  29.     }
  30.  
  31.     private static byte[] StreamToBytes(Stream input)
  32.     {
  33.         byte[] buffer = new byte[16 * 1024];
  34.         using (MemoryStream ms = new MemoryStream())
  35.         {
  36.             int read;
  37.             while ((read = input.Read(buffer, 0, buffer.Length)) > 0)
  38.             {
  39.                 ms.Write(buffer, 0, read);
  40.             }
  41.             return ms.ToArray();
  42.         }
  43.     }
  44. }

 

Creating the Crystal Report

Next, we need to create the Crystal Report that will be returned as a PDF. Do this by following these steps:

  1. Create a new folder called Reports in your project.
  2. Add a new Crystal Report object to the Reports folder. You can find the item template under the Reporting tab on the Add New Item dialog.image
  3. Design the report to your liking and save it.
  4. If you need to install Crystal Reports for Visual Studio 2013, get it here.

Creating the Action that will return the PDF

Next, we need to create the actual Action on a Controller that will return the CrystalReportPdfResult, by following these steps:

  1. Open your controller. In this example, we’ll use the HomeController.
  2. Add a new method called Pdf that will return a CrystalReportPdfResult object.
  3. Inside this method, we’ll build a list of customer that will be used as data for the report and build the path to the report filename. The code for the method follows:
  1. public CrystalReportPdfResult Pdf()
  2. {
  3.     List<Customer> model = new List<Customer>();
  4.     model.Add(new Customer { CompanyName = "Blah Inc.", ContactName = "Joe Blogs" });
  5.     string reportPath = Path.Combine(Server.MapPath("~/Reports"), "rptCustomers.rpt");
  6.     return new CrystalReportPdfResult(reportPath, model);
  7. }

 

Creating the View

We’ll embed the PDF using an <iframe>, so open a view. In this case we’ll  use About.cshtml and replace it’s mark-up with the following:

About.cshtml
  1. @{
  2.     ViewBag.Title = "Customer Report";
  3. }
  4. <h2>@ViewBag.Title.</h2>
  5. <p>This is the customer report</p>
  6.  
  7.  
  8. <div class="row">
  9.     <div class="col-md-10">
  10.         <iframe src="@Url.Action("Pdf", "Home")" height="500" width="100%"></iframe>
  11.     </div>
  12.     <div class="col-md-2">
  13.         <h3>Other page content</h3>
  14.         <button type="button" class="btn btn-primary">Click here</button>
  15.     </div>
  16. </div>

 

Note, that we’re using the @Url.Action helper to set the src attribute of the <iframe> element. This will make a call to the Pdf action on the Home controller and render the result inside the <iframe>

I’ve tested this on the latest version of Chrome, Firefox and Internet Explorer and it works on all of them.

Hope this helps someone that needs something similar. Thank you for reading. Until next time, keep coding!

Download the sample project here.

If you have any comments or questions, please feel free to ask leave a comment or drop me a line on Twitter.

Need help with you next ASP.Net MVC Project?
Do you need guidance with your next .Net project?
Contact me for ASP.Net MVC and .Net software development and consulting.

Microsoft Outlook Email Templates for Web Designers and Developers Add-in

Bea Kylene Jumarang wrote a great piece listing some very handy email templates for web developers and designers. I found the information so valuable I could not help but create a Microsoft Outlook (2007, 2010 and 2013) Add-in that automatically inserts the templates for you.  It’s released under the GNU General Public License, which means it is completely free for you to use and share with your friends and colleagues.

Thanks Bea!

Download the add-in here.

Note that the actual templates are free for commercial and personal use, but you’re not allowed to sell it or claim it as your own. So for the sake of complete disclosure, I did not create the templates, I only created the Outlook add-in that automatically inserts the template text into your Outlook e-mail.

How it works

The add-in adds a new “Templates for Developers and Designers” tab to the Outlook E-mail window:

image

Clicking on the “Insert Template” button lists all the available templates:

image

Clicking on the template name, automatically inserts the template into the e-mail. If the e-mail has a recipient the recipient’s name will automatically be inserted into the e-mail as well:

image

This functionality will work when composing a new e-mail and when replying to an existing mail.

The Templates

All the templates are stored inside your My Documents folder inside a folder called TemplatesForDevsAndDesigners.

image

Each template has its own folder and inside this folder the actual template called template.html. You can edit this .html file in any text editor to customize the template to your liking.

It’s as easy as that. I hope you find the add-in useful.  Any comments, suggestions or bug reports, fire away in the comments or get in touch with me on Twitter.

You can download the add-in here.

SQL Server for Excel

After numerous requests, I’ve updated the SQL Connector for Excel and renamed it to SQL Server for Excel.
We can’t allow the MySQL guys to have all the fun.

Download the early Beta version from http://www.sqlforexcel.com/

Introducing the Bootstrap Bundle for ASP.Net MVC

Ever wished you could create an ASP.Net MVC website with the click of a few buttons, and selecting a few options? Now you can, The Bootstrap Bundle contains 15 different project and 16 item templates for Visual Studio 2013, that make creating a ready to go website a breeze.

It’s free, have  a look at www.bootstrapbundle.com or download it from Visual Studio Gallery.

Excel Online & Google Sheets for developers – what’s the difference?

In the last few weeks we’ve covered a lot of aspects of both Google Sheets and Excel Online and we’ve seen that both platforms offer developers various options to customize and integrate with. We also realized that each platform has as a number of caveats as well as a number of redeeming qualities.

In this article we’ll evaluate what we’ve learned so far about Google Sheets and Excel Online and compare the two platforms and what it means for developers.

Read more at Add-in Express.

To see all my recent Add-in Express blog posts visit my author page.

Creating Apps for Microsoft Outlook

In the last couple of weeks we’ve explored many aspects of both Google and Microsoft’s online offerings when it comes to Office productivity.

Gmail provides us with two options to add our own custom functionality in the form of sidebar and contextual gadgets.

Microsoft offers the JavaScript API for Office to developers which allows you to create Apps for Outlook using HTML, CSS and JavaScript. As we’ve discussed in earlier articles, the API does not perform the same level of customization options as the COM based object model, but we are seeing Microsoft investing heavily in the online space so we might get some mayor improvements and enhancements in the future.

Read more at Add-in Express.

To see all my recent Add-in Express blog posts visit my author page.

Developing Gmail contextual gadgets

In my last article, we explored How to develop Gmail sidebar gadgets. In today’s article we’ll take a closer look at what is involved in creating a contextual gadget for Gmail. Gmail contextual gadgets are a good way to add additional functionality to Gmail allowing your user to perform tasks right from inside their Gmail session.

Read more at Add-in Express.

To see all my recent Add-in Express blog posts visit my author page.

Extending Google Gmail with sidebar gadgets

Google Mail or Gmail provides developers with an extensibility model in the form of Gmail gadgets. Gmail gadgets come in two flavors: Sidebar gadgets and contextual gadgets.

Sidebar gadgets are shown on the left hand side of the Gmail user interface, just underneath the list of folders – this can be compared to setting your Add-in Express Advanced Task pane’s ExplorerLayout property to BottomNavigationPane.

Contextual gadgets are gadgets that run when certain clues are detected in Gmail. This can be a based on text in the subject or in the message body. For example the translate gadget in Gmail is automatically shown when a foreign language is detected.

Read more at Add-in Express.

To see all my recent Add-in Express blog posts visit my author page.