Ive followed this example from another SO thread: X-editable custom field type not respecting overridden defaults and its helped me to create a similar custom field with x-editable. All is working ok but i cant figure out how render/display the 'text' of the select - the SO example ouputs the 'value'. my js to initialis the x-editable to use my custom inputs is thus:
$('#stffulladdress').editable({
url : '',
pk : 6,
value : {
address : "",
city : "",
region : "",
postcode : "",
country : "eng"
},
sourceCountry: [
{ value: "eng", text: "ENGLAND" },
{ value: "ire", text: "IRELAND" },
{ value: "sco", text: "SCOTLAND" },
{ value: "cym", text: "WALES" }
],
validate : function(value) {
if (value.address == '' || value.postcode == '') return "Address first lines AND Postcode required";
},
display : function(value) {
if (!value) {
$(this).empty();
return;
}
console.log(value.country);
var html = $('<div>').html( value.address + '<br />' + value.city + '<br />' + value.region + '<br />' + value.postcode + '<br />' + value.country );
$(this).html(html);
}
});
My custom x-editable class is the same as the SO example mentioned with the only difference being i have more inputs -they work ok as expected. I would have thought that this snippet from the x-edit class gets the text of the selected item:
value2html: function(value, element) {
if(!value) {
$(element).empty();
return;
}
var countryText = value.country;
$.each(this.sourceCountryData, function (i, v) {
if (v.value == countryText) {
countryText = v.text.toUpperCase();
}
});
var html = $('<div>').html( value.address + ',<br />' + value.city + ',<br />' + value.region + ',<br />' + value.postcode + ',<br />' + countryText );
$(element).html(html);
},
But upn displaying the selected country i still get the country value "eng" and not the text "England".
I've tried :
value.country which gives me the value 'eng' and value.text gives undefined
Any idea how i can get the selected text??
thanks
