SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I use the SharePoint List Filter web part on a page to control several Data View Web Parts.

How do I read the current value of the List Filter in Javascript?

share|improve this question
up vote 7 down vote accepted

SharePoint List Filter web part is rendered as input text field for displaying filter value:

<input  type="text" readonly="readonly" id="{ClientID}_SpListPicker_SelectionBox" title="Selected values" >

and input hidden field for storing filter value:

<input type="hidden"  id="{ClientID}_SpListPicker_Selection" value="{FilterValue}">

Below are demonstrated several ways how to retrieve filter value on the client side.

Retrieve filter value from input hidden field (jQuery dependency)

function getListFilterValueFromControl()
    var j = jQuery.noConflict();
    var filter = j("input[id$='SpListPicker_Selection']");
    return filter.val();

Retrieve filter value from context info

ContextInfo represents List Info structure on the client side. Property overrideFilterQstring contains filter string in the following format:


function getListFilterValueFromContextInfo()
    var filterFields = ctx.overrideFilterQstring.split('&');   //
    if(filterFields.length > 1)
       return filterFields[1].split('=')[1];
    return null;  


ExecuteOrDelayUntilScriptLoaded(getListFilterValueFromControl, 'SP.js');
share|improve this answer
Thanks vgrem! That's just beautiful. – joweiser Feb 13 '13 at 15:42

And if you have multiple list filter webparts in your page, here is how to access the value of each of them

$(" div div:eq(0) span input").val();  

for your 1st webpart

$(" div div:eq(1) span input").val(); 

for your second webpart, and so on

share|improve this answer

Another method I just found after more research:

$(document).ready(function() {
    var filterValue = $(" div div span input").val();
    if (filterValue != null) {
        alert("filter value is: "+$(" div div span"));

vgrem provided a more beautiful version though ;)


share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.