Using EXT:ajaxselectlist with speaking URLs

So you have successfully configured ajaxselectlist, then activated RealURL and now just get an error message?

The message should read as follows:

Page Not Found

Reason: Segment “index.php” was not a keyword for a postVarSet as expected on page with id=28.

Luckily there’s an easy solution: you need to slightly adapt the Ajax call. Change url: 'index.php' to url: '/':

jQuery(document).ready(function ($) {
        var form = $('#ajaxselectlist-form');
        var selectForm = $('.ajaxFormOption');
        var resultContainer = $('#ajaxCallResult');
        var service = {
                ajaxCall: function (data) {
                        $.ajax({
                                url: '/',
                                cache: false,
                                data: data.serialize(),
                                success: function (result) {
                                        resultContainer.html(result).fadeIn('fast');
                                        // IMPORTANT! When using a lightbox for images, you'll need to call it again after Ajax is done adding the new DOM to the document:
                                        // $('.lightbox').magnificPopup({
                                        //  type: 'image'
                                        // });
                                },
                                error: function (jqXHR, textStatus, errorThrow) {
                                        resultContainer.html('Ajax request - ' + textStatus + ': ' + errorThrow).fadeIn('fast');
                                }
                        });
                }
        };
        form.submit(function (ev) {
                ev.preventDefault();
                service.ajaxCall($(this));
        });
        selectForm.on('change', function () {
                resultContainer.fadeOut('fast');
                form.submit();
        });
        selectForm.trigger('change');
});

Note

Starting with ajaxselectlist v4.0.0, the List.html template is already adapted. This will also work with the speaking URLs of TYPO3 v9 (‘Routing’).