autocomplete-remote multiple returns undefined error on json data returned from asp.net 2.0 webservice

autocomplete-remote multiple returns undefined error on json data returned from asp.net 2.0 webservice

Hi, I have a hard time getting this one work. please give some hint and I have some deadline to make.
here is the web service

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public string GetJsonMemberCodes(string term)
    {
        suggestions = new List<Members>();
       
       






        Data dt = new Data();
            suggestions = dt.GetJsonMemberCodes(term);
        }
     return new JavaScriptSerializer().Serialize(suggestions);
      
    }


here is the data the server web service returned.
<?xml version="1.0" encoding="utf-8" ?>
  < string xmlns =" http://tempuri.org/ "> [{"ID":"106720","LABEL":"106720","VALUE":"106720},{ID":"106729","LABEL":"106729","VALUE":"106729"}] </ string >
 
here is the page that is calling it

<

 link type ="text/css" href ="../../App_Themes/css/base/jquery.ui.all.css" rel ="stylesheet" />

< script type ="text/javascript" src ="../../Scripts/js/jquery-1.4.2.js"></ script >

< script type ="text/javascript" src ="../../Scripts/js/ui/jquery.ui.widget.js"></ script >

< script type ="text/javascript" src ="../../Scripts/js/ui/jquery.ui.core.js"></ script >

< script type ="text/javascript" src ="../../Scripts/js/ui/jquery.ui.position.js"></ script >

< script type ="text/javascript" src ="../../Scripts/js/ui/jquery.ui.autocomplete.js"></ script >

< link type ="text/css" href ="../../App_Themes/css/demos.css" rel ="stylesheet" />

< style type ="text/css">

.ui-autocomplete-loading { background: white url('~/images/ui-anim_basic_16x16.gif') right center no-repeat; }

 </ style >

< script type ="text/javascript">

$(

 function () {

 function split(val) {

 return val.split(/,\s*/);

}

 function extractLast(term) {

 return split(term).pop();

}

$(

 "input[ID*='txtMemberID']" ).autocomplete({

// source: function(request, response) {

// $.getJSON("RptMemberIDAutoComplete.asmx/GetJsonMemberCodes", {

// term: extractLast(this.value)

// }, response);

// },

// $.jsonService({url: 'RptMemberIDAutoComplete.asmx',method: '/GetJsonMemberCodes',params: extractLast(this.value)});

// },

source:

function (request, response) {

$.ajax({

type:

"POST" ,

url:

"RptMemberIDAutoComplete.asmx/GetJsonMemberCodes" ,

contentType:

"application/json; charset=utf-8" ,

dataType:

"json" ,

data:

"{'term': '" + extractLast( this .value) + "'}" ,

success:

 function (result) {alert(result.d);

//

// response($.map(data, function(item) {

// return {

// ID:item.ID,

// label: item.ID,

// value: item.ID

// }

// }))

}

});

},

search:

function () {

 // custom minLength

var term = extractLast( this .value);

 if (term.length < 2) {

 return false ;

}

},

focus:

function () {

 // prevent value inserted on focus

return false ;

},

select:

function (event, ui) {

 var terms = split( this .value );

 // remove the current input

terms.pop();

 // add the selected item

terms.push( ui.item.value );

 // add placeholder to get the comma-and-space at the end

terms.push(

 "" );

 this .value = terms.join( ", " );

 return false ;

}

});

});

 </ script >

<

 input id ="txtMemberID" size ="50" />