Question

我正试图在我的控制器Factoids中点击ajax动作"ajaxfactsAction()"。但是当进行ajax调用时，我收到303错误并重定向到另一个页面。

这就是我在调用ajax的模板中所拥有的：

<f:section name="main">
<h1>I am</h1>
<f:form action="">
    <f:form.select id="topics" name="topics" options="{categories}" optionValueField="uid" optionLabelField="title"  additionalAttributes="{onchange: 'getFacts()'}"/>
    <f:form.hidden id="extraids" name="extraids" value="3,4,5" />
    <f:form.hidden id="number" name="number" value="3" />
</f:form>
<div>
<div class="factoid1"><f:render partial="Category/Factoid1"   /></div>
<div class="factoid2"><f:render partial="Category/Factoid2"   /></div>
<div class="factoid3"><f:render partial="Category/Factoid3"   /></div>
</div>
<f:flashMessages renderMode="div" />

<script type="text/javascript">
    var actionsPathFromViewHelperSetInTheView = '<f:uri.action action="ajaxfacts" controller="Factoid" />';
</script>


</f:section>

这是javascript：

function performAjaxCall(Topics, Extraids, Number) {
    alert("dddd");
    $.ajax({
        url: actionsPathFromViewHelperSetInTheView,
        data:{
            "tx_factoids_interests[uid]":Topics,
            "tx_factoids_interests[extraids]":Extraids,
            "tx_factoids_interests[number]":Number
        },
        success:function (data) {
            // do something with your json
            alert('Load was performed.');
        }
    });
}

function getFacts(){
    performAjaxCall($("#topics").val(), $("#extraids").val(), $("#number").val());   
}

这是我的行动功能：

/**
     * action ajaxfacts
     *
     * @return void
     */
    public function ajaxfactsAction() {
        echo __LINE__;
        die;
}

和我在ext_localconf中的插件：

\TYPO3\CMS\Extbase\Utility\ExtensionUtility::configurePlugin(
    'Seethroughweb.' . $_EXTKEY,
    'Interests',
    array(
        'Factoid' => 'interests, list, show, new, edit, create, update, ajaxfacts',

    ),
    // non-cacheable actions
    array(
        'Factoid' => 'interests, list, show, new, edit, create, update, ajaxfacts',

    )
);

我缺少什么才能使行动成为可能？

由此产生的uri看起来像这样：

xhttp://...xyz.com/index.php?id=111&tx_factoids_interests%5Baction%5D=ajaxfacts&tx_factoids_interests%5Bcontroller%5D=Factoid&cHash=0e805af8af888ebd7fec5e207f64b5f7&tx_factoids_interests%5Buid%5D=5&tx_factoids_interests%5Bextraids%5D=3%2C4%2C5&tx_factoids_interests%5Bnumber%5D=3

从第一部分即可访问页面，即：

xhttp://....xyz.com/index.php?id=111

我正在使用Typo3 6.2，感谢。

PS：javascript第二版 - 像Arek的回答一样工作。

function performAjaxCall(Topics, Extraids, Number) {
    alert("performAjaxCall");
    $.ajax({
        url: $('form').attr('action'), // now we're using the url generated by Extbase/Fluid
        data: $('form').serialize(), // serializes the form

//        data:{
//            "tx_factoids_interests[uid]":Topics,
//          "tx_factoids_interests[extraids]":Extraids,
//          "tx_factoids_interests[number]":Number
//        },
        success:function (data) {
            // do something with your json
            alert('performAjaxCall Load was performed.');
        }
    });
    return false;
}

PPS：此方法的请求uri现在如下所示：

http://...xyz.com/undefinedindex.php?id=111&tx_factoids_interests%5Baction%5D=ajaxfacts&tx_factoids_interests%5Bcontroller%5D=Factoid&cHash=0e805af8af888ebd7fec5e207f64b5f7

和当前的javascript：

