Question

I currently have a user control that is used on both an /Address/Edit and an /Address/Create page. This user control simply has the following code in it to submit a new address to the system:

<%      using (Html.BeginForm())     { %>         <table>             <tr>                 <td>Street Address</td>                 <td>                     <%= Html.TextBox('StreetAddress', (ViewData.Model != null) ? ViewData.Model.StreetAddress : '') %>                     <%= Html.ValidationMessage('Address.StreetAddress') %>                 </td>             </tr>         </table>         <%= Html.SubmitButton() %>         <%             if (ViewData['GeocodeResults'] != null) {         %>                   <p>                 Google maps found the following addresses that matched the address you entered.  Please select                 the appropriate address.  If none of these addresses are correct, try reentering the address                 again and be as specific as possible.             </p>             <ul>                 <%                      foreach (GeocodeResult geocodeResult in (List<GeocodeResult>)ViewData['GeocodeResults']) {                  %>                         <li>                             <%= geocodeResult.StreetAddress %>                         </li>                 <%                     }                  %>             </ul>         <%               }          %> <%     } %> 

To summarize the code above, what it does is in the controller, it queries Google Maps to geocode the address in the text box (i.e. turns it into a set of longitude/latitude coordinates). When Google Maps returns more than one result, I store off these results into ViewData[‘GeocodeResults’], which will then display the possible addresses to the end user.

Now, this is working fine for displaying the addresses, but what I really want is that list to be rendered as a list of hyperlinks so that the user can click on the appropriate address and the form will submit with that address instead of the one in the textbox. Is there any way to do this?

Answer 1

Something like:

<a href='javascript:void(0);' onclick='submitAddress(this);'>     <%= geocodeResult.StreetAddress %></a> 

where you have

function submitAddress(link) {    $('input#streetAddress:first').text(link.innerHtml);    $('input#submit').click(); } 

You could also drop it in a hidden field that would signify that you don’t need to do the Google map search for this address. That is, if HiddenStreetAddress is provided, just use with without lookup. If not, then do Google lookup on StreetAddress. If more than one result, then display results. If not, then use provided.