If you’ve worked with large lookup tables in Project Server before you know how unwieldy they can get very quickly, in 2013 the page control you use now includes a nice search feature to help but the default four lines displayed really doesn’t show much! See this example where you can see the scroll bar on the right is already very cramped:
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 lookup tables when opened on the PDP:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script> <script> function resizeLKTables() { setTimeout(function () { var incHeight = 150; var ltId = ['Blueprint Deliverables', 'Definition Deliverables']; for (var i = 0; i < ltId.length; i++) { var ltDiv = $("input[title='" + ltId[i] + "']").parent().children("div"); ltDiv.height(175 + incHeight); ltDiv.find('div.outer-container').height(168 + incHeight); ltDiv.find('div.outer-container').find('div.results-padder').height(88 + incHeight); ltDiv.find('div.outer-container').find('div.general-results').height(86 + incHeight); } },50); } $('button').on("click", resizeLKTables); </script>
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!
awesome man, thanks for sharing. worked like a charm.