windows - Update and Filter listpicker -

i have 2 list pickers same databinding(from xml), when first listpicker have selection changed should filter data of second listpicker , hide item selected in first listpicker, same second listpicker.

2 listpicker xaml...

<my:listpicker horizontalalignment="left"                          x:name="listpicker1" width="265" borderbrush="{x:null}" fontfamily="segoe ui" fontsize="18.667" background="{staticresource phonetextboxbrush}" scrollviewer.verticalscrollbarvisibility="visible" margin="147,0,0,0" grid.row="1" foreground="#ff1ba1e2" height="35" selectionchanged="listpicker1_selectionchanged" >                         <my:listpicker.itemtemplate>                             <datatemplate>                                 <stackpanel width="360" height="34">                                     <textblock x:name="item" text="{binding channelname, mode=twoway}" fontsize="18.667" margin="12, 0, 2, 2" />                                 </stackpanel>                             </datatemplate>                         </my:listpicker.itemtemplate>                     </my:listpicker>                     <textblock textwrapping="wrap" fontfamily="segoe ui" fontsize="16" margin="52,5,0,5" grid.row="3" horizontalalignment="left" width="91" text="channel 2 "/>                     <my:listpicker horizontalalignment="left"                          x:name="listpicker2" width="265" borderbrush="{x:null}" fontfamily="segoe ui" fontsize="18.667" background="{staticresource phonetextboxbrush}" foreground="#ff1ba1e2" scrollviewer.verticalscrollbarvisibility="visible" margin="147,0,0,0" grid.row="3" selectionchanged="listpicker2_selectionchanged" >                         <my:listpicker.itemtemplate>                             <datatemplate>                                 <stackpanel width="360" height="34">                                     <textblock x:name="item" text="{binding channelname, mode=twoway}" fontsize="18.667" margin="12, 0, 2, 2" />                                 </stackpanel>                             </datatemplate>                         </my:listpicker.itemtemplate>                     </my:listpicker> 

databinding xml code

    public customize()     {         initializecomponent();          xdocument loadeddata = xdocument.load("newschannels.xml");          var channels = query in loadeddata.descendants("channel")                        select new channels                        {                            channelname = (string)query.element("channelname"),                        };         listpicker1.itemssource = channels;         listpicker2.itemssource = channels;     }      public class channels     {         string channelname;          public string channelname         {             { return channelname; }             set { channelname = value; }         }     } 

rather databind listpickers exact same list try creating 2 proxy properties control access underlying list. have getter proxy properties filter out whatever has been selected other list (assuming sleected object bound viewmodel. alternatively (or possibly in addition) use selectionchanged event force updating proxy lists.

update here's example:

assuming page contains this:

<grid x:name="contentpanel" grid.row="1" margin="12,0,12,0">     <stackpanel>         <toolkit:listpicker x:name="picker1"                              itemssource="{binding list1, mode=twoway}"                             selecteditem="{binding selecteditem1, mode=twoway}"                              selectionchanged="listpicker1selectionchanged" />         <toolkit:listpicker x:name="picker2"                             itemssource="{binding list2, mode=twoway}"                             selecteditem="{binding selecteditem2, mode=twoway}"                             selectionchanged="listpicker2selectionchanged" />     </stackpanel> </grid> 

the code behind should this:

public partial class mainpage : phoneapplicationpage {     public mainpage()     {         initializecomponent();          this.datacontext = new twolistviewmodel();     }      private void listpicker1selectionchanged(object sender, selectionchangedeventargs e)     {         // ensure selected item updated         picker1.getbindingexpression(listpicker.selecteditemproperty).updatesource();          // rebind other list         var binding = picker2.getbindingexpression(listpicker.itemssourceproperty).parentbinding;         picker2.setbinding(listpicker.itemssourceproperty, binding);     }      private void listpicker2selectionchanged(object sender, selectionchangedeventargs e)     {         picker2.getbindingexpression(listpicker.selecteditemproperty).updatesource();          var binding = picker1.getbindingexpression(listpicker.itemssourceproperty).parentbinding;         picker1.setbinding(listpicker.itemssourceproperty, binding);     } }  public class twolistviewmodel {     public twolistviewmodel()     {         // must initialize selected items         selecteditem1 = "one";         selecteditem2 = "two";     }      private ienumerable<string> innerlist     {                 {             return new[]                    {                        "one",                        "two",                        "three",                        "four",                        "five",                    };         }     }      public ienumerable<string> list1     {                 {             return innerlist.where(item => item != selecteditem2);         }     }      public ienumerable<string> list2     {                 {             return innerlist.where(item => item != selecteditem1);         }     }      public string selecteditem1 { get; set; }      public string selecteditem2 { get; set; } }