如何在編輯前清理X-Editable值*

Question

我使用X-Editable爲用戶提供了內聯編輯值的可能性。這很好，但我現在想用它來獲得一些以「歐洲方式」本地化的金錢價值（例如：€ 12.000.000,00）。當我點擊編輯時，我希望輸入只包含12000000。

有沒有一種方法可以在X-Editable 之前對它的值進行清理：它在X-Editable輸入中顯示？歡迎所有提示！

Answer 1

查看猛擊http://plnkr.co/edit/Vu78gRmlKzxrAGwCFy0b。從X-editable文檔中可以明顯看出，您可以使用配置的value屬性來格式化要發送給編輯器的值，如下所示。

元素在你的HTML顯示物有所值：

<a href="#" id="money">12.000.000,00</a> 

Javascript代碼在你的HTML：

<script type="text/javascript"> 
     $(document).ready(function() { 
      $.fn.editable.defaults.mode = 'inline'; 
      $('#money').editable({ 
       type: 'text', 
       pk: 1, //Whatever is pk of the data 
       url: '/post', //Post URL 
       title: 'Enter money', //The title you want to display when editing 
       value:function(input) { 
        return $('#money').text().replace(/\./g, '').replace(/,00$/,''); 
       } 
      }); 
     }); 
</script> 

如果你想編輯，你可以做，在display後值的格式回顯示屏配置哈希的屬性如下：

  $('#money').editable({ 
       type: 'text', 
       pk: 1, //Whatever is pk of the data 
       url: '/post', //Post URL 
       title: 'Enter money', //The title you want to display when editing 
       value:function() { 
        return $('#money').text().replace(/\./g, '').replace(/,00$/,''); 
       }, 
       display:function(value) { 
        //var formattedValue = formatTheValueAsYouWant(value); 
        //$('#money').text(formattedValue); 
       } 
      }); 

Answer 2

似乎沒有回調函數可用於你想要的。 所以你需要把它放在庫之外。

這裏是如何做到這一點。

$(document).on("focus",".form-control.input-sm",function(){ 
    //remove all characters but numbers 
    var _val = $(this).val().match(/\d/g).join(""); 
    //set it. 
    $(this).val(_val); 
}); 

將.form-control.input-sm的部分替換爲您的情況。 我只是測試這對圖書館的演示網站的第一個演示fieled命名爲「簡單的文本字段」鉻developper工具

http://vitalets.github.io/x-editable/demo-bs3.html

由於x編輯的形式將正確顯示up.You需要掛鉤的之前生成事件文件並等待x-editable表格內的input字段得到焦點即爲時間x-editable顯示並將值編輯成任何你想要的值。

是的，這種方法的工作原理AFTER輸入字段顯示，但它幾乎不可能注意到值顯示後，它正在改變。