Question

简而言之，我们有具体要求。这是将某些数据放入表单元素，然后提交表单。我们这样做的原因是打开一个新窗口返回一个excel电子表格，但我们需要将参数提供给表单请求。

基本上，我的数据点（javascript中的clickPoints变量）没有被传递给服务器端的action方法，但它是在表单请求中。

如下：

$("#excel").click(function() {
    $("#Points").val(getExcelDataPoints(clickPoints));
    $("#GeomType").val("LINESTRING");
    $("#StartDate").val($("#start-date").val());
    $("#EndDate").val($("#end-date").val());
    $("#ExcelExport").submit(); // this is the form which I want to submit
});

除点之外，所有其他参数都可以正常工作。这是getExcelDataPoints

的定义

function getExcelDataPoints(points)
{
    var data = "{'Points': [";

     for(var i = 0; i < points.length; i++) {
         data += "{'Da': '" + points[i].lat() + "', 'Ea': '" + points[i].lng() + "'},"; 
     }

     data = data.substr(0, data.length - 1);
     data += "]}";

     return data;
}

您可能想知道我为什么要手动构建它。有原因。问题是，当使用jquery执行$.ajax请求时，这个肯定是，所以我知道格式绝对没问题。但是，当执行上面的第一个代码清单时，它不起作用。

这是服务器上的操作定义;

[HttpPost]
public IList<AISExcelPosition> ExcelExport(LatLng[] Points, GeomType GeomType, DateTime StartDate, DateTime EndDate)
{
     var poo = Request.Form["Points"];
        // Magical.... UNICORNS!
        /* 
             `\
               \\,
                \\\,^,.,,.
                ,;7~((\))`;;,,
                ,(@') ;)`))\;;',
                 )  . ),((  ))\;,
                /;`,,/7),)) )) )\,,      ,,,... ,
               (& )`   (,((,((;( ))\,_,,;'`    `\\,
                `"    ` ), ))),/( (            `)\,
                       '1/';/;  `               ))),
                        (, (     /         )    ((/,
                       / \                /     ((('
                      ( 6--\%  ,>     ,,,(     /'))\'
                       \,\,/ ,/`----~`\   \    >,))))'
                         \/ /          `--7>' /((((('
                         (,9             // /'('((\\\,
                          \ \,,         (/,/   '\`\\'\
                           `\_)1        (_)Kk    `\`\\`\
                             `\|         \Z          `\
                               `          "            `

         */

是。我的代码中有一只宠物独角兽。

你会看到我们在那里推送的var poo = Request.Form["Points"];位向我们证明了（并且在观察底层POST请求中的表单数据之后）数据确实存在，所有格式都很好。

这是实际的JSON数据：

"{'Points': [{'Da': '49.45995313552066', 'Ea': '-2.5134216308593977'},{'Da': '49.45894893804116', 'Ea': '-2.5134216308593977'}]}"

关于我应该做什么的任何线索？

Answer 1

我最好的猜测是，您的积分将作为字符串值传递到服务器，而不会被解释为JSON。

$.ajax有效，因为从getExcelDataPoints(points)返回的字符串是一个JSON对象，其属性名为Points，这与您的action参数直接匹配。它采用这种格式：{ ... }。当您将该对象放在input元素中时，它会更改为更像这样的格式："{ ... }"，这是一个字符串。

此设置的另一个不那么重要的问题是getExcelDataPoints(points)正在生成属性名称Points，然后您将其取出并将其放在您的字段中，该字段也被命名为Points，你是一个额外的包装器，所以值看起来更像Points.Points[]而不仅仅是Points[]。

为了测试您是否可以以常规形式提交JSON数据，我设置了一个快速MVC3项目并更改了Home / Index视图以获得以下代码：

@using (Html.BeginForm("About", "Home"))
{
    <input type="hidden" name="Points" value="[{'Da': '49.45995313552066', 'Ea': '-2.5134216308593977'},{'Da': '49.45894893804116', 'Ea': '-2.5134216308593977'}]" />
    <input type="submit" />
}

<a id="jason">Run The Query!</a>

<script type="text/javascript">
    $('#jason').click(function (event) {
        $.post('@Url.Action("About")', {'Points': [{'Da': '49.45995313552066', 'Ea': '-2.5134216308593977'},{'Da': '49.45894893804116', 'Ea': '-2.5134216308593977'}]}, function (data) {
            alert(data);
        });
        event.preventDefault();
    });
</script>

主页/关于操作已更改如下：

[HttpPost]
public ActionResult About(LatLng[] Points)
{
    var poo = Request.Form["Points"];

    return Json("hello");
}

这确认它是一个字符串。你可以使用各种方法shown here向一个动作提交一个列表，所以我想我会修改一些快速的js来将你的JSON格式化为可以用于你正在做的事情的表单元素。它不漂亮，但是如果你被迫使用表单提交，它会起作用（或者Kevin表示，我会告诉你如何用脚射击自己，但你必须做出决定它）：

@using (Html.BeginForm("About", "Home", FormMethod.Post, new { @class = "point-maker" }))
{
    <input type="submit" />
}

<script type="text/javascript">
    $(function () {
        var points = [{ 'Da': '49.45995313552066', 'Ea': '-2.5134216308593977' }, { 'Da': '49.45894893804116', 'Ea': '-2.5134216308593977'}];
        var form = $('.point-maker');
        for (var index in points) {
            var point = points[index];
            form.append(CraftHiddenPoint(index, point.Da, point.Ea));
        }
    });
    function CraftHiddenPoint(index, da, ea) {
        return $('<input type="hidden" name="Points[' + index + '].Da" value="' + da + '" /><input type="hidden" name="Points[' + index + '].Ea" value="' + ea + '" />');
    }
</script>

在jQuery中提交带有JSON数据的表单

1 个答案: