Serializing A PagedList Using JSON.NET In ASP.NET MVC – Gotcha And Workaround

Recently I discovered that there’s no one standard way for AJAX-driven server-side paging in ASP.NET MVC (in Web API, you can expose an IQueryable). For the case in hand, I decided to use PagedList for the server bit of the game.


The PagedList interface looks a bit like this (for demonstration only, real code is a bit different, check its source code for the real stuff):

It provides nice properties for paging, and exposes itself as enumerable and has an indexer. Apart from this snippet, the library also provides an extension method ToPagedList() to apply to any enumerable and allow it to populate the properties from it (by enumerating on it, and by calling the Count() method).

We were also using JSON.NET for JavaScript serialization, which is pretty much defacto standard nowadays.

The JSON.NET Serialization Problem

JSON.NET has a nice implementation, if you serialize a class that implements IEnumerable<T>, and you don’t have a special treatment rule for it (via what JSON.NET calls “Converter” classes), when you serialize an instance of the class to JavaScript, it will be serialized as a JavaScript array, where the enumerated objects are the contents of this array. Makes lots of sense right?

Well, yes, except when you have a custom collection like PagedList, and you want to treat it as an object that has several properties, not as an array. JSON.NET does provide a solution for this actually, all you need to do is apply the [JsonObject] attribute to your class.

Unless you don’t own the source code of this class.

In this case, you need to inherit from it. By doing this, I lose the nice ToPagedList() extention method (because it creates an object of the PagedList class directly), but luckily it does nothing but calling new PagedList() with the parameters we give it, so, we don’t lose much.

Here’s how my implementation looks like:

Apart from having to copy the constructors to pass parameters to the base ones, have you noticed the extra Items property in there?

That’s because the Subset member it includes is actually a field, not a property, and JSON.NET won’t serialize that by default, I could override it somewhere else, but since I’m fiddling with this here, it made sense to just stick a property to the class.

Bonus: A Bit More On Implementation

In my actual code, I have added the Dynamic Linq NuGet package, and assumed a single property for sorting (which was fair for the situations where I intend to use this), so, I complemented the code above with another class that looks like this:

This allows the controller to instantiate an instance of the SerializablePagedList class, pass it all the way to whatever repository method I have.

The repository method will take it as a parameter, work out what IQueryable it needs, and instead of passing it to UI, it calls CreatePagedListFromQueryable(), which returns an innocent-looking PagedList object (because SerializablePagedList inherits PagedList) that the repository can pass back to the controller, which can serialize it to JavaScript without a problem, then the rest is all JavaScript code to work out how create the paging parameters, and how to use the returned paging hints.

Even more, now that I think about it, maybe I should change the return type to SerializablePagedList, to make the Items property visible to the developer (because they’d think it’s magic, and in coding, magic is BAD). I’ll leave this as an exercise for you :)

Final Words / Disclaimer

The motivation behind this post is that I found the problem of serializing PagedList using JSON.NET a challenge and I wanted to help others work it out faster than I did. Is this how I’d recommend doing paging? Well, I don’t know, but if it’s what you choose, I hope that I have saved you some time.

And more importantly, is it good enough to be the defacto standard I mentioned I was after in the beginning of the post? Not really. I think it’s not bad, but definitely not the best. I’d love to see less clever (read: hacky), and more simpler solutions.

Easy Ways To Discover Feed URL of A Website / Page

All blogs and news websites provide some sort of aggregation feed, usually RSS or ATOM. This allows users to add the feed URL to their favourite aggregator and stay updated with future stuff when they come. This post shows how to get a URL to subscribe to, and how to get multiple URLs if the site provides multiple formats.

A .NET library

One easy way to do this in .NET is using the Argotic Syndication Framework library, the code will look like:

Here is what you get when you run the code against


A few notes on this approach:

  • You must have realised the Where check in the code, the library seems to capture any related link in the HTMl, not just syndication links. that’s why we needed to filter them explicitly
  • Quite often when you have a main site that has different branches, you get more than one feed link, for CNN for example you get different feeds for certain site languages, for you got one for the site itself and another for members of the service. Arguably, this is not always what you want when you add the site to a reader kind of application
  • As expected, this code is quite slow in debug mode, takes about 1.5 seconds to run alone! In release mode (build configuration set to “Release” and so web,config)


Google API

In its simplest form, the syndication discovery is a matter of finding a link tag with a proper rel attribute (typically set to alternative), and a type attribute holding the attribute, however, in real life, at least historically, there used to be many variations of the way the discovery was implemented (read the next section for more).

One of those who managed to get right URLs for different edge cases was Google Reader. Apart from Google Reader itself, whose closing was part of the reason I wrote this post, Google allows you to use their systems to get the right syndication feed URL of a given page via simply calling a public JSONP API.

This is the structure of the data parameter returned by the previous call:


To learn more about this specific API, check:

To learn what’s special about JSONP requests and why jQuery needs to treat it differently, read the $.getJSON() documentation:


Background Of The Problem

Even though social media has made people depend on links shared on social media sites (by their peers, or the creators of the feed), the trend of adding a syndication feed to website is a trend that continued to increase in many product and subscription websites, especially that it’s easy to automate social media posts from the feeds after that.


As Google Reader will be retired in July, I thought for a minute about what it’d take to put some web based reader together. This was before I learned about the existing awesome alternatives like Feedly and so many others.

Then I remembered there was an application I was working on in 2007, one feature we needed and a colleague worked on was getting RSS posts from personal blogs of the site members. I remember seeing him doing all sorts of crazy Regular Expression matches of so many formats to get the URL. Turns out at least at this time different blog providers used different ways to advertise the feed URL in blog homepage markup, there were so many cases, it took my colleague several days to cover a large set of test cases from different providers that we knew our users were using.

I wanted to see whether this problem was still a thing n 2013, and tried to see what options we had, hence came this post, you know, just for fun :).

Hope some of you were interested in this too!

Twitter OAuth, Persistent OAuth, TweetSharp: Presentation & Code Nuggets

This is a PowerPoint Presentation (and extraction of the contents) I made as per a couple of friends’ request (@EmadAshi and @AmrEldib) to show how OAuth works along with Twitter and how easy it is to cache OAuth credentials.

As I was doing related work for TweetToEmail. I felt a PowerPoint presentation will be even better than a blog post for this one, but here you get the two.

The Presentation

The Contents

Application Registration

  • A Twitter user creates a Twitter Application
    • If the application is web based, it needs to provide a URL. “Localhost” is not accepted as a domain for this URL
  • A Twitter Application gets two pieces of information
  • Consumer Key
  • Consumer Secret
  • A Twitter Application will use these in all coming requests.

Initializing The Process

  • User comes to the application and it decides to authenticate against Twitter
  • Application makes a request using Consumer Key and Secret to obtain “Oauth Request Token”, which consists of two parts
    • Token
    • Token Secret
  • Application makes authentication URL including the “Oauth Request Token” parameter, and optionally a “Call-back URL” (if different than default URL in first step)

User Authentication

  • The user is redirected to Twitter, the URL contains the “Oauth Request” to identify application authentication session
  • Assuming the Twitter User being logged in and authorizes the Application
    • If the application is a desktop application, Twitter gives the a user a number “Verifier” to manually write back to the application
    • If the application is a web application, the user is redirected back to the application call-back URL with a complex “Verifier” parameter in the URL

Obtaining the Access Token

  • The Application makes a request to Twitter including the “Oauth Request Token” and the “Verifier”
  • It obtains an “Access Token”, likewise it consists of two-parts:
    • Token
    • Token Secret
  • The application needs to send the Consumer Key and Secret and Access Token in every future request that needs the Twitter User privileges

Caching Credentials

  • The application needs at least one authorization process as before
  • The Access Token returned can be saved in session/DB/whatever and then re-used later
  • The application can later use the Access Token directly along with the Consumer Key / Secret to communicate with Twitter without going through any of the previous steps

Sample Code (TweetSharp v 2.0)

Request Token & Redirect


Getting Access Token


