在asp.net MVC 5视图中提交多个列表项

Question

我有一个从数据库中提取的调查问题的asp.net MVC5视图。我添加了一个额外的文本框字段来跟踪从下拉列表中选择的响应的权重。对于每个选择的响应，权重会更新以反映所选项目的值。提交后，我想提交问题ID和他们回复的相应权重。下面是有问题的视图

@model IEnumerable<WorkPlaceBullyApp.Models.Question> 
@{ 
    ViewBag.Title = "Survey Questions"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

<h2>Survey Questions</h2> 
@if (!Model.Any()) 
{ 
    <p>We don't have any Questions yet!.</p> 
} 
<p> 
    @Html.ActionLink("Question", "New", "Question", "", new { @class = "btn btn-primary" }) 
</p> 

@using (@Html.BeginForm("Index", "Question")) 
{ 
    @Html.AntiForgeryToken() 
    <div class="panel panel-primary"> 
     <div class="panel-heading"> 
      <h3 class="panel-title">Survey Questions</h3> 
     </div> 
     <div class="panel-body"> 
      <p> 
       <div class="well well-sm"> 
        <ul> 
         <li>Score: <span class="wwSum">0</span></li> 
         <li><span class="fBack">No Data Yet!</span></li> 
        </ul> 
       </div> 
      <p> 
       <table class="table table-striped table-hover ques-table"> 
        <thead> 
         <tr> 
          <td>ID</td> 
          <td>Questions</td> 
          <td>Category</td> 
          <td>Response</td> 
          <td>Weight</td> 
         </tr> 
        </thead> 
        @foreach (var question in Model) 
        { 
         <tr> 
          <td>@Html.CheckBox(@question.Id.ToString(), false, new { @class = "ckb", Id = question.Id, @disabled = "disabled" })</td> 
          <td> 
           @Html.ActionLink(@question.SurveyQuestion, "Edit", "Question", new { id = @question.Id }, null) 
           @*@question.SurveyQuestion*@ 
          </td> 
          <td> 
           @question.QuestionCategory.QuestionCat 
          </td> 
          @if (@question.QResponseCategory.Id == 1) 
          { 
           <td> 
            @Html.DropDownList("Weight", (IEnumerable<SelectListItem>)ViewBag.ResponseId, "Select Response", new { @class = "form-control sel" }) 
           </td> 
           <td> 
            <input type="text" id="Weight" name="__Weight" class="form-control myValu" value="" readonly /> 
           </td> 
          } 
         </tr> 
        } 
       </table> 
     </div> 
    </div> 

    <p> 
     @*@Html.ActionLink("Submit", "SurveyResponse", "Response", "", new { @class = "btn btn-primary", @id = "SubmitResponses" })*@ 

     <input type="button" id="SubmitResponses" value="Submit" class="btn btn-primary" /> 
    </p> 
} 
@section Scripts{ 
    <script type="text/javascript"> 
     $(function() { 
      $(".sel").change(function (e) { 
       var wSum = 0; 
       $(this).closest("td").next().find("input").val(this.value); 
       //$("input#Weight").each(function (e) { 
       // var itemVal = $(this).val() == "" ? 0 : $(this).val(); 
       // if (itemVal !== null) { 
       //  $('.ckb').each(function() { 
       //   this.checked = true; 
       //  }); 
       // } else { 
       //  $('.ckb').each(function() { 
       //   this.checked = false; 
       //  }); 
       // } 
       // wSum += parseInt(itemVal); 
       //}); 

       $(".ques-table tbody tr").each(function (e) { 
        var check = $(this).find(":checkbox:eq(0)"); 
        var score = $(this).find(".myValu").val(); 
        if (score != "") check["0"].checked = true; 

        var select = $(this).find("#Weight").val(); 
        var itemVal = select == "" ? 0 : select; 
        wSum += parseInt(itemVal); 
       }); 

       $("#SubmitResponses").click(function() { 
        checkedIds = $(".ckb").filter(":checked").map(function() { return this.id; }); 
        weights = $(this).find(":value").val().map(function() { return this.val(); }); 

        // console.log(weights); weights throws errors 

        $.ajax({ 
         type: "POST", 
         url: "@Url.Action("SurveyResponse", "Response")", 
         traditional: true, 
         data: { Ids: checkedIds.toArray(), Weights: weight.toArray(), UserId: "@ViewBag.UserId" } 
        }); 
       }); 

       if (wSum < 51) { 
        $(".fBack").text("You don't yet understand what is needed to create a culture of dignity and respect"); 
       } 
       if (wSum >= 51) { 
        $(".fBack").text("You have some awareness of requirements but significant efforts is still needed"); 
       } 
       if (wSum >= 76) { 
        $(".fBack").text("You have reasonable skills in creating a culture of dignity and respect"); 
       } 
       if (wSum >= 100) { 
        $(".fBack").text("You have excellent skill in creating a culture of dignity and respect."); 
       } 
       $(".wwSum").text(wSum); 
      }); 
     }); 

    </script> 
} 

我无法将体重分数放入列表中，因为它会引发错误。

其次，当我注释掉的

weights = $(this).find(":value").val().map(function() { return this.val(); }); 

，并把一些测试值在我的控制器

public ActionResult SurveyResponse(List<int> Ids, List<int> Weights, int UserId) 
    { 
     SurveyResponse myResponse = new SurveyResponse(); 
     foreach (var item in Ids) 
     {    
      myResponse.UserId = 3; 
      myResponse.QuestionId = 1; 
      myResponse.Weight = 1; 
      myResponse.Date = DateTime.Now; 

      _context.SurveyResponse.Add(myResponse); 
      _context.SaveChanges(); 
     } 

     return View(); 
    } 

我无法提交的响应。下面的图像是呈现的视图（UI），以调查问题

从上述图像...每当一个与会者接听从下拉列表的响应，它将填充的权重与相应的分数，并同时检查行中对应的复选框。因此，检查的值是在选择问题ID和权重有价值的分数。挑战是如何将这些不同的值，问题ID和相关的分数存入数据库。

Answer 1

只需更改您的代码即可获得值weights。

Just change your code to get the value of `weights`. 

$("#SubmitResponses").click(function() { 
    var checkedIds = []; 
    var weights = []; 

    $('table > tbody > tr').each(function() { 
     if($(this).find('input[type="checkbox"]').is(":checked")){ 
      checkedIds.push($(this).find('input[type="checkbox"]').attr('Id')); 
      weights.push($(this).find('select').val()); 
     } 
    }); 

    // console.log(weights); weights throws errors 

    $.ajax({ 
      type: "POST", 
      url: "@Url.Action("SurveyResponse", "Response")", 
      traditional: true, 
      data: { Ids: checkedIds.toArray(), Weights: weight.toArray(),UserId: "@ViewBag.UserId" } 
    }); 
});