Заполнение раскрывающегося списка списком выбора в ViewData

Я пытаюсь заполнить HTML. Раскрывающийся список с selectlist, который заполняется полями со строковым значением (адрес местоположения) и текстом (описание местоположения) из вызова базы данных. Я передаю список выбора как данные представления в свое представление. Выпадающий список заполняется нормально, но когда я использую значение, оно является нулевым или пустым, как видно из предупреждения, которое я вставляю в свою функцию javascript. Вот код Любые идеи, почему this.locations.value имеет значение null:

Мой код просмотра:

<script type="text/javascript">
    var map;
    var gdir;
    var geocoder = null;
    var addressMarker;

    function setDirections(fromAddress, toAddress, locale) {
        alert(toAddress);
        gdir.load("from: " + fromAddress + " to: " + toAddress, { "locale": locale });
    }
</script>

<div id="maincontent2">
    <form action="#" onsubmit="setDirections(this.from.value, this.locations.value, 'en_US'); return false">
        <table>
            <tr>
                <th align="left">From:&nbsp;</th>
                <td align="left" ><input type="text" id="fromAddress" name="from" size="35px" value="King of Prussia, PA"/></td>
                <th align="left">&nbsp;&nbsp;To:&nbsp;</th>
                <td align="left"> <%= Html.DropDownList("locations",(SelectList)ViewData["OfficeLocations"])%></td>
            </tr>
            <tr>
                <td></td>
                <td align="left">
                    <br />
                    <input name="submit" type="submit" value="Get Directions!" />
                </td>
            </tr>
        </table>
        <table>
            <tr>
                <td valign="top"><div id="drv_directions" style="width: 250px"></div></td>
                <td valign="top" style="padding-top:15px"><div id ="map_canvas"></div></td>
            </tr>
        </table>      
     </form>
</div>

Мой код контроллера:

public ActionResult Directions()
{
    uls_dbDataContext ulsdb_dc = new uls_dbDataContext();
    ViewData["OfficeLocations"] = new SelectList(ulsdb_dc.GetOfficeLocations(),"location_address", "location_name");
    ViewData["Title"] = "Directions";

    return View();
}

person MikeD    schedule 04.03.2009    source источник


Ответы (2)


Местоположение является выбранным и не имеет свойства значения. Чтобы получить значение выбранной опции, вам необходимо использовать выбранный индекс, найти правильный вариант и указать значение опции. Если вы используете jQuery, вы можете, однако, получить значение select с помощью метода val () объекта jQuery. Я предлагаю jQuery, поскольку он упростит код, а MS будет поддерживать его с помощью Visual Studio.

Пример использования jQuery:

<script type='text/javascript'>
    $(document).ready( function() {
       $('form').submit( function() {
          var fromAddress = $(this).find('#from').val();
          var toAddress = $(this).find('#locations').val();
          var locale = 'en-US';

          ....
          return false;
       });
    });
</script>

  <form action="#">

    <table>
    <tr><th align="left">From: </th>

    <td align="left" ><input type="text" id="fromAddress" name="from" size="35px"
    value="King of Prussia, PA"/></td>
    <th align="left">  To: </th>
    <td align="left"> <%= Html.DropDownList("locations",(SelectList)ViewData["OfficeLocations"])%></td>

    ...
person tvanfosson    schedule 04.03.2009
comment
До сих пор не работает. Вынул onsubmit из моего тега формы. Я уже использовал jquery, но добавил ваше предложение к моей готовой функции. В предупреждениях было получено значение undefined для fromAddress и пусто для адреса to. - person MikeD; 04.03.2009

Вот код, который теперь работает:

<script type="text/javascript">

    var map;
    var gdir;
    var geocoder = null;
    var addressMarker;

    function setDirections(fromAddress, toAddress, locale) {

        gdir.load("from: " + fromAddress + " to: " + toAddress,
        { "locale": locale });
    }

    $(document).ready(function() {
        if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map_canvas"));
            gdir = new GDirections(map, document.getElementById("drv_directions"));
            GEvent.addListener(gdir, "load", onGDirectionsLoad);
            GEvent.addListener(gdir, "error", handleErrors);

            setDirections("King of Prussia", "1302 Conshohocken Road, Conshohocken, PA 19428", "en_US");
        }
        $('form').submit(function() {
            var fromAddress = $(this).find('#from').val();
            var toAddress = $(this).find('#locations').val();
            var locale = 'en-US';
            alert(fromAddress);
            alert(toAddress);
            setDirections(fromAddress, toAddress, locale);
            return false;
        });

    });

</script>
person MikeD    schedule 04.03.2009
comment
Я знаю, что это было некоторое время назад, но вы можете объяснить, что изменилось, чтобы людям не приходилось смотреть и сравнивать, чтобы понять это. - person Bill the Lizard; 26.02.2010
comment
Ваше право, это было какое-то время, но я считаю, что разница в том, как я ссылаюсь на раскрывающийся список. От: this.location.value Кому: $ (this) .find ('# from'). Val (); - person MikeD; 01.03.2010
comment
Я имел в виду $ (this) .find ('# location'). Val (); - person MikeD; 01.03.2010