This article explains how to implement carousel image gallery with AngularJS UI Bootstrap and Entitiy Framework database first approach in ASP.NET MVC. Angular UI Bootstrap repository contains a set of native AngularJS directives based on Twitter Bootstrap’s markup and CSS. As a result NO dependency on jQuery or Bootstrap’s JavaScript is required.
We will follow these steps to implement carousel:
1. Create a method to get image path, title and summary from database using EF.
2. Call the above method in AngularJS and set response to property.
3. Use <carousel>,<slide> elements with the bindings in the view to display carousel.
Month: September 2013
Cascading DropDownList with AngularJS and ASP.NET MVC
This article explains how to create cascading dropdownlists with AngularJS, Entity Framework Database First approach in ASP.NET MVC.
We are going to implement Country, State dropdownlists.
1. Assuming you have added “ADO.NET Entity Data Model“(.edmx) in the project for your database. Consider the following structure in edmx:
Displaying ModelState Errors with AngularJS in ASP.NET MVC
This article explains how to display all ModelState errors (like validationsummary) in ASP.NET MVC using AngularJS.
I am using ASP.NET MVC > Internet application template in VS2012 for this post.
Install Angularjs Nuget package by running following command in package manager console:
Install-Package angularjs
AngularJS and AntiForgeryToken in ASP.NET MVC
In my previous article, we have implemented form validation including username availability Check with AngularJS. Now we will use ASP.NET MVC’s AntiForgeryToken to prevent Cross-Site Request Forgery (CSRF) Attacks. It generates a hidden form field (anti-forgery token) that is validated when the form is submitted. I see some tutorials, but I want to do in AngularJS way.
Username Availability Check with AngularJS in ASP.NET MVC
In my previous article, We have implemented to check username availability in ASP.NET Web Forms using jQuery Validation Plugin. In this article, we will do same thing in ASP.NET MVC, but using AngularJS(An open-source MV* JavaScript framework for building dynamic web apps).
Username Availability Check in ASP.NET Web Forms with jQuery Validation Plugin
Combine Images into Facebook Style Collage in ASP.NET Web Forms
Facebook home page displays a collage of random profile photos which makes it something special. So I decided to implement the same thing in ASP.NET. In this tutorial, we will do following things:
1. To get random image names from database using Entity Framework Database First approach.
2. Calculate the total needed images for a given width and height. Assuming all profile images have same size.
3. Combine multiple images into collage using C# graphics
4. Add borders to differentiate images
5. Create linear horizontal opacity gradient for the collage and add it in a page similar to Facebook.