AlloyUI 포함 방법

Question

내 Liferay 포틀릿에 AlloyUI를 포함하여 몇 가지 문제가 있습니다. 이 article에 따라 , 나는 다음과 JSP로 생성 한 :

<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %> 

<input type="text" id="some-input" /> 
<span id="counter"></span> character(s) remaining 

<aui:script> 
YUI().use(
    'aui-char-counter', 
    function(Y) { 
    new Y.CharCounter(
     { 
     counter: '#counter', 
     input: '#some-input', 
     maxLength: 10 
     } 
    ); 
    } 
); 
</aui:script> 

을하지만 렌더링 된 페이지는 다음과 같습니다

나는 태그 라이브러리가 제대로 web.xml에 정의되어 있음을 확인했다 :

<taglib> 
    <taglib-uri>http://liferay.com/tld/aui</taglib-uri> 
    <taglib-location>/WEB-INF/tld/aui.tld</taglib-location> 
</taglib> 

다음과 같이 jsp에 포함 시키면 AUI가 작동합니다. :

<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script> 
<link href="http://cdn.alloyui.com/2.0.0/aui/aui-min.js" rel="stylesheet"></link> 


<input type="text" id="some-input" /> 
<span id="counter"></span> character(s) remaining 

<script> 
YUI().use(
    'aui-char-counter', 
    function(Y) { 
    new Y.CharCounter(
     { 
     counter: '#counter', 
     input: '#some-input', 
     maxLength: 10 
     } 
    ); 
    } 
); 
</script> 

내가하는 Liferay 6.1.20 EE GA2을 사용하고이

Answer 1

을 Liferay 야후 UI의 상단에 개발 라이브러리 (도 AUI라고도 함) alloy-ui 사용 (또한 yui로 함) 도서관. 이러한 라이브러리 모두

인스턴스 조건은 합금 및 다른 UI위한 YUI위한 AUI 즉 다르다.

코드에서이 용어를 바꾸면 YUI 대신 AUI 인 문제가 해결됩니다.

Answer 2

시드 파일 선언은이 char 카운터 코드에 대해 AlloyUI에 액세스하는 데 필요한 모든 것입니다.

<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script> 

web.xml에 taglib 참조가 필요하지 않습니다. 실제로 시드 파일에 대한 액세스를 금지합니다. 참조하는 taglib가 예상되는 AlloyUI의 버전과 일치하지 않을 수 있습니다.

또한 YUI의 CharCounter에 액세스하는 것이 좋습니다. http://alloyui.com/api/classes/A.CharCounter.html의 API 예를 참조하십시오.