使用Dropwdownlists填充HTML表格MVC中的更改事件

我试图在MVC dropdownlist中实现等价的change事件，它将使用数据库中的相关数据填充下表。使用Dropwdownlists填充HTML表格MVC中的更改事件

但是我的Ajax调用没有触发控制器操作方法。有谁能够告诉我在哪里，我错了

查看和vavascript

@model WebArtSampler.Models.AssignRequestModel 


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


<h2>AssignRequest</h2> 

@using (Html.BeginForm("AssignRequestNew", "SamCutAssignmentMasters")) 
{ 
    @Html.AntiForgeryToken() 

    <div class="form-horizontal"> 

     <hr /> 
     @Html.ValidationSummary(true, "", new { @class = "text-danger" }) 
     @Html.HiddenFor(model => model.CutAssignID) 

     <div class="form-group"> 
      @Html.LabelFor(model => model.CutAssignID, "Cutting Request #", htmlAttributes: new { @class = "control-label col-md-2" }) 
      <div class="col-md-10"> 


       @*@Html.DropDownListFor(model => model.CutAssignID, (SelectList)ViewBag.CutAssignID, "--Select One--", htmlAttributes: new { @class = "form-control" })*@ 

       @Html.DropDownList("Id", (SelectList)ViewBag.CutAssignID, htmlAttributes: new { @class = "form-control" }) 


      </div> 
     </div> 

} 

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

    <table class="table"> 
     <tr> 
      <th> 
       Req# 
      </th> 
      <th> 
       Buyer 
      </th> 
      <th> 
       Pattern Ref# 
      </th> 


      <th> 
       Style 
      </th> 
      <th> 
       Style Description 
      </th> 
      <th> 
       Fabric 
      </th> 



      </tr> 

     @foreach (var student in Model.Reqnumlist) 
     { 

      <tr> 
       <td> 
        @student.ReqNum 
       </td> 
       <td> 
        @student.BuyerName 
       </td> 
       <td> 
        @student.PatterRefNum 
       </td> 
       <td> 
        @student.StyleName 
       </td> 
       <td> 
        @student.StyleDescription 
       </td> 

       <td> 
        @student.Fabric 
       </td> 

      </tr> 

     } 



    </table> 

</div>

JQuery的我用的是

<script type="text/javascript"> 

     $(document).ready(function() { 

      debugger; 
      $("#Id").change(function() { 

       debugger 
       var Id = $(this).find('option:selected').val();    
       $.ajax({ 
        url: "@Url.Action("PopulateDetails","SamCutAssignmentMasters")", 
        type: 'Get', 
        contentType: "application/json; charset=utf-8", 
        dataType: 'json', 
        data: { 'Id': Id }, 
        success: function (data) { 
         if (data.success) { 

          debugger 
          document.getElementById("ProductName").value = data.productName; 
         } 
         else { 
          alert('invalid ID' + data.success); 
         } 
        } 
       }); 




      }); 


     }); 

    </script>

型号

public class SamCutAssignmentMastersController : Controller 
    { 
    [HttpGet] 
     public JsonResult PopulateDetails(int id) 
     { 

      return Json(GetDetailsofaspecificTicket(id)); 
     } 

    }

来源

2017-06-05 Sreenath Ganga

确定下拉列表ID的ID？如果我希望它与模型名称不同，我通常必须将其设置为html属性，例如：'{@class =“form-control”，id =“Id”}' – Pete

在调整内是否存在“调试器”事件受到下拉改变？ –

首先，检查UrlHelper.Action规范，您正尝试使用此过载：

public virtual string Action(
    string actionName, 
    string controllerName 
)

您的操作和控制器名称错误。在这种情况下，通常值得在你的代码上做一个“查看源代码”，你可能会看到这个url是不正确的。

你也将需要更新您的Ajax调用的语法，你在哪里传递ID参数：

data: { 'Id': Id },

来源

2017-06-05 11:12:57

感谢兄弟，更新了它，但似乎仍然有一些问题 –

在您的ajax调用尝试：数据：{id = Id} –

尝试过数据：id = Id，...没有触及行动 –

使用Dropwdownlists填充HTML表格MVC中的更改事件

回答

相关问题