Question

我有多个提交表单的按钮。我检查传入控制器的输入值是否点击了哪个按钮。

public async Task<ActionResult> MyAction(MyModel model, string command)

下面的html有效。在我的控制器中command等于myValue

<input type="submit" name="command" value="myValue" />

下面的html不起作用。在我的控制器中command是null

<input type="image" name="command" src="..." value="myValue"/>

W3C says the type 'image' is a submit button

那么为什么这两个输入元素的表现不同？

Answer 1

根据问题中链接的过期工作草案和当前HTML5 CR草案以及HTML 4.01建议，图像提交按钮确实表现不同，按照定义。根据HTML5 CR，construction of the form data set不会为图像提交按钮添加名称=值对，而是将name.x = ...和name.y = ...添加，并将点击的位置的坐标作为值。这与旧的定义和浏览器惯例相对应，但Chrome 另外添加了名称=值对。

因此，在您的情况下，表单数据将包含字段command.x和command.y，其中包含您可能不感兴趣的值。这是您在编码时需要采取的起点表单处理程序。这意味着如果您需要识别使用了多个图像按钮中的哪一个，则需要为它们提供不同的name属性。

Answer 2

您可以拥有一个隐藏字段，并在该隐藏字段中设置命令名称，该按钮单击该按钮，并获取在服务器端提交该表单的按钮的名称。

<强>的Javascript

$(".submit").click(function(){
    var commandName = $(this).attr("val");
    $("input[type=hidden]").val(commandName);
});

<强> HTML

<form>
    <input type="hidden" name="command">

    <input type="submit" value="submitbtn" class="submit" />
    <input type="image" src="..." value="imagebtn" class="submit"/>
</form>

Answer 3

完成此任务的最简单（可能也不安全）的方法是内联JQuery，方法如下：

查看：

<input type="image" src="..." onclick="$('#hidImgValue').val('Image1');" />

<input type="hidden" id="hidImgValue" name="command" value="none" />

CONTROLLER：

public async Task<ActionResult> MyAction(MyModel model, string command)

命令var的值为"Image1"。

输入类型=＆＃39;图像＆＃39;因为提交按钮的行为与“提交”按钮的行为不同

3 个答案: