基于DropDownList和模型的值调用Action方法

时间:2015-11-13 09:11:01

标签: javascript c# asp.net-mvc-5 html.dropdownlistfor

我的视图中有一个下拉列表。我需要让用户从下拉列表中选择一个值,然后单击一个按钮/ ActionLink以在同一个控制器中调用另一个操作方法。需要传递给新ActionMethod的值是下拉列表中所选值的ID,以及传递给View的模型的ID。模型和下拉列表不以任何方式链接在一起。

我已尝试onchnage = document.location.href设置操作方法的路径,并将单个值传递给操作方法。但是document.location.href的问题是它将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 itemID that is being passed through ViewBag.id

View返回的视图将是另一个视图

我尝试过的

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());
}

我已经检查过与此相关的大多数问题,但没有人在没有使用模型的情况下传递两个参数的开销。

更新:更清晰

 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>
}

现在页面正在被重定向但是没有传递参数。我应该添加路由值吗?

1 个答案:

答案 0 :(得分:1)

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

您可以使用ajax将值发布到服务器方法。

包含一个按钮并处理其点击事件

<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;

修改

根据修改后的问题和评论,如果您想发布和重定向,则无需任何javascript或链接。下拉列表必须为@Html.DropDownList("CopyID", null, "Select"),以便其选定的值绑定到方法参数int CopyID,并且由于未编辑OptionValueID,因此要将其值作为路径参数添加到表单< / p>

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

或为值

添加隐藏输入
<input type="hidden" name="OptionValueID" value="@ViewBag.OptionID" />