when added selectmenu() to a select, it stopped its event

when added selectmenu() to a select, it stopped its event

Hi,
I have a dropdown :
  1. <div>
  2.             Enabled/Disabled<br /> 
  3.             <select id="enabledChoice">
  4.                <option value="All">All</option>
  5.                <option value="F">Enabled</option>
  6.                <option value="T">Disabled</option>
  7.             </select>
  8.         </DIV>


it filter a table by showing all , or just enabled or just disabled, as soon as I added jquery ui and did :

  1. $(function($){
  2.      $('select#enabledChoice').selectmenu();

     The following code (for filtering displayed table) stopped working.
  1. //  select enable/disable
  2.        $("#enabledChoice").click( function() {
  3.            console.log('click');
  4.            oTable.fnDraw(); 
  5.        });
  6.        
  7.        $.fn.dataTableExt.afnFiltering.push(function( oSettings, aData, iDataIndex ) {
  8.         var chosenName = $("select#enabledChoice").val(); // Grab selected item in the dropdown list
  9.         var nameInColumn = aData[9]; // 9 is the index (begins from 0) of the column I want to sort
  10.         // If nothing or "All" is selected, don't filter
  11.          if ( chosenName == "" || chosenName == "All")
  12.             {
  13.              return true;
  14.             }
  15.          else if ( chosenName == nameInColumn)
  16.            { 
  17.             return true;
  18.            }
  19.          return false;
  20.      });   

Thanks, your help is appreciated.