保存wpColorPicker值與敲除自定義綁定

我使用wpColorPicker和淘汰賽。我試圖讓顏色選擇器的值在我的可觀察值中更新，然後以JSON的形式存儲在數據庫中。我還有其他元素可以更新並完美保存，因此它確實與我的數據選取器的自定義綁定相關聯。保存wpColorPicker值與敲除自定義綁定

我看了看，並試圖this thread，但我無法弄清楚我做錯了什麼。

這是在我的PHP文件中的腳本的一部分：

<div class="caption"> 
    <div class="label"> 
     <b><?php _e('Caption', 'lavilla'); ?></b><br/> 
     <textarea class="slide-caption" data-bind="value: slideCaption"></textarea> 
     <br/> 
     <p class="text-color"><span class="label"><?php _e(' Text color', 'lavilla'); ?></span><input data-bind="wpColorPicker: textColor" /></p> 
    </div> 
</div>

而且這是我跟我的JS其中：

function Slide(textColor) { 
    var self = this; 
    this.textColor = ko.observable(textColor); 

    ko.bindingHandlers.wpColorPicker = { 
     init: function(element, valueAccessor, allBindingsAccessor) { 

      // set default value 
      var value = ko.utils.unwrapObservable(valueAccessor()); 
      $(element).val(value); 

      //initialize datepicker with some optional options 
      var options = allBindingsAccessor().wpColorPickerOptions || {}; 
      $(element).wpColorPicker(options); 


      //handle the field changing 
      ko.utils.registerEventHandler(element, "change", function() { 
       var observable = valueAccessor(); 
       observable($(element).val()); 
      }); 

      //handle disposal (if KO removes by the template binding) 
      ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
       $(element).wpColorPicker("destroy"); 
      }); 

     }, 
     update: function(element, valueAccessor, allBindingsAccessor) { 
      var value = ko.utils.unwrapObservable(valueAccessor()); 
      $(element).val(value); 
      $(element).change(); 
     } 
    }; 
};

來源

2015-07-20 Celine Manekis

究竟發生了什麼，錯誤情況是什麼？ – lessthanideal

我懷疑你會做的更好的寫作你bindinghandler從頭開始。在你使用的代碼中有很多不實用的代碼。您的綁定處理程序分配不應該是構造函數（幻燈片）的一部分，它應該只創建一次。僅通過包裹value結合開始：

ko.bindingHandlers.wpcolorpicker = { 
    init: function(element, valueAccessor, allBindingsAccessor, data, context) { 
    $(element).wpColorPicker(); 
    ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, data, context); 
    }, 
    update: function(element, valueAccessor, allBindingsAccessor, data, context) { 
    ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor, data, context); 
    } 
};

我沒有wpColorPicker一起玩，所以我不能給你一個完整的答案。我懷疑你需要使用change選項wpColorPicker在選擇新顏色時更新你的綁定變量。

來源

2015-07-20 20:17:28

謝謝羅伊J.我從頭開始做一次終於找到了如何寫：

ko.bindingHandlers.wpColorPicker = { 
    init: function(element, valueAccessor, allBindingsAccessor, data, context) { 
     var color = ko.unwrap(valueAccessor()); 
     $(element).val(color); 
     var options= { 
      change: function (event, ui) { 
       var value = valueAccessor(); 
       value(ui.color.toString()); 
      }, 
     }; 
     $(element).wpColorPicker(options); 
    } 
};

我使用wpColorPicker的功能變化。訣竅是，顏色值是十進制的，我必須通過它在十六進制淘汰賽。

來源

2015-07-21 13:12:19

保存wpColorPicker值與敲除自定義綁定

回答

相關問題