X editable field problem with one quote
With bootstrap 3, I'm trying to make a single quote in an x-editable edit box as one of the possible options.
<a href="#" class="editable"
data-type='select'
data-value="[{value:'1',text:'I'm happy'},{value:'2',text:'or sad'}]">
Select me
</a>
In this example, I'm trying to change the "I'm happy" show as one of the options. I am passing data in a JSON string via the data-value attribute.
This link is made editable (X-editable JS lib) with this function call:
$('.editable').editable({
mode: 'popup',
type: 'text',
success: function(response) {
}
});
Click on the Select me link and you will see a red error from X-editable: Error loading list. (probably because my quote breaks the JSON structure).
Here is my problem in the JSFiddle !
Any suggestion to fix this is appreciated. Thank.
source to share
You are using the wrong attribute for the source, it should look something like this:
<div style="margin: 150px">
<a href="#" class="editable" data-type='select' data-value="1" data-source="[{value:'1',text:'I\'m happy'},{value:'2',text:'or sad'}]">Select me</a>
</div>
From the documentation :
Value : initial value. Must be defined for type select to store the identifier of the display text.
source : the source of the data in the select element. If string is the url in question for ajax to load elements. Otherwise, there should be json.
And avoid quotes with backslashes.
source to share