Webgridドロップダウン保存または更新

Question

私はここ数日間、Webグリッドを使い始めました。テキストボックス、ラベル、ドロップダウンなどの異なるデータ型の列を表示するようなものは、すべてwebgridでとても便利でしたが、データを保存する方法やデータを更新する方法はありますか？

アクションリンクと送信ボタンを使用してみましたが、いずれも私のために働いていませんでした。彼らは私のコントローラの変更されたドロップダウンデータを取得していませんでした。アクションリンクがユーザーIDを取得できましたが、変更されたドロップダウン値を取得できませんでした。

以下

コードです：いくつかの厳しい試練の後

ビュー

 WebGridColumn colLocation = null; 
    foreach (var col in Model) 
    { 
      colLocation = new WebGridColumn() 
       { 
        Header = "Locations", 
        Format = (item) => @Html.DropDownList("LocationId", @col.LocationItems.Select(l => new SelectListItem 
        { 
         Text = l.Text, 
         Value = l.Value, 
         Selected = ((WebGridRow)item)["LocationId"].ToString() == l.Value 
        } 
         ) 
         ) 
       }; 
      colSave = new WebGridColumn() 
      { 
       Header = "Save User", 
       Format = (item) => Html.ActionLink("Save", "Save", "UsersList", new { userId = item.UserId, locationId = item.LocationId }, new { @class = "btn btn-default" }), 
       CanSort = true 
      }; 
    } 
      columns.Add(colLocation); 
      columns.Add(colSave); 
@grid.GetHtml(tableStyle: "webgrid", 
      headerStyle: "header", 
      selectedRowStyle: "select", 
      alternatingRowStyle: "alt", 
      columns: columns 
      ) 

コントローラ

public ActionResult Save(int userId, int locationId) 
     { 
      var user = Utility.SetUserDetails(userId, locationId); 
      return RedirectToAction("UsersList"); 
     } 

Answer 1

、私はこの機能を実現しました。これはajaxを使って行うことができます。

私はjqueryのスクリプトを追加した後、クラス& id属性

colUser = new WebGridColumn() 
      { 
       Header = "User Id", 
       ColumnName = "UserId", 
       CanSort = true, 
       Format = @<text> 
     <span class="display"><label id="lblUserId">@item.UserId</label></span> 
     <input type="text" id="inUserId" value="@item.UserId" class="edit" style="visibility:hidden" /> 
       </text> 
      }; 
colLocation = new WebGridColumn() 
      { 
       Header = "Locations", 
       Format = @<text> 
     @Html.DropDownList("Location", @col.LocationItems.Select(l => new SelectListItem 
    { 
     Text = l.Text, 
     Value = l.Value, 
     Selected = ((WebGridRow)item)["LocationId"].ToString() == l.Value 
    } 
        ), new { @class = "edit", @id = "inLocation" }) 
       </text> 
      }; 
colSave = new WebGridColumn() 
      { 
       Header = "Save User", 
       Format = @<text> 
     <a href="#" class="edit save-btn btn btn-default">Save</a> 
       </text> 
      }; 

が含まれるように、私の列のプロパティを拡張するためにきた、我々は、コントローラにコントローラで

<script type="text/javascript"> 
    $(function() { 
     $('.save-btn').on("click", function() { 
      var tr = $(this).parents('tr:first'); 
      var id = tr.find("#inUserId").val(); 
      var location = tr.find("#inLocation").val(); 
      var User = 
      { 
       "UserId": id, 
       "LocationId": location 
      }; 
      $.ajax({ 
       url: '/UsersList/SaveData/', 
       data: JSON.stringify(User), 
       type: 'POST', 
       contentType: 'application/json; charset=utf-8', 
       success: function (result) { 
        isSuccess = result; 
       }, 
       error: function (result) { 
        isSuccess = result; 
       } 
      })  
     }); 
    }); 
</script> 

を選択された値を投稿することができます、新しいメソッドを追加、

public ActionResult SaveData(UserAccountViewModel User) 
     { 
      int userId = User.UserId; 
      int locationId = Convert.ToInt32(User.LocationId); 
      var user = Utility.SetUserDetails(userId, locationId); 
      return RedirectToAction("UsersList"); 
     }