Post 表单的一部分 Asp.net mvc

Question

我有一个表单，其中包含两个文本框、两个下拉列表和一个标签。当我填充前两个文本框和两个下拉列表的 select 值时，所有值都将连接起来并放入标签 one 中。所以现在当我单击“保存”按钮时，我只想 post 标签的值，而不是这些其他文本框和清单。我怎样才能为标签激活 post 方法并为这些其他标签禁用该方法？以下是我目前的代码：

   <div class="panel-body">
            @using (Html.BeginForm())
            {
                <div class="form-group">
                    <div class="row">
                        <div class="col-md-6">

                            @Html.Label("Part/Location", new {@class = "control-label"})
                            @Html.TextBox("PartLocation", null, new { @class = "form-control" })
                            @Html.ValidationMessageFor(model => model.Name)

                        </div>
                        <div class="col-md-6">

                            @Html.Label("Index", new {@class = "control-label"})
                            @Html.TextBox("Index", null , new {@class = "form-control"})
                            @Html.ValidationMessageFor(model => model.Name)

                        </div>

                    </div>

                    <div class="row">
                        <div class="col-md-6">

                            @Html.Label("Measurement", new {@class = "control-label"})
                            @Html.DropDownList("Measurements", "Select measurement")
                            @Html.ValidationMessageFor(model => model.ChannelGroupId)

                        </div>
                        <div class="col-md-6">

                            @Html.Label("Location", new {@class = "control-label"})
                            @Html.DropDownList("DirectionTypes","Select direction")
                            @Html.ValidationMessageFor(model => model.ChannelGroupId)

                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">

                            @Html.LabelFor(model => model.ChannelGroupId, new {@class = "control-label"})
                            @Html.DropDownListFor(x => x.ChannelGroupId, Model.ChannelGroups, "Select Channel Group", new {@class = "form-control"})
                            @Html.ValidationMessageFor(model => model.ChannelGroupId)

                        </div>
                        <div class="col-md-6">
                            <label class="control-label"></label>
                            <a href="#" id="addChannelGroup" class="form-control" style="border: none">
                                <i class="fa fa-plus-circle">Add Group</i>
                            </a>
                        </div>
                    </div>
                    <br />
                    <div class="row">
                        <div class="col-md-6">
                            @Html.Label("Channel name: ", new { id = "channelName",@class = "control-label" })
                        </div>
                    </div>

                </div>

这是 Jquery 处理串联：

 $("#PartLocation, #Index,#Measurements,#DirectionTypes").change(function () {
        var partLocationText = $("#PartLocation").val();
        var indexText = $("#Index").val();
        var mesurementSelected = $("#Measurements option:selected").text();
        var directionSelected = $("#DirectionTypes option:selected").text();

            $("#channelName").empty();
            $("#channelName").append("Channel name: " + partLocationText + "_" + indexText);

        if (mesurementSelected != "Select measurement") {
            $("#channelName").append("_" + mesurementSelected);
        }
        if (directionSelected != "Select direction") {
            $("#channelName").append("_" + directionSelected);
        }
    });

Answer 1

您可以在这里做很多事情来实现您想要的。

1. 根据 HTML 规范，所有 HTML 控件（输入、选择）如果没有名称属性则不会 post。 So Simple 从这些控件中删除 name 属性将阻止它们 posting 它们的值。除此之外，因为标签值未 post 回退，您还必须创建一个隐藏的文本框，将其值更新为连接值（即标签的值），然后允许 post 发生.

$(function(){
 $("#PartLocation, #Index,#Measurements,#DirectionTypes").removeAttr('name');
 //this will remove their name attribute and hence their values wont be posted back
})

并更新隐藏文本框的值（输入[type="text"]）。

$("#PartLocation, #Index,#Measurements,#DirectionTypes").change(function () {
       //your code
       //let cs be the final concatenated string.
       $("#channelName").append(cs);
       $('#hiddenInput').val(cs);
    });

2. 你可以通过 Javascript 和 post 只接管 posting 机制，只有你想要 post 的值。显然，要实现这一点，您最好将操作方法的 return 类型更改为 HttpResult 或 JsonResult，以更适合您的方式为准。

$(function(){
$('form').submit(function(f, e){
  e.preventDefault();
  //callculate your concatenated string.
  //assumed to be cs
  $.ajax(url/*url to ur post action method*/, {
   //fill in the suitable params see the jquery link for more help
  })
})
})

JQUERY AJAX LINK

Post 表单的一部分 Asp.net mvc

Post part of a form Asp.net mvc

jquery

asp.net-mvc

textbox

html.dropdownlistfor