ASP.NET MVC 多语言功能无法按预期工作

Question

我的应用程序使用 单选按钮 例如

@using (Html.BeginForm("SetCulture", "Home"))
{
<input type="radio" name="culture" id="en-us" value="en-us" class="culture" /> English
<input type="radio" name="culture" id="tr" value="tr" class="culture" /> Türk
}

但是当我使用 图像类型的输入时，它不会发送想要的 VALUE

@using (Html.BeginForm("SetCulture", "Home"))
{
<input type="image" src="~/Content/Images/en.png" name="culture" id="en-us" value="en-us" class="culture" /> 
<input type="image" src="~/Content/Images/tr.png" name="culture" id="tr" value="tr" class="culture" />
}

jQuery 代码：

$(".culture").click(function () {
     $(this).parents("form").submit(); // post form
});

HomeController 代码：

public ActionResult SetCulture(string culture){
    // action code here
}

我看不出图像无法正常工作的原因，但由于某种原因它发生了。有什么想法吗？

非常感谢

Answer 1

在第一个代码块（使用<input type="radio" .. />）中，您的表单只会回发一个culture 的值（所选单选按钮的值）。

在第二个代码块中（使用<input type="image" .. />），您的表单将回发两个输入的值，因此您的表单数据为culture=en-US&culture=tr

DefaultModelBinder 将绑定第一个值并忽略第二个值，因此 POST 方法中的culture 的值将始终为“en-US”，无论您单击哪个图像。

一个选项是禁用另一个输入（例如，禁用的输入不会回发值

$(".culture").click(function () {
    $(this).siblings().prop('disabled', true); // disable the other input
    $(this).parents("form").submit(); // post form
});

处理此问题的另一个选项是使用<img> 标记和文化值的隐藏输入

<input type="hidden" name="culture" id="culture"/>
<img src="~/Content/Images/en.png" data-culture="en-US" class="culture" />
<img src="~/Content/Images/tr.png" data-culture="tr" class="culture" />

$('.culture').click(function () {
    $('#culture').val($(this).data('culture')); // update the hidden input
    $('form').submit();
})