根据 DropDownList 的值和模型调用 Action 方法

Question

我的视图中有一个下拉列表。我需要使用户能够从下拉列表中 select 一个值，然后单击 button/ActionLink 以调用同一控制器中的另一个操作方法。需要传递给新 ActionMethod 的值是下拉列表中 selected Value 的 ID，以及传递到 View 的模型的 ID。模型和下拉列表没有以任何方式链接在一起。

我已尝试onchnage = document.location.href设置操作方法的路径并将单个值传递给操作方法。但是 document.location.href 的问题是它将 url 附加到现有的 url 上，这是不受欢迎的；即，最后的 url 原来是 localhost:port/controller1/action1/controller1/action2 应该只是 localhost:port/controller1/action2

我正在寻找一种无需使用 javascript 即可完成的方法，因为我已经尝试过了。

视图中的代码

@using (Html.BeginForm("Copy","SetValues",FormMethod.Post))
{
    <p>
        @Html.DropDownList("OptionValueID", null, "Select")
        <input type="submit" value="Copy" />

        //This is the preferable method though
        @*@Html.ActionLink("Copy", "Copy", "SetValues", new { @OptionValueID = @ViewBag.id,@CopyID = CopyDDL.SelectedValue},null)*@
    </p>
}

复制函数将采用两个参数：Id of the selected item 和 ID that is being passed through ViewBag.id

视图返回的视图将是不同的视图

JavaScript 我试过了

<script language="javascript" type="text/javascript">
    function copy(_OptionValueID)
    {
        var url = "/SetValues/Copy";
        $.ajax({
            url: url,
            data: { copyid: _OptionValueID},
            type: "POST",
            success: function (data) { }


        });
        response();
    }
</script>

它根本不计算。

调用此视图的操作方法

public ActionResult Index(int id)
{
        var ov = db.OptionValue.Include(x => x.Option).FirstOrDefault(x => x.OptionValueID == id);
        var opid = ov.OptionID;
        var op = db.Option.Include(x => x.TechnicalCharacteristic).FirstOrDefault(x => x.OptionID == opid);
        var tcid = op.TechnicalCharacteristicID;
        var tc = db.TechnicalCharacteristic.Include(x => x.TcSets).FirstOrDefault(x => x.TechnicalCharacteristicID == tcid);
        var tcset = tc.TcSets;
        var opv = db.OptionValue.FirstOrDefault(x => x.OptionValueID == id);
        ViewBag.OptionValue = opv.OptionVal;
        ViewBag.Option = opv.Option.OptionName;
        ViewBag.Lsystem = opv.Option.Lsystem.LsystemName;
        ViewBag.FamilyName = opv.Option.Lsystem.LsystemFamily.FamilyName;
        ViewBag.OptionValID = id;
        ViewBag.OptionID = opv.OptionID;
        var setValue = db.SetValue.Where(x=>x.OptionValueID==id).OrderBy(x=>x.TcSet.SetName);
        ViewBag.OptionValueID = new SelectList(db.OptionValue.Where(x=>x.OptionID==opid), "OptionValueID", "OptionVal");
        return View(setValue.ToList());
}

我已经检查了大多数与此相关的问题，但是 none 有在不使用模型的情况下传递两个参数的开销。

更新：更清晰

 public ActionResult copy(int OptionValueID,int CopyID)
 {
     //do Something
     return View("Error");
 }

以上是复制方法

OptionValueID = ViewBag.OptionValID //Got from the Action Method Index of SetValues
CopyID = Value from the DropDownlist

根据答案编辑

@using (Html.BeginForm("Copy","SetValues",FormMethod.Post))
{
    <p>
        @Html.DropDownList("CopyID", null, "Select")
        <button type="submit" id="Copy" data-id="@ViewBag.OptionValID"> Copy </button>
    </p>
}

现在正在重定向页面，但未传递任何参数。我应该添加路由值吗？

Answer 1

没有 javascript 就做不到。您的 ActionLink() 方法在发送到客户端之前在服务器上进行了解析，因此任何路由值都是控制器中的初始值，而不是用户在视图中所做的任何编辑值。为了响应客户端事件，您需要 javascript.

您可以使用 ajax 将值 post 传给服务器方法。

包括一个按钮并处理它的点击事件

<button type="button" id="Copy" data-id="@ViewBag.id">Copy</button>

脚本

var url = '@Url.Action("Copy", "SetValues")';
$('#Copy").click(function() {
  var optionID = $(this).data('id');
  var copyID = $('#OptionValueID').val();
  $.get(url, { OptionValueID: optionID, copyID : CopyID }, function(response) {
    // do something with the response
  });
});

或者，如果您想重定向，则将 $.get() 替换为

location.href = url + '?OptionValueID=' + optionID + '&CopyID=' + copyID;

编辑

根据修改后的问题和评论，如果您想 post 并重定向，则不需要任何 javascript 或 link。下拉列表需要 @Html.DropDownList("CopyID", null, "Select") 以便其选择的值绑定到方法参数 int CopyID 并且由于未编辑 OptionValueID ，然后将其值添加为表单中的路由参数

@using (Html.BeginForm("Copy", "SetValues", new { OptionValueID = ViewBag.OptionID }, FormMethod.Post))

或为值添加隐藏输入

<input type="hidden" name="OptionValueID" value="@ViewBag.OptionID" />

根据 DropDownList 的值和模型调用 Action 方法

Calling an Action Method based on the value of DropDownList and the model

javascript

c#

asp.net-mvc-5

html.dropdownlistfor