x-editable (twitter bootstrap): how to change the empty value?
Asked Answered
P

3

19

I'm using the x-editable plug-in to have in-place edits and it works well.

The following jsfiddle shows an example from their documentation: http://jsfiddle.net/ibrahima_yock/CFNXM/27/

<div>
     <span>Status:</span>
     <a href="#" id="status"></a>
</div>

.

//make status editable
$('#status').editable({
    type: 'select',
    title: 'Select status',
    placement: 'right',
    source: [
        {value: 1, text: 'status 1'},
        {value: 2, text: 'status 2'},
        {value: 3, text: 'status 3'}
    ]
 });

As you can see in the jsFiddle, in the html pane the status is "empty" (written in red). We'd like to translate that word into another language. How can we specify it?

Path answered 21/10, 2013 at 12:31 Comment(0)
C
35

You just add this option when setting up the field:

emptytext: 'Leer', // default is 'Empty'

Fiddle: http://jsfiddle.net/Saran/hdVYS/

You can find other options in the documentation.

Chiles answered 21/10, 2013 at 12:37 Comment(2)
@Chiles could you give here also solution for the case that the field is .editable('toggleDisabled')?Weld
@stenly, there's no option "toggleDisabled", so you probably are referring to disabled: true. With that option (as in this jsfiddle.net/Saran/fggey5mn/1), the value is cleared (instead of "Leer" being displayed as disabled). That, IMO, is a bug. Feel free to raise an issue here: github.com/vitalets/x-editable/issuesChiles
B
14

For those who prefer to use attributes, data-emptytext is another way to accomplish this:

<a href='#' id='status' 
    data-placeholder='This text appears when editing' 
    data-emptytext='This text appears when field is empty'> </a>
Buster answered 23/2, 2016 at 23:1 Comment(0)
W
0

@Saran negative, there is method "toggleDisabled" (bootstrap-editable.js line 1679) which turn off event click propagation. And this is my problem, when I switch it off, value is empty (i would like to see default value for "empty" value). In editable is property "handleEmpty" which clears empty value (bootstrap-editable.js line 1770) in the case that option disabled is to true and value is empty. I am trying to figure out how to rewrite this value to something else without touching library code

Weld answered 21/8, 2014 at 23:48 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.