1

我正在尝试使用 MVC 编写一个简单的页面，显示特定事件的图例定义。模型的结构是

public class ServiceSymbols
{
    [Required(ErrorMessage = "ID is required")]
    public int ID { get; set; }
    public List<SymbolsDef> SymbolsDef { get; set; }

}
public class SymbolsDef
{
    public string value { get; set; }
    public string label { get; set; }
    public string color { get; set; }
}

在视图中，一个服务符号（ServiceSymbols）有多个符号定义（SymbolsDef），我使用了 AJAX，它可以根据表格行添加或删除符号定义。但是有一个问题。

如果页面最初加载 2 行。然后，我通过 AJAX 添加了 3 行，为每一行输入值，提交表单。然后，我检查了控制器中的值（通过添加断点），只有前 2 个 SymbolsDef 值是我输入的，其余与第二个相同。如果页面最初加载 5 行，并且我不添加或删除任何内容，只需更改每条记录的值，然后提交。那么传递给控制器​​的值就没有这个问题了。

这是提交功能的一部分：

function saveServiceSymbology() {
    var symbolData = $("form#EditSymbols").serialize();
    $.ajax({ url: "/Home/SaveSymbolsDef",
        async: false,
        type: "POST",
        data: symbolData,
        success: function (data) {
            alert("Succeed");
        }
    });
}

我认为这是对模型问题的一种绑定值，我也怀疑序列化函数。

有没有人遇到过这种问题？它让我呆了一段时间，非常沮丧。

这是添加新行的操作方法：

[OutputCache(Duration = 0)] // make sure come here each time, do not cathe it.
public ActionResult AddNewSymbolsDef()
{
    return PartialView("_SymbolsDefPartial", new SymbolsDef());
}

这是保存方法：

[HttpPost]
public ActionResult SaveSymbolsDef(ServiceSymbols ServiceSymbols)
{
    //Actions Here
}

我没有为 SaveSymbolsDef 编写所有动作，因为当我在 SaveSymbolsDef 中设置一个断点，并将光标放在“ServiceSymbols”上，并从那里查看所有值时，该值已经改变，所以我没有不认为这将是行动问题。

Here is the log output when I add a new row:    
<tr>
    <input autocomplete="off" name="SymbolsDef.Index" type="hidden" value="f65560ae-650b-4f6d-ba7e-29db945dc3b0" />
    <td style="display:none">
        <input type="text" id = "fromValue" />
    </td>
    <td style="display:none">
        <input type="text" id = "toValue" />
    </td>
    <td>
        <input id="value" name="SymbolsDef[f65560ae-650b-4f6d-ba7e-29db945dc3b0].value"  type="text" value="" />
    </td>
    <td>
        <input id="label" name="SymbolsDef[f65560ae-650b-4f6d-ba7e-29db945dc3b0].label"  type="text" value="" />
    </td>
    <td id="symbolColorPicker">
        <input class="color" id="SymbolsDef_f65560ae-650b-4f6d-ba7e-29db945dc3b0__color" name="SymbolsDef[f65560ae-650b-4f6d-ba7e-29db945dc3b0].color"  type="text" value="" />
        <input id="color" name="SymbolsDef[f65560ae-650b-4f6d-ba7e-29db945dc3b0].value" type="hidden" value="" />
    </td>
    <td>
        <img src="../../Scripts/Images/delete.png" id="DeleteSymbol" title="Delete this row" alt="delete" style="cursor: pointer;" onclick=
        "if ($('#symbolsdiv tr').length > 3) $(this).closest('tr').remove();else alert('This can not be deleted!');reasignSymbol()" />
    </td>
</tr>
4

0 回答 0