Archive for June, 2016

Once again back with a new post, recently got a requirement to develop a Project Status Report(PSR), as we all know, for on Premise environment this should be very easy, just write a bunch of SQL queries and joins and you should be good to go, however in this case the requirement was to get the report out of Project Online with bunch of custom fields and additional information from Project Site (Custom Lists)

Still not a big deal, you can easily get the information using OData except making joins is not as easy as it seems, so in this example you will notice quite a few things I have done as workaround and tried to manage and map within JQuery & JavaScript rather than just manipulating the OData

well I started working on it and then came the additional requirement can we make it mobile device compatible and the answer was yes why not, just that it takes time & effort J

Anyways started exploring options, and as we all know, JQuery & JavaScript is what you have to use
however which framework should we use for making the report mobile device compatible, one of my colleague recommended to use Bootstrap J started working on it and below are the results


Desktop version

1- First Section

2 - Second Section

3 - Third Section

4- fourth section

5 - Fifth Section

6 - sixth section

7 - Seventh Section

Looks Pretty and they are real time too 🙂

Now let’s take a look at Ipad Version on how it looks on Ipad, though i could simulate it in browser but wanted to show real

IPad Version

1- Ipad

Notice i have Content focused mode enabled 🙂 to maximize the report on PDP

2 - Ipad


5- Ipad

6- Ipad

7- Ipad

Okay so that was IPad version, let’s see how it looks on iPhone

IPhone Version

1- Iphone         2- Iphone 3- Iphone

Hopefully this should give you a good preview of mobile device compatible report, in my next post i will post the code and explain on how was this developed












Read Full Post »