Ajax 如何在TYPO3中使用ext:typoscript_和ext:from进行渲染

我在页面上有一个表单（基于

ext:form

），类似于content元素。我想在单击按钮时运行表单，而不重新加载页面。我知道我可以使用这个

ext:typoscript\u渲染

，但我仍然没有找到一个例子，如何做到这一点

我已经创建并添加了

JS

$(document).ready(function () {
    $('.frame-type-form_formframework').on('click', '#ajax-submit', function (e) {
        var ajaxUrl = $(this).data('ajaxuri');
        if (ajaxUrl !== undefined && ajaxUrl !== '') {
            e.preventDefault();
            var container = 'formaddnewpost-container-348';
            var formData = new FormData(this); // ???
            $.ajax({
                url: ajaxUrl,
                type: 'post',
                data: formData, // ???
                success: function (result) {
                    var ajaxDom = $(result).find('#' + container);
                    $('#' + container).replaceWith(ajaxDom);
                }
            });
        }
    });
});

我添加到表单：

additionalAttributes="{data-ajaxuri:'{t:uri.action(additionalParams:\'{tx_news_pi1:{controller:News,action:detail,news:newsItem}}\',contextRecord:\'currentPage\',extensionName:\'form\',pluginName:\'formframework\',controller:\'FormFrontend\',action:\'render\')->f:format.htmlentities()}'}"

我添加到按钮：

<f:form.button additionalAttributes="{data-ajaxuri:'{t:uri.action(additionalParams:\'{tx_news_pi1:{controller:News,action:detail,news:newsItem}}\',contextRecord:\'currentPage\',extensionName:\'form\',pluginName:\'formframework\',controller:\'FormFrontend\',action:\'render\')->f:format.htmlentities()}'}" property="__currentPage" value="{form.nextPage.index}" id="ajax-submit" class="btn btn-primary">{formvh:translateElementProperty(element: form.currentPage, renderingOptionProperty: 'nextButtonLabel')}</f:form.button>

{formvh:translateElementProperty（元素：form.currentPage，renderingOptionProperty:'nextButtonLabel'）}

我试过了

$(document).ready(function () {
    $('.frame-type-form_formframework').on('click', '#ajax-submit', function (e) {
        var ajaxUrl = $(this).data('ajaxuri');
        if (ajaxUrl !== undefined && ajaxUrl !== '') {
            e.preventDefault();
            var formIdSelector = '<f:format.raw>{form.formDefinition.identifier}</f:format.raw>';
            var containerIdSelector = formIdSelector + '-container';
            $.ajax({
                url: ajaxUrl,
                type: 'POST',
                data: $('#' + formIdSelector).serialize(),
                contentType: false,
                processData: false,
                success: function (response) {
                    var ajaxDom = $(response).find('#' + containerIdSelector);
                    $('#' + containerIdSelector).replaceWith(ajaxDom);
                }
            });
        }
    });
});

$（文档）.ready（函数（）{
$（'.frame-type-form_-formframework'）。在（'click'，'ajax-submit'，函数（e）{
var ajaxUrl=$（this.data（'ajaxuri'）；
如果（ajaxUrl！==未定义&&ajaxUrl！==''）{
e、 预防默认值（）；
var formIdSelector='{form.formDefinition.identifier}'；
var containerIdSelector=formIdSelector+“-container”；
$.ajax({
url:ajaxUrl，
键入：“POST”，
数据：$（'#'+formIdSelector）.serialize（），
contentType:false，
processData:false，
成功：功能（响应）{
var ajaxDom=$（response）.find（“#”+containerIdSelector）；
$（“#”+containerIdSelector）.replacement为（ajaxDom）；
}
});
}
});
});

…这很有效。现在，

表单

在不重新加载页面的情况下运行，但是表单中的数据不会发送

---

现在还有一个问题，如何从表单发送数据并获得结果？

您面临的问题与打字稿渲染无关，而是与表单序列化有关。所以，也许可以检查FormData是什么，以及如何从中获取值it@helhum谢谢也许你有经验使用“ext:typoscript_rendering”和“ext:form”，我不知道如何组合它们。也许你有一个例子，或者你可以告诉我在那里我可以阅读更多关于它。你检查过这个吗？是的，我看到并尝试过使用它，但没有积极的结果。我已经看过了，也试过了，但对我来说不起作用，我不明白为什么。我找不到任何有关

ext:typoscript\u呈现

和

ext:form

的信息。我没有找到您的

ext:typoscript\u呈现的有效示例

，只有

ext:new

分页