Hints for Web Applications

  • The method GetAuthenticationUrl() has an overload that accepts a call-back URL for the user to be redirected to after obtaining verifer
  • The important part in RequestToken is the Token part, not the secret.
  • All parts of AccessToken are important and required
  • When the user is redirected back from Twitter to your application, you get the following QueryString parameters sent to you
    • oauth_token: The Token part of the Request Token
    • oauth_verifier: The verifier required to obtain the Access Token later

Using Cached Access Token


Related Links

Set Visual Studio to use your default proxy & credentials to access Extension Manager & NuGet Restore


The instructions have been tested on Visual Studio 2010, 2012, 2013, and 2015.

In VS 2010, extension manager is part of a nice new generation of VS plug-in system. One of the great features of it is how it can go online talk to Microsoft Visual Studio Gallery website to retrieve list of extensions there, automatically discovering updates for installed extensions, and allowing me to add new extensions directly from within Visual Studio.

The Problem:

However, in my company I could not take benefit of that for long time. Reason is, the company uses Blue Coat proxy, with some active directory based authentication. We cannot access the Internet unless we use that proxy, no direct connection allowed, most other proxies are also blocked (by blocking the common proxies port 8080 and many other common ports).

Although I have the proxy set in Internet Explorer, and I have the username/password stored in my Windows Credentials store  (Start–> Run–> Control PanelAll Control Panel ItemsCredential Manager) -since my primary work laptop and user account on it are not part of the company domain-, Visual Studio did not seem to be able to use that.

Anything that requires online communication not directly using the browser is not working. The main feature missed by this is Extensions Manager integration with the Visual Studio Gallery online.


Another side effect of the problem was when running tests with TestDriven.NET test runner (running using Debugger or In-Process), as I had some tests that required connecting to online websites.


The Cause

It turns out (just by guessing and trial-error way) that the default proxy settings for .NET apps is for some reason not to use the system proxy and credentials. Visual Studio will be default ignore that proxy (and many other .NET applications will).


The Solution

Thanks God, .NET applications have a nice extensibility feature for things like this using the app.config file (if it was unmanaged application, I’d have no way to it).


Troubleshooting this issue in TestDriven.NET was what inspired me to get this, as I was trying to setup the credentials in the app.config file of the test project and then in Visual Studio.


So, I needed to setup the proxy settings in the Visual Studio config file., Knowing the Visual Studio IDE executable “devenv.exe”, the file I’m looking for is “devenv.exe.config”. I didn’t need to create that file (which is easy, just a standard .config file with the same name as the executable including “.exe”) because Visual Studio already has a config file with bunch of existing configuration defaults.


I want to the Visual Studio 2010 shortcut in Start-> All Programs, right clicked it, then chose “Properties”.

In the following properties Window, I clicked “Open file Location”:



This took me to the Visual Studio folder that has the “devenv.exe” and “devenv.exe.config” files:



I opened this file in Visual Studio (yes, it’s OK – the effected showed after restarting VS of course):

The section I was looking for is under “<>”. The config file already had this section to enable IPv6 (which is not enabled by default, yet another interesting default and override – I commented the override anyway later).


I modified it with this simple change:



The complete XML for copy-paste sake:

As you can see, this is very simple. It enables the proxy, tells Visual Studio to use the system (IE) oroxy, and to use the default credentials for that.


This was all required to do the trick. You just need to close Visual Studio and re-run it afterwards to take effect.


Hopefully this saves someone else facing a similar issue…

MSDN Code Gallery – New Code Sample Sharing Area from Microsoft

Microsoft has recently opened a new sub-site of MSDN, MSDN Code Gallery. Here’s their main statement:

Download and share sample applications, code snippets and other resources

MSDN Code Gallery is your destination for downloading sample applications and code snippets , as well as sharing your own resources.

Usually, people would go for community sites for code samples sharing, or create some open source area like CodePlex, creating projects that only work as sample base. Others would use those or the sample codes available in different MSDN dev centers from time to time for downloading code samples.
Now, we have the place for those little snippets :).

Start Downloading Code Samples and Create Your Own Right Away!