function performAjaxCall( Topics, Extraids, Divid) {
    //alert("performAjaxCall");
    $.ajax({
        type: "POST", 
        dataType: "json",

        url: $('base').attr('href') + $('#form1').attr('action'), // now we're using the url generated by Extbase/Fluid
        data: $('#form1').serialize(),

//      url: actionsPathFromViewHelperSetInTheView,
//        data:{
//            "tx_factoids_interests[uid]":Topics,
//          "tx_factoids_interests[extraids]":Extraids           
//        },

        success:function (data) {
            // do something with your json

            $.each( data, function( key, val ) {
                var items='';
                var id = '';
                $.each( val, function( ikey, ival ) {
                    if(ikey =='category') id = Divid +" #factoid"+ival; 
                    items +=  "<span class="+ikey+">" + ival + "</span><br/>" ;
                });
                $(id).html(items);

            });

//          $(".factoid1").html();
//          $(".factoid2").html();
//          $(".factoid3").html();
            //alert('performAjaxCall Load was performed.');
        }
    });
}

function getFacts(Divid){
    performAjaxCall( $(Divid+"topics").val(), $(Divid+"extraids").val(), Divid );    
    return false;
}

和当前模板：

 <div id="interests">
    <f:form action="ajaxfacts" controller="Factoid" id="form1">
        <f:form.select id="intereststopics" name="topics" options="{categories}" optionValueField="uid" optionLabelField="content"  additionalAttributes="{onchange: 'getFacts(\'#interests\')'}"/>
        <f:form.hidden id="interestsextraids" name="extraids" value="2,4,5" />

    </f:form>
    <div>
    <div id="factoid2" class="factoid1"></div>
    <div id="factoid4" class="factoid2"></div>
    <div id="factoid5" class="factoid3"></div>
    </div>
    </div>

PPPS：最终代码

function performAjaxCall( Topics, Extraids, Divid, Formid) {
      $.ajax({
        type: "POST", 
        dataType: "json",

        url: $(Formid).attr('action'), // now we're using the url generated by Extbase/Fluid
        data: $(Formid).serialize(),

        success:function (data) {

            $.each( data, function( key, val ) {
                var items='';
                var id = '';
                $.each( val, function( ikey, ival ) {
                    if(ikey =='category') id = Divid +" #factoid"+ival; 
                    $(id +" ."+ikey).html(ival);

                });

            });

        }
    });
}

function getFacts(Divid, Formid){
    performAjaxCall( $(Divid+"topics").val(), $(Divid+"extraids").val(), Divid, Formid );    
    return false;
}

Answer 1

您没有设置<f:form action="">。

根据您cHash生成的网址，计算出的<f:uri>不包含您在JavaScript中添加的其他属性的任何信息。因此，您遇到了cHash错误。

您可以通过禁用pageNotFoundHandler（本地配置）来阻止cHash出现$GLOBALS['TYPO3_CONF_VARS']['FE']['pageNotFoundOnCHashError']错误。

有关详情，请点击cHash：

The mysteries of &cHash

前端插件的＆amp; cHash参数可能让很多开发人员感到困惑，但本文将解释它是如何工作的以及为了使用TYPO3制作出色，可靠的插件而应该避免的事情。

<强>解决方案

您需要使用Extbase / Fluid生成的表单中的url，而不是自定义action。

所以你的表格应该是这样的：

<f:form action="ajaxfacts" controller="Factoid">

你的JavaScript应该是这样的：

$(function() { 

    $('form').submit(function(e) {

        $.ajax({
            type: "POST",
            url: $('base').attr('href') + $('form').attr('action'), // now we're using the url generated by Extbase/Fluid
            data: $('form').serialize(), // serializes the form
            success:function (data) {
                // do something with your json
                alert('Load was performed.');
            }
        });

        return false;
    });

});

PPPS Final js code：

function performAjaxCall( Topics, Extraids, Divid, Formid) {

    $.ajax({
        type: "POST", 
        dataType: "json",


        url: $(Formid).attr('action'), // now we're using the url generated by Extbase/Fluid
        data: $(Formid).serialize(),

        success:function (data) {

            $.each( data, function( key, val ) {
                var items='';
                var id = '';
                $.each( val, function( ikey, ival ) {
                    if(ikey =='category') id = Divid +" #factoid"+ival; 
                    $(id +" ."+ikey).html(ival);
                    //items +=  "<span class="+ikey+">" + ival + "</span><br/>" ;
                });

            });

        }
    });
}

function getFacts(Divid, Formid){
    performAjaxCall( $(Divid+"topics").val(), $(Divid+"extraids").val(), Divid, Formid );    
    return false;
}

为什么不能找到我的拼写错误6.2 ajax行动？

1 个答案: