How To Resize Large Look-up Tables in PDPs

Posted By Posted by: EPM Partners on November 5, 2013

If you’ve worked with large look-up tables in Project Server before, you know how unwieldy they can get very quickly. In  the 2013 version, the page control you use now includes a nice search feature to help. However the default four lines displayed really doesn’t show much. Take a look at this example, you can see the scroll bar on the right is already very cramped:

Cramped PDP

 

Modifying the List Size with JavaScript

To give some more flexibility with the size, I have written the following JavaScript (jQuery actually) to increase the size of a list of specific look-up tables when opened on the PDP:

01 <script src=”//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js”>
02 </script>

 

03 <script>
04 function resizeLKTables() {

 

05     setTimeout(function () {
06         var incHeight = 150;

 

07         var ltId = [‘Blueprint Deliverables’, ‘Definition Deliverables’];
08

 

09         for (var i = 0; i < ltId.length; i++) {
10             var ltDiv = $(“input[title='” + ltId[i] + “‘]”).parent().children(“div”);

 

11
12             ltDiv.height(175 + incHeight);

 

13             ltDiv.find(‘div.outer-container’).height(168 + incHeight);
14             ltDiv.find(‘div.outer-container’).find(‘div.results-padder’).height(88 + incHeight);

 

15             ltDiv.find(‘div.outer-container’).find(‘div.general-results’).height(86 + incHeight);
16         }

 

17     },50);
18 }

 

19
20 $(‘button’).on(“click”, resizeLKTables);

 

21 </script>

 

The Result

The Result

Much better.

Script Usage

To use this script copy the script source above and save into notepad as something like “resizetables.js“, now on lines 6 and 7 you need to update the two variables used:

  • incHeight is the number of pixels to add to all of the specified lookup tables.
  • ltId is a comma separated list of Custom Field names to increase the size of.

Once updated, upload the script somewhere in PWA (Site Assets maybe) then edit your PDPs and add a content editor webpart to the bottom of the page which links to your uploaded resizetables.js file.

 

Enjoy!

This article is posted with permission from nearbaseline.com

 

Was this information helpful? To get more news, events and blogs from EPM Partners sign up to our mailing list now: http://eepurl.com/DIr6z


Blog Posted In Blog Posted In: How to, Project Server
Blog Posted In 

Leave a Reply

Your email address will not be published.