Posts

Donate

Unable to get value of the property 'nodeType': object is null or undefined (Knockout JS)

After completing a simple binding using Knockout Javascript framework, I decided to transfer the script tags to the header section of the page. Upon running my code, I stumbled upon an error as stated on the title. I believe, the DOM elements have not been initialized when the binding occurs. One solution I came up was to transfer the view model script inside the document ready function. <head runat= "server" > <title>Integrate jQuery with Knockout!</title> <script type= "text/javascript" src= "Scripts/knockout-3.1.0.js" ></script> <script type= "text/javascript" src= "Scripts/jquery-1.7.1.min.js" ></script> <script type= "text/javascript" > $(document).ready( function () { var myViewModel = { personName: 'PsychoGenes' , personAge: 33 }; ko.applyBindings(myViewModel); }); </scri

Simple Knockout.js Example In ASP.NET Web Forms

Image
Intrigued with emerging Javascript framework called knockout, I decided to try a simple example myself. As defined by Wikipedia: Knockout is a standalone JavaScript implementation of the Model-View-ViewModel pattern with templates. The underlying principles are therefore: 1. A clear separation between domain data, view components and data to be displayed 2. The presence of a clearly defined layer of specialized code to manage the relationships between the view components The features of Knockout are based on Declarative bindings: A. Automatic UI refresh (when the data model's state changes, the UI updates automatically) B. Dependency tracking C. Templating (using a native template engine although other templating engines can be used, such as jquery.tmpl) I come to a conclusion that this has similar approach to WPF MVVM. So, to get started with, download the latest Knockout.js framework here: Knockout Home Page and add reference to your html or aspx markup: Code: <!

Loop Through HTML Elements Using GeckoFX WebBrowser

Hello, Below are snippets on how to loop through HTML Elements Using GeckoFX WebBrowser both in C# and VB.NET. C#: 1 2 3 4 5 //Note: this.DomDocument is a class which inherits the GeckoWebBrowser control foreach (GeckoElement element in this .DomDocument.GetElementsByTagName( "span" )) { //some codes here } VB.NET: 1 2 3 4 'Note: this.DomDocument is a class which inherits the GeckoWebBrowser control For Each element As GeckoElement In Me .DomDocument.GetElementsByTagName( "span" ) 'some codes here Next

Predicate Wrapper Custom Class in C#

Based from this post: Predicate Wrapper Custom Class in VB.NET , here's the equivalent classes in C#. FindTrack class: public class SystemTrack { public int ID { get ; set ; } public string Author { get ; set ; } public string Title { get ; set ; } public static bool FindIndexTrackNumber(SystemTrack systrac, int searchArg) { return systrac.ID.Equals(searchArg); } } Predicate Class: public delegate bool PredicateWrapperDelegate<T, A>(T item, A argument); public class PredicateWrapper <T, A> { private A _argument; private PredicateWrapperDelegate<T, A> _wrapperDelegate; public PredicateWrapper(A argument, PredicateWrapperDelegate<T, A> wrapperDelegate) { _argument = argument; _wrapperDelegate = wrapperDelegate; } private bool InnerPredicate(T item) { return

Zooming Visual Studio 2012 Code Editor

Image
Just received a newsletter from dotnet videos regarding zooming in/out the code editor. In that email, there were three ways. However, there are several options to do it as presented below: 1). Using the zoom drop down control below the code editor. 2). Using Keyboard combinations: Zoom OUT = Ctrl + Shift + Comma, Zoom IN = Ctrl + Shift + Period 3). Type a zoom level directly in the the zoom control in the bottom left corner of the editor 4). Select a common zoom level from the dropdown list in the zoom control 5). Hold Ctrl key and scroll the mouse wheel (up/down). References: Visual Studio 2012 Zoom In or Zoom Out Visual Studio 2010 Zoom In or Zoom Out Cheers!

ASP.NET MVC 4 Built-in Form Based Authentication

