I have an new/edit form in a Rails application using Selectize, fetching data from remote and displaying using a custom render function. The new action is working find, and I am able to save the data fine. But when the same form returns to edit the record, I am not able to load the option, with custom render and all.
I am sure many would have faced this issue, but I am not able to find a satisfactory answer anywhere.
My code looks like this.
$('#reservation_member_id').selectize({
valueField: 'id',
labelField: 'name',
searchField: ['code', 'name'],
create: false,
render: { option: Selectizer.renderOptions },
remoteUrl: '/members/select.json',
load: Selectizer.loadOptions
});
And the Selectizer goes
var Selectizer = function () {
return {
renderOptions: function (data, escape) {
return '<div>' +
'<img src="' + escape(data.image) + '" alt="' + data.name + '">' +
'<span class="title">' +
'<span class="name">' + escape(data.name) + '</span>' +
'</span>' +
'<span class="code">' + escape(data.code) + '</span>' +
'<span class="detail">' + escape(data.detail) + '</span>' +
'</div>';
},
loadOptions: function (query, callback) {
// if (!query.length) return callback();
console.log(this);
$.ajax({
url: this.settings.remoteUrl,
type: 'GET',
dataType: 'json',
data: {
s: query,
per: 10
},
error: function() {
callback();
},
success: function(data) {
callback(data.options);
}
});
}
};
}();
In Select2, there was something called initSelection available.
And my Select2 code looked like...
var initSelection = function (element, callback) {
var id = $('#display_item_id').val();
if (id!=="") {
$.ajax("/items/select.json?item_id=" + id)
.done(function(data) { callback(data.items[0]); });
};
};
TahseenAlaa, kofiasare and mericertan
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4