Posts Tagged 'mobile'

Improved Device Detection with ASP.NET

This is a follow up to my last post where I did a quick-and-dirty hack to get around the limitations of ASP.NET’s built-in isMobileDevice property.

At the end of that post, I said I was going to wait and see if Microsoft did a better job next time around before I went to the trouble of improving my solution. Well, it didn’t work out that way. You see, even if I hadn’t disliked leaving a quick-and-dirty fix in place, it turned out that there was another complication that meant I really needed to provide a proper solution.

The app uses Ajax extensively (and explicitly) in the non-mobile version in order to give a better user experience. It also uses Ajax implicitly in the mobile solution, as jQuery mobile automatically converts links and forms into Ajax calls unless you tell it not to do so. What I hadn’t taken into account in my quick-and-dirty approach was that I wasn’t just detecting mobile devices inside the view engine – I also needed to detect them in order to provide partial pages to Ajax calls in the non-mobile Web version.

The app delivers three kinds of content:

  • Full Web Pages
  • Full Mobile Pages
  • Partial pages for non-mobile Ajax calls

Unfortunately, as jQuery mobile also makes Ajax calls, when mobiles were not detected by the built-in isMobileDevice property, I was returning the partial page when I should have been returning the full mobile page.

So back to the drawing board.

And since I was now going to have to do things properly, I decided to support all the major mobile platforms, not just Android.

I created a new static method isMobileDevice() which accepts an argument of type HttpContextBase and checks both the built-in isMobileDevice property and series of string constants. I then call this method from inside the ViewEngine Nuget and also from my controllers when detecting if the call is an Ajax call.

Here is the key method:

Sample code from method detecting mobile devices

And here is one of the calls to the method:

Sample code calling the new method

If you want the full code, I’ve placed it online as devicedetector.txt. I hope you find it useful.

Kevin Rattan

For other related information, check out these courses from Learning Tree:

Building Web Applications with ASP.NET MVC

Building Web Applications with ASP.NET and Ajax

Detecting Mobile Devices with ASP.NET MVC

In a recent post I talked about the NuGet that allows you to do MVC4-style mobile views in MVC3. My cocktailsrus.com beta site is now live and in the process of testing, and I’ve found an issue with the NuGet (or, more accurately, with the underlying ASP.NET property it relies on). I thought it would be a good idea to share the problem – and my solution – with you.

The problem is that the ASP.NET isMobileDevice property is detects some mobile devices, but by no means all. So when I checked my site in an iPhone, I got the mobile version. When I checked it using Android, I got the full version – not what I wanted at all. I came across this problem in MVC, but because it’s an underlying ASP.NET problem, it would apply to Web Forms in exactly the same way.

Here is how the NuGet determines which view to return:

original NuGet Code

As you can see, the constructor passes through a predicate which uses the isMobileDevice property. The methods that do the work of returning the appropriate view to the appropriate device use this predicate. Which is great…. Unless the property is not being set correctly. Unfortunately, that’s exactly what happens with Android (and other) mobile devices. ASP.NET doesn’t recognize them, so neither does the NuGet.

My solution is definitely on the quick and dirty side. I only really care about supporting iPhones and Androids. With other mobile devices, I’m willing to take pot luck on isMobileDevice detecting them correctly. So all I needed to do was find out if the device was either recognized as a mobile device, or was an Android device.

Here is my amended version of the NuGet, which adds a second test to the predicate, checking whether the the UserAgent contains the word “Android”:

amended nuget code

I tested it, and received the correct version on both iPhone and Android devices – so it’s solved my problem. The next step is to tidy it up and use a constant instead of a string literal. And, of course, to wait and see if the next version of ASP.NET does a better job of detecting mobile devices. If not, then I’ll have to work up a more fully featured fix (like looking into updating the underlying definition files ASP.NET is using to determine what is a mobile device, or at least checking the UserAgent contains “palm”, “blackberry” etc.).

Kevin Rattan

For other related information, check out these courses from Learning Tree:

Building Web Applications with ASP.NET MVC

Building Web Applications with ASP.NET and Ajax


Learning Tree International

.NET & Visual Studio Courses

Learning Tree offers over 210 IT training and Management courses, including a full curriculum of .NET training courses.

Free White Papers

Questions on current IT or Management topics? Access our Complete Online Resource Library of over 65 White Papers, Articles and Podcasts

Enter your email address to subscribe to this blog and receive notifications of new posts by e-mail.

Join 29 other followers

Follow Learning Tree on Twitter

Archives

Do you need a customized .NET training solution delivered at your facility?

Last year Learning Tree held nearly 2,500 on-site training events worldwide. To find out more about hosting one at your location, click here for a free consultation.
Live, online training

%d bloggers like this: