0

このプロジェクトで JavaScript が機能しないのはなぜですか? これが起こっている理由を誰か教えてもらえますか？_Layoutのスクリプト リンクにもコメントしますが、まだ機能しません。

モデル_

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;


namespace FA_CS.Models.Credit
{
    public class CreditCarModel
    {
        public string SelectedProvinceId { get; set; }
        public string SelectedCityId { get; set; }
        public string SelectedSuburbId { get; set; }
        public IEnumerable<Province> Provinceses { get; set; }

    }

    public class Province
    {
        public string Id {get;set;}
        public string Name {get;set;}
    }
}

これがビュー です これは、私のプロジェクトと、このプロジェクトの内部および外部 JS のビューです。

 @model FA_CS.Models.Credit.CreditCarModel
    @{
        ViewBag.Title = "Spider";
    }


    <script type="text/javascript" src="/scripts/jquery-1.4.4.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#SelectedProvinceId').change(function () {
                var selectedProvinceId = $(this).val();
                $.getJSON('@Url.Action("Cities")', { provinceId: selectedProvinceId }, function (cities) {
                    var citiesSelect = $('#SelectedCityId');
                    citiesSelect.empty();
                    $.each(cities, function (index, city) {
                        citiesSelect.append(
                            $('<option/>')
                                .attr('value', city.Id)
                                .text(city.Name)
                        );
                    });
                });
            });

            $('#SelectedCityId').change(function () {
                var selectedCityId = $(this).val();
                $.getJSON('@Url.Action("Suburbs")', { cityId: selectedCityId }, function (suburbs) {
                    var suburbsSelect = $('#SelectedSuburbId');
                    suburbsSelect.empty();
                    $.each(suburbs, function (index, suburb) {
                        suburbsSelect.append(
                            $('<option/>')
                                .attr('value', suburb.Id)
                                .text(suburb.Name)
                        );
                    });
                });
            });
        });
    </script>

    <div>
        Province: 
        @Html.DropDownListFor(x => x.SelectedProvinceId, new SelectList(Model.Provinceses, "Id", "Name"))
    </div>
    <div>
        City: 
        @Html.DropDownListFor(x => x.SelectedCityId, Enumerable.Empty<SelectListItem>())
    </div>
    <div>
        Suburb: 
        @Html.DropDownListFor(x => x.SelectedSuburbId, Enumerable.Empty<SelectListItem>())
    </div>

コントローラー これは私のプロジェクトのコントローラーです

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using FA_CS.Models.Credit;

namespace FA_CS.Controllers
{
    public class HomeController : Controller
    {



        public ActionResult Spider()
        {
            var model = new CreditCarModel
            {
                Provinceses = Enumerable.Range(1, 10).Select(x => new Province
                {
                    Id = (x + 1).ToString(),
                    Name = "Province" + x
                })

            };

            return View(model);

        }

           public ActionResult Suburbs(int cityId)
    {
        var suburbs = Enumerable.Range(1, 5).Select(x => new
        {
            Id = x,
            Name = "suburb" + x
        });

        return Json(suburbs, JsonRequestBehavior.AllowGet);
    }
    public ActionResult Cities(int provinceId)
    {
        var cities = Enumerable.Range(1, 5).Select(x => new
        {
            Id = x,
            Name = "city" + x
        });
        return Json(cities, JsonRequestBehavior.AllowGet);
       }           
     }
  }
4

2 に答える 2

1

$.ajax() で ajax を呼び出す必要があります。

あなたが書きました: $.getJSON('@Url.Action("Cities")', { ProvinceId: selectedProvinceId }, function (cities) { varcitySelect = $('#SelectedCityId');citySelect.empty(); $.each (都市、関数 (インデックス、都市) {都市選択.append( $('') .attr('値'、都市.Id) .text(都市.名前) ); }); });

その代わりに、次のようにコーディングする必要があります。 

var citiesSelect = $('#SelectedCityId');
     $.ajax({
        url: "/Home/Cities",
        type: "GET",  //these is must
        async: false, //these is optional
        cache: false,  //these is for IE
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: { provinceId: 1 },
        success: function (data) {
               $('#SelectedSuburbId').html("");

               var cities=eval(data);
               var citiesHtml = "";
               for (i = 0; i < cities.length; i++) {
                   citiesHtml += '<option value="' + cities[i].Id + '" >' + cities[i].Name + '</option>';
                }
             $('#SelectedSuburbId').html(citiesHtml);
            }
    });

「data」によるjson呼び出しのリターンを取得します

于 2013-03-11T05:50:12.473 に答える
0

上記のコード ドロップダウンを使用すると、データを入力できます。ただし、値を取得するには、「Cities」メソッドの上でクエリを実行する必要があります。そして都市のリストを返します。

public ActionResult Cities(int provinceId)
{
    var cities = Enumerable.Range(1, 5).Select(x => new
    {
        Id = x,
        Name = "city" + x
    });
    return Json(cities, JsonRequestBehavior.AllowGet);
   }           
 }
于 2013-03-11T08:31:08.513 に答える