| | Stumble It! | Add to Mixx! | | diigo it | | Slashdot |

Friday, May 14, 2010

Display a SharePoint List from a Parent Site

This bit of code will let you take a list from a parent site in your SharePoint hierarchy and display it in your sub-site. You may have to tweak the code a bit to match your specifications if you have custom code in your list templates, but all you *should* have to mess with is the '#WebPartWPQ2' bit.

Anyway, here it is =)
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type='text/javascript'>

function get_list() {
var list = $('#list').contents().find('#WebPartWPQ2').children('table').eq(1);
$('#my_list').html(list.html());
}

</script>
<div id='my_list'></div>
<iframe onLoad='get_list()' id='list' style='display:none;' src='http://path/to/your/list/AllItems.aspx'></iframe

And if you don't like how the list is displayed and you want to remove some of the columns, use this code:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type='text/javascript'>

function get_list() {
var list = $('#list').contents().find('#WebPartWPQ2').children('table').eq(1);
var rows = list.find('table').eq(0).children('tbody').eq(0).children('tr');
var hide_cols = ['2','3','4','5']; // columns number 2, 3, 4, & 5 will be hidden. Index is 0
for (var r=0;r<rows.length;r++) {
for (var c=0;c<hide_cols.length;c++) {
rows[r].childNodes[hide_cols[c]].style.display = 'none';
}
}
$('#my_list').html(list.html());
}

</script>
<div id='my_list'></div>
<iframe onLoad='get_list()' id='list' style='display:none;' src='http://path/to/your/list/AllItems.aspx'></iframe
Just be sure to replace the column numbers with the columns you want to hide.

Cheers!

1 comments:

Marc said...

Hello Ben,

Thanks a lot for your code, which I implemented successfully. However the FILTERS (ascending, descending, etc) are not working in the child List ? Any clue ?

To have the code working with Firefox I replaced this line :
rows[r].childNodes[hide_cols[c]].style.display = 'none';
by this one :
rows[r].getElementsByTagName("TD")[hide_cols[c]].style.display = 'none';

regards

Marc