Image
Given that I have some background knowledge of ASP.NET Web Forms Authentication, I decided to try experimenting on MVC 4 authentication/authorization framework. Most of the articles in the internet regarding forms authentication in ASP.NET MVC are custom based approach and less on the built-in technology which is WebData.WebSecurity usage. Not until I found these articles: a. Forms Authentication Customized b. Introduction to forms based authentication in MVC 4 c. Authenticating Users In Asp.net MVC 4 So, to cut the story short, I made an application which utilized the built-in WebMatrix authentication in MVC 4. The first thing to do, is to familiarize those articles to get a good grasp on the topic. The setup of my application are as follows: 1. Web.config      1.1 Added authentication and custom errors <authentication mode= "Forms" > <forms loginUrl= "~/Account/Login" timeout= "2880" /> </authentication>

Redirect Unauthorized Access To A Custom View Instead Of Redirecting To A Login View In ASP.NET MVC 4

One might encounter when implementing the forms authentication framework(WebMatrix)is that when a user access a specific url/controller and he/she is unauthorized, the application always redirect's to the default log-in view. In order to solve this minor issue, one solution is to develop a custom class that inherit's the AuthorizeAttribute class and override the HandleUnauthorizedRequest method as shown below: public class AuthorizeUsersAttribute : AuthorizeAttribute { private string redirectUrl = "" ; public string NotifyUrl { get { return redirectUrl; } set { redirectUrl = value ; } } public AuthorizeUsersAttribute() : base () { } public AuthorizeUsersAttribute( string redirectUrl) : base () { this .redirectUrl = redirectUrl; } protected override void HandleUnauthorizedRequest(Authorizati

You must call the "WebSecurity.InitializeDatabaseConnection" method before you call any other method of the "WebSecurity" class

In the Account Controller Register action (public ActionResult Register(RegisterModel model)) I have a code below that by default assign a Customer Role to a new user during registration. In my database, the defined roles are "Administrator" and "Customer". However, the code below generates exception as stated on the title post. SimpleRoleProvider role = new SimpleRoleProvider(); role.AddUsersToRoles( new string [] { model.UserName }, new string [] { "Customer" }); The solution would be to use the Role class defined in System.Web.Security namespace instead of SimpleRoleProvider: Roles.AddUserToRole(model.UserName, "Customer" ); Reference: Perils of MVC 4 AccountController Cheers! :)

Render ASP.NET MVC 4 Partial View Based From Html.DropdownList() Selected Value Using jQuery

Image
In my previous post on loading items to Select control, I decided to create a more advanced example by rendering an asp.net mvc partial view using jquery based on drop down selection. The mvc application will simply load all orders irregardless of the status made by a particular customer selected from the dropdown list. The application also calculates the total orders made by the customer using jquery numberformatter framework. Partial View: @model IList <ShowWebGridUsingJQuery.Models.SalesOrderHeader> @{ Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml"; } @{ var orderTotal = Model.Sum(o => (float)o.TotalDue); WebGrid grid = new WebGrid(Model); } <script type= "text/javascript" > $(document).ready(function () { var total = 0; $('#divGrid .totalDue').each(function () { total = total + parseFloat($(this)[0].innerHTML.toLocaleString().replace(",", &q

Populate Select/ListBox items From Html.DropdownList() Selected Value Using jQuery In ASP.NET MVC 4

Image
After familiarizing some basic concepts on ASP.NET MVC 4, I decided to create a simple application which populates a listbox control from a DropDownList helper selected value using jQuery. This simple application included the Entity Framework which targets the AdventureWorks DB.Here's the Model Class: public class CountryRegionsContext : Models.AdventureWorks2008Entities { public DbSet<CountryRegion> Country_Regions { get ; set ; } public DbSet<StateProvince> State_Province { get ; set ; } } Here's the View page: @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } <h2>Adventure Works Country and State Province Information</h2> <script> $(document).ready( function () { $( "#State" ).prop( "disabled" , true ); $( "#Country" ).change( function () { if ($( "#Country" ).val() != "Select&quo

Donate