Question

在asp.net mvc3上使用ajax的级联下拉列表问题

这是控制器中的代码

[HttpPost]
public ActionResult subcats(int categoriaId)
{
    var subcategorias = anunciorepo.GetSubCategoriaByCat_id(categoriaId).ToList();

    return Json(subcategorias, JsonRequestBehavior.AllowGet);
}

这是视图

@model agro.ViewModel.AnunciosViewModel
@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>

<script type="text/javascript">
    $(function () {
        var urlemp = '@Url.Action("subcats")';
        $("#categorias").change(function () {
            window.alert("cat :" + $(this).val());
            var categoriaId = $(this).val();
            window.alert(categoriaId);
            $.ajax({ 
                type: 'POST',
                url: urlemp,
                data: { categoriaId: categoriaId },
                datatype:'JSON',
                // contentType: "application/json; charset=utf-8",

                success: function (response) {
                    window.alert(categoriaId);
                    window.alert("sub");
                    $("#subcategorias").fillSelect(response);
                },

                error: function (xhr, type, exception) {
                    window.alert(categoriaId);

                    alert("Error: " + type);
                    alert("Error: " + exception);
                    alert("Error: " + xhr.status);
                 }
            })
        });
    });
</script> 

@using (Html.BeginForm("Create", "Anuncios", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)

   <fieldset>

   <div class="editor-field"></div>
   <div class="editor-label">
       Categorias
   </div>
   <div class="editor-field">
       @Html.DropDownList("categorias", (SelectList)ViewData["Categorias"], "----Selecciona um----"
      )
       @*Html.DropDownList("language", (SelectList)ViewData["Categorias"], "----Selecciona um----", new { onchange = "javascript:cascadingdropdown();" }) *@
       @Html.ValidationMessageFor(model => model.anuncio.codigo_categoria)
   </div>
   <div class="editor-label">
       Sub Categorias
   </div>
   <div class="editor-field">
       <select id="subcategorias" name="subcategorias"></select>
       @* @Html.DropDownList("languagesub", Enumerable.Empty<SelectListItem>(),"--- Selecciona um---")*@                  
       @Html.ValidationMessageFor(model => model.anuncio.codigo_subcategoria)
   </div>
   <div class="editor-label">
       @Html.LabelFor(model => model.anuncio.titulo)
   </div>
   <div class="editor-field">
       @Html.EditorFor(model => model.anuncio.titulo)
       @Html.ValidationMessageFor(model => model.anuncio.titulo)
   </div>
   <div class="editor-label">
       @Html.LabelFor(model => model.anuncio.decricao)
   </div>
   <div class="editor-field">
       @Html.EditorFor(model => model.anuncio.decricao)
       @Html.ValidationMessageFor(model => model.anuncio.decricao)
   </div>
   <div class="editor-label">
       Avatar
   </div>
   <div class="editor-field">
       <input type="file" name="Avatar" />
   </div>
   <p>
       <input type="submit" value="Create" />
   </p>

   </fieldset>

}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

总是出错

exception:undifined
xhr.status=500
alert("Error: " + type);
alert("Error: " + exception);
alert("Error: " + xhr.status

感谢佩德罗

Answer 1

这一行：

return Json(subcategorias, JsonRequestBehavior.**AllowGet**);

似乎与这两行相互排斥：控制器

[HttpPost]

查看

$.ajax({ 
            type: 'POST',

Answer 2

尝试删除以下两行：

<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>

Answer 3

public List<SubViewModel> GetSubCategoriaByCat_id(int cat_id)
        {
            int e = cat_id;
            return (from a in db.subcategorias
                    where a.codigo_categoria == e
                    select new SubViewModel {id=a.id,nome_subcategoria=a.nome_subcategoria}).ToList();           
        }

public JsonResult subcats(int categoriaId)
    {
        var subcategorias = anunciorepo.GetSubCategoriaByCat_id(categoriaId).ToList();


        return Json(subcategorias, JsonRequestBehavior.AllowGet);

    }



<script type="text/javascript">

$(function () {

         var urlemp = '@Url.Action("subcats")';

         $("#categorias").change(function () {
            // window.alert("cat :" + $(this).val());
             var categoriaId = $(this).val();
             //window.alert(categoriaId);

             $.ajax({
                 type: 'GET',

                 url: urlemp,
                 data: { categoriaId: categoriaId },
                 datatype:'JSON',


                 success: function (data) {

                 if (data.length > 0) 
                 {
                   var options = '';
                   for (p in data) 
                   {
                     var subcategorias = data[p];
                     options += "<option value='" + subcategorias.id + "'>" + subcategorias.nome_subcategoria + "</option>";  

                   }

              $("#subcategorias").removeAttr('disabled').html(options);

           }else {

              $("#subcategorias").attr('disabled', true).html('');  

           }
          },//function,


                 error: function (xhr, type, exception) {
                     window.alert(urlemp + "/" + categoriaId);

                     alert("Error: " + type);
                     alert("Error: " + exception);
                     alert("Error: " + xhr.status);

                 }
             })


         });
     });



</script>

在asp.net mvc3上使用ajax的级联下拉列表问题

3 个答案: