2013-10-05 4 views
0

Я думаю, что это больше проблема интеграции с jquery, но вот моя проблема/ошибка. Я пытаюсь обернуть [самозагрузку-tokenfield] [1] в качестве элемента полимера, но получает следующее сообщение об ошибке/следе:Реализация bootstrap-tokenfield (jquery widget) в полимере

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

Я не уверен, что '' будет работать. Вы пытались переместить его за пределы полимерного элемента? Известны проблемы с использованием виджета Bootstrap JS внутри Polymer. Это в основном потому, что он не понимает Shadow DOM. Похоже, что это ваш случай из этой ошибки. – ebidel

+1

BTW, соглашение stackoverflow заключается в том, чтобы отправить решение на ваш вопрос в качестве ответа, таким образом ответ на вопрос будет рассмотрен, а другие смогут его перенести, когда он поможет им и т. Д. –

+0

спасибо за головы – jrmerz

ответ

1

Благодаря ebidel помогает мне прийти к исправить. Оберните вход в тег 'div', и все хорошо. Имеет смысл в качестве токен-поля родительский элемент «input» для создания виджета.

<template> 
    <link rel="stylesheet" href="bootstrap-tokenfield.css"> 
    <div> 
     <input type="text" class="form-control" id="tokenfield" value="red,green,blue" /> 
    </div> 
</template> 
Смежные вопросы