Unfortunately the inline _javascript_ didn't work. I tried this just to test that the event was being fired:
<!-- Zip Code -->
<component id="zipCode" type="tacos:Autocompleter" >
<binding name="displayName" value="literal:Zip Code" />
<binding name="value" value="ognl:user.address.zipCode" />
<binding name="listSource" value="ognl:zipCodeList" />
<binding name="listener" value="listener:searchZipCodes" />
<binding name="listItemRenderer" value="ognl:listRenderer" />
<binding name="direct" value="ognl:true" />
<binding name="frequency" value="literal:0.4" />
<binding name="afterUpdateElement">
literal:<![CDATA[
function handleAutoComplete(field, htmlElement) {
alert("zip has been selected!!")
}
]]>
</binding>
</component>
The HTML looks like this:
<tr>But nothing happens when the ZIP is selected from the dropdown.
<td><label for= "zipCode">Zip Code</label></td>
<td><input type="text" autocomplete="off" name= "zipCode" value="" id="zipCode" frequency="0.4" class="auto_complete" afterUpdateElement ="
function handleAutoComplete(field, htmlElement) {
alert("zip has been selected!!")
}" /></td>
</tr>
<tr>
Thanks for the help,
Brian
On 12/29/05, Jesse Kuhnert <[EMAIL PROTECTED]> wrote:
I would definitely use the afterUpdateElement. From the docs, http://wiki.script.aculo.us/scriptaculous/show/Ajax.Autocompleter , I think this method is expecting a function object passed in directly, so I would try adding something like this to your binding:
<binding name="afterUpdateElement">
<[[CDATA //this might be wrong, don't remember xml cdata syntax right now
function handleAutoComplete(field , htmlElement) {
htmlElement are the contents of the selected item in your response, field is your field
you can parse the individual contents of your html element out and populate your form fields..I reccomend learning some of the dojo dom/html api's to help you with that part
}
]]>
</binding>
On 12/29/05, Brian Sam-Bodden <[EMAIL PROTECTED] > wrote:Hi,
First of all thanks to all in the dev team for a wonderful set of components. I have a couple of questions about the autocompleter component. I'm doing a Zip code autocompleter. The dropdown should show Zipcode + City and State. When selected I want to drop the selected values into the fields of the enclosing form for zip, city and state.
1) I created a ListItemRenderer that takes care of showing the dropdown as I described above. Here's the relevant code:
public void renderList(IMarkupWriter writer, IRequestCycle cycle, Iterator values) {
if (cycle.isRewinding())
return;
writer.begin("ul");
writer.attribute("class", "locations");
while (values.hasNext()) {
Location value = (Location)values.next();
if (value == null)
continue;
writer.begin("li");
writer.attribute("class", "location");
writer.begin("div");
writer.attribute("class", "zip");
writer.print(value.getZip());
writer.end("div");
writer.begin("div");
writer.attribute("class", "description");
writer.print(value.getCity() + ", " + value.getState());
writer.end("div");
writer.end("li");
}
writer.end();
}
The problem is that when I select the item it drops the value of the Zip and also the value of the city + ", " + state. Here's the .page definitions:
<!-- Zip Code -->
<component id="zipCode" type="tacos:Autocompleter" >
<binding name="displayName" value="literal:Zip Code" />
<binding name="value" value="ognl:user.address.zipCode" />
<binding name="listSource" value="ognl:zipCodeList" />
<binding name="listener" value="listener:searchZipCodes" />
<binding name="listItemRenderer" value="ognl:listRenderer" />
<binding name="direct" value="ognl:true" />
<binding name="frequency" value="literal:0.4" />
</component>
So, what am I missing here? I saw the example on script.aculo.us and they do have an autocompleter that has a complex HTML dropdown with multiple lines of text but when selected only the text for the locale is added to the field.
2) How do I use the afterUpdateElement property? I want to drop the value of the City and State in their respective fields? Any ideas?
Thanks,
Brian
