0

これが私のJavaScriptです：

<script type="text/javascript">
    $(function () {
        $("select#City_DDL_ID").change(function (evt) {
            if ($("select#City_DDL_ID").val() != "-1") {
                $.ajax({
                    url: "/Home/GetHotels",
                    type: 'POST',
                    dataType: "json",
                    data: { id: $("select#City_DDL_ID").val() },
                    success: function (response) {
//                        $('#Hotel_DDL_ID').attr('disabled', false);
                        $("select#Hotel_DDL_ID").replaceWith(response);
                    },
                    error: function (xhr) {
                        alert("Something went wrong, pleae try again");
                    }
                });
            }
        });
    });

Index.cshtmlは次のとおりです。

@model RoomReservation.Webb.Models.HomeViewModel

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Index</h2>

<fieldset>
    <legend>Select a city and a hotel</legend>
    <br />
    <br />
    <br />
    @Html.DropDownListFor(x=>x.City_DDL_ID, new SelectList(Model.AllCities, "Value", "Text"),"...pick a city..." )
    <br />
    <br />
    @Html.DropDownListFor(x => x.Hotel_DDL_ID, Enumerable.Empty<SelectListItem>(), "...pick a hotel...", new { disabled = "disabled"})
    <br />
    <br />
</

fieldset>

そして、これがajaxが呼び出すメソッドです：

public JsonResult GetHotels(int id) 
{
   if (id > 0)
   {
      var hotels = bl.ReturnAllHotelsInCity(id);
      return Json(hotels);
   }
   else
   {
      throw new Exception("Hotel not reachable, please try again");
   }
}

City_DDL_IDでCityを選択した後、Hotel_DDL_IDが消えます。私を助けてくれませんか、私はjavasrciptとajaxの初心者ですか？

これがnewsetスクリプトですが、まだ機能していません。

<script type="text/javascript" language="javascript">
    $('#City_DDL_ID').change(function () {
        var selectedCity = $(this).val();
        if (selectedCity != null && selectedCity != '-1') {
            $.getJSON('@Url.Action("GetHotels")', { id: selectedCity }, function (hotels) {
                var hotelsSelect = $('#Hotel_DDL_ID');
                hotelsSelect.empty();
                $.each(hotels, function (index, hotel) {
                    hotelsSelect.append($('<option/>',
                    {
                        value: hotel.Value,
                        text: hotel.Text
                    }));
                });
                $('#Hotel_DDL_ID').attr('disabled', false);
            });
        }
    });
</script>

じゃあ何をすればいいの？

ご協力いただきありがとうございます。この最新のスクリプトは機能しています。デフォルトのブラウザをChromeに変更します。よろしくお願いします

PS管理者：質問に回答済みのマークを付ける方法は？

4

2 に答える 2

0

メソッドから JSON を返し、その JSON に置き換えselect#Hotel_DDL_IDます。これは、選択リストが、ブラウザーがレンダリングしない JSON 文字列に置き換えられていることを意味します。

$("select#Hotel_DDL_ID").replaceWith(応答);

responseこの場合は、HTMLselect要素ではなく、JSON オブジェクトです。

JSONを解析し、選択リストにコンテンツを再入力する必要があります。この質問で受け入れられた回答を見て、その例を確認してください

多分このようなもの：

var html = '';
var len = response.length;
for (var i = 0; i< len; i++) {
    html += '<option value="' + response[i].Value+ '">' + response[i].Text+ '</option>';
}
$("select#Hotel_DDL_ID").html(html);

または、アクションを変更して、選択リストを HTML としてレンダリングする部分ビューを返すようにすると、コードが機能します。

于 2012-11-01T00:42:49.293 に答える
0

$("select#Hotel_DDL_ID")。replaceWith (応答);

replaceWith は、コンテンツを新しいコンテンツに置き換えます。

[Hotel_DDL_ID] のコンテンツ/値を変更するだけの場合は、応答を評価し (eval() を使用するという意味ではありません!)、それに応じてオプションを更新する必要があります。

于 2012-11-01T00:54:29.037 に答える