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’).