2013-10-05 215 views
0

實施引導,tokenfield(jQuery的小部件),我認爲這更多的是jQuery的整合問題,但這裏是我的問題/錯誤。我試圖總結了自舉-tokenfield] [1]作爲聚合物元素,但得到以下錯誤/跟蹤:聚合物

Error: An attempt was made to reference a Node in a context where it does not exist. 
    at GeneratedWrapper.mixin.insertBefore (http://localhost:3005/ShadowDOM/src/wrappers/Node.js:266:30) 
    at Object.<anonymous> (http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js:6067:21) 
    at jQuery.fn.extend.domManip (http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js:6262:15) 
    at jQuery.fn.extend.before (http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js:6065:15) 
    at Tokenfield.createToken (http://localhost:3005/elements/ui-widgets/bootstrap-tokenfield/bootstrap-tokenfield.js:175:21) 

代碼:

<polymer-element name="my-bootstrap-tokenfield"> 
    <template> 
    <link rel="stylesheet" href="bootstrap-tokenfield.css"> 
    <input type="text" class="form-control" id="tokenfield" value="red,green,blue" /> 
    </template> 
    <script src="bootstrap-tokenfield.js"></script> 
    <script> 
    Polymer('my-bootstrap-tokenfield', { 
     applyAuthorStyles : true, 
     ready : function() { 
     // default example 
     $(this.$.tokenfield).tokenfield({ 
      typeahead: { 
       name: 'tags', 
       local: ['red','blue','green','yellow','violet','brown','purple','black','white'], 
      }, 
      allowDuplicates: true 
     }); 
     } 
    }) 
    </script> 
</polymer-element> 

想法,建議?

+1

我不確定''會起作用。你有沒有嘗試將它移到聚合物元素之外?在Polymer中使用Bootstrap的JS小部件有已知的問題。這主要是因爲它不瞭解Shadow DOM。看起來是你的錯誤。 – ebidel

+1

BTW,計算器的慣例是解決你的問題張貼作爲一個答案,這樣的問題看起來回答,而當它可以幫助他們等 –

+0

感謝擡起頭,其他人可以給予好評它 – jrmerz

回答

1

由於ebidel幫助我來修復。將輸入包裹在'div'標籤中,一切正常。作爲標記字段是構建小部件的「輸入」父項的意義。

<template> 
    <link rel="stylesheet" href="bootstrap-tokenfield.css"> 
    <div> 
     <input type="text" class="form-control" id="tokenfield" value="red,green,blue" /> 
    </div> 
</template>