Scenario
I have a input box for post codes. When you put in a postcode it makes a call to a web service and gets all
the suburb names back and binds them to a list, like an input dropdown list.
This works when I return a List<string> from
the web service for just
the names. No problem.
The problem arises when I go to save
the values to
the db. When it gets saved I cannot save
the name of
the suburb in
the suburb column in
the db. I have to save
the id of that suburb for
the foreign key constraint.
So then I changed
the List<> thing slighty and cheated and returned
the following.
<ArrayOfString>
<string>8213</string>
<string>BROOKFIELD</string>
<string>8214</string>
<string>CHAPEL HILL</string>
<string>8215</string>
<string>FIG TREE POCKET</string>
etc....
The reason for this is so I can have
the value of
the item in
the drop down as
the id and hence can save that in
the code behind on save.
To do this, I did
the following:
$(result).each(function (index, value) {
var suburbname;
var pattern = new RegExp('[0-9*]');
var m = pattern.exec(value);
if (m == null) {
suburbname = value
var o = new Option(suburbname, suburbid);
/// jquerify
the DOM object 'o' so we can use
the html method
$(o).html(suburbname);
$(document.getElementById('<%= suburb.ClientID %>')).append($("<option></option>")
.attr("value", suburbid)
.text(suburbname));
}
else {
suburbid = value
}
That works as well...
the drop down only has
name and
the value for those is
the number
The problem....?
I am making assumptions above which I don't like... I.e. that
the name never has a number it, that
the web service will always return
the id first to set
the id before running
the add to
the dropdown for
the first time. It just feels wrong.... :S (thoughts?)
So, if I change
the web service to return a datatable, to out
the following (which is what
the whole query returns):
<Suburbs diffgr:id="Suburbs1" msdata:rowOrder="0">
<SuburbID>8213</SuburbID>
<SuburbName>BROOKFIELD</SuburbName>
<StateID>4</StateID>
<StateCode>07</StateCode>
<CountryCode>61</CountryCode>
<TimeZones>10.00</TimeZones>
<Postcode>4069</Postcode>
</Suburbs>
Is there a way of acheiving
the same as above in js/jquery. So when
the user inputs
the postcode
the webservice returns
the datatable and then binds it to
the select with
the SuburbID going into
the value and
the name going into
the text???
Any other ways I could return
the data from
the web service to solve this?
Note: essentially I need
the option to look like this:
<option value="8213">BROOKFIELD</option>
I also thought I could make a second call to get just
the id on
the bind of
the text... but I kind of want to only make one call....
Thanks in adance,
Cheers
Robin
.net, C#, js, jquery, web service.....
Solution with guidance from Billy
The adding to
the select using
the other method below did not work, but my original way did once I had
the correct variables so just used that....
The service returns:
<ArrayOfMyClass>
<MyClass>
<ID>8213</ID>
<Name>BROOKFIELD</Name>
</MyClass>
... etc
The js is: (note: it is onchange of
the postcode input box. it runs a web service and then on success runs
the following)
function OnCompleted(result) {
var _suburbs = result;
var i = 0;
$(_suburbs).each(function () {
var SuburbName = _suburbs[i].Name;
var SuburbID = _suburbs[i].ID;
$(document.getElementById('<%= suburb.ClientID %>')).append($("<option></option>")
.attr("value", SuburbID)
.text(SuburbName));
i = i + 1;
});
