Question

我有一个接收JSON请求的控制器方法。控制器返回已提交表单的数据，然后将更新的数据异步加载到页面中。然后，表格应该可以重新提交任意次，而无需重新加载页面。

我遇到的问题与初始表单提交后控制器方法读取的JSON数据有所不同。

相关的控制器代码是：

/**
 * Creates a new HoursSpecial entity.
 *
 * @Route("/", name="hoursspecial_postcreate")
 * @Method("POST")
 */
public function postCreateAction(Request $request){
    $requestData = $request->request->all();

    $date = $requestData['eventDate']; 

    ...
}

这是AJAX代码：

/* Handle submission of special hours form */
$('.specialHours_form').on('submit', function(event){
    var targetForm = $(this);

    event.preventDefault();

    ajaxObject = {
        url: $(this).attr("action"),
        type: 'POST',
        contentType: "application/json; charset=UTF-8",
        data: JSON.stringify({"openTime":$("#appbundle_hoursspecial_openTime", this).val(), "closeTime":$("#appbundle_hoursspecial_closeTime", this).val(), "status":$("input[name^='appbundle_hoursspecial']:checked", this).val(), "event":$("#appbundle_hoursspecial_event").val(), "area":$("#appbundle_hoursspecial_area", this).val(), "eventDate":$("#appbundle_hoursspecial_eventDate", this).val()})
    }

    $.ajax(ajaxObject)
        .success(function(data,status,xhr) {
                console.log( status );
                $('#special_hours_container').html(data); //show special hours for chosen week
                $('#dynamic_daterange').html(' Week of ' + $('#special_firstday').html() + ' thru ' + $('#special_lastday').html() + ' ');
                makeTimepicker('.specialHours_form', '#appbundle_hoursspecial_openTime, #appbundle_hoursspecial_closeTime'); //apply timepicker to special hours elements
                $('span.label-success, span.label-danger').remove();
        })
        .fail(function(data,status,xhr) {
                $('span.label-success, span.label-danger').remove();
                $('#appbundle_hoursspecial_submit', targetForm).after('<span class="label label-danger"><span class="glyphicon glyphicon-remove"></span></span>');
                console.log( status );
                console.log("dangah!");
        })
        .always(function(data,status,xhr) {
                console.log( status );
        });
});

因此，如果我第一次提交此表单并运行$ requestData的var_dump，我会得到（使用示例数据）：

array(6) { ["openTime"]=> string(5) "01:00" ["closeTime"]=> string(5) "11:00" ["status"]=> string(1) "0" ["event"]=> string(1) "1" ["area"]=> string(2) "10" ["eventDate"]=> string(10) "2016-01-04" }

但是，如果我第二次这样做，数据会放在第二个数组中，其中的键是我提交的表单的名称：

array(1) { ["appbundle_hoursspecial"]=> array(7) { ["openTime"]=> string(5) "00:30" ["closeTime"]=> string(5) "02:00" ["status"]=> string(1) "0" ["eventDate"]=> string(10) "2016-01-04" ["area"]=> string(2) "10" ["event"]=> string(1) "1" ["submit"]=> string(0) "" } }

显然我最终得到了错误：

Notice: Undefined index: eventDate

这有一个原因，我无法弄清楚它可能是什么！我知道我可以检查控制器中是否存在appbundle_hoursspecial键，但如果不需要，我宁愿不这样做。

Answer 1

这可能与您渲染的表单有关。

$('#special_hours_container').html(data);

我认为数据实际上是表单的HTML。可能在你的表单类型中你有类似的东西：

// HoursSpecialFormType or something

...

public function getName()
{
    return 'appbundle_hoursspecial';
}

这会导致插入页面的所有新表单都是：

<input name="appbundle_hoursspecial[openTime]" type=text />

然后，当您的数据再次提交时，它将被包装在该数组中。

要解决此问题

根本不提供表单名称。

public function getName()
{
    return '';
}

使用AJAX的Symfony 2：向控制器方法提交格式化请求

1 个答案: