내 테마에서 내장 jQuery UI 사용

25

내 테마의 모든 페이지는 jquery UI를 사용해야합니다. Drupal 7에 포함되어 있다는 것을 알고 있지만 Drupal의 기술 문서를 실제로 해독 할 수는 없습니다. 그것을하는 유일한 방법은 template.php 파일을 사용하는 것 같습니다. 그러나 나는 그 파일을 이해하지 못하기 때문에 그렇게하는 것을 피하려고 노력하고 있습니다.

다른 방법이 있습니까, 아니면 template.php 파일을 사용해보십시오?

7  theming  javascript 
— 벤
소스
무엇을하려고합니까? 모든 jquery UI 기능과 사용할 수없는 기능 모든 페이지에서 사용자 정의 JS 코드를 실행 하시겠습니까? 특정 페이지에서 실행 하시겠습니까? 특정 이벤트? JS 실행 갈 수있는 많은 방법, 즉 drupal_add_js있다
— LSU_JBob
내 테마의 모든 단일 페이지에 나타나는 일부 필드에서 .datepicker ()를 사용하려고합니다. 아마 나중에 더 많은 것들.
— Ben
@Ben 답변으로 문제가 해결되면 현상금을 수여해야합니다.
— googletorp
@googletorp 죄송합니다. 첫 번째 현상금입니다. 현상금이 수여되었습니다.
— Ben
drupal_add_library ( 'system', 'ui.button') 또는 무엇이든 포함하면 실제로 테마를 호출하는 테마에 한두 줄의 자바 스크립트를 추가해야한다는 많은 답변이 마지막 단계를 생략 한 것 같습니다. 플러그인.
— Ryan Price

답변:

36

PHP를 사용해야 할지라도 페이지에 JS를 추가하는 것은 그리 어렵지 않습니다.

일반적인 JS 파일의 경우 다음과 같이 할 수 있습니다

drupal_add_js($path_to_js)

그러나 Drupal은 jQuery UI를 라이브러리에 등록하여 특정 jQuery UI 플러그인에 대해 JS 및 CSS 파일을 모두 쉽게 추가 할 수 있습니다. 이것은 다음을 사용하여 수행 할 수 있습니다

drupal_add_library($module, $library);

모든 jQuery UI 플러그인은 시스템 모듈에 존재하므로 할 수 있습니다

drupal_add_library('system', 'ui');

또는

drupal_add_library('system', 'ui.accordion');

이러한 플러그인 중 일부는 다른 플러그인을 사용하기 때문에 종속성이 있습니다. Drupal은 이것을 매우 영리하게 처리하고 필요한 구성 요소를 포함합니다.

여기 에서 jQuery 플러그인의 전체 목록을 볼 수 있습니다 . 이것은 PHP 배열 형식이지만 일반적으로 명명 규칙은 ui.PLUGIN-NAME입니다.

모든 페이지에 JS를 추가해야하는 경우 사전 프로세스 페이지 후크를 추가하고 여기에 추가 할 수 있습니다. 이것은 template.php 파일에서 다음과 같이 보일 것입니다.

function NAME_OF_THEME_preprocess_page(&$variables) {
  drupal_add_library('system', 'ui');
  drupal_add_library('system', 'ui.accordion');
  drupal_add_library('system', 'effects.highlight');
}
— 구글 토프
소스
여기에있는 것을 정확하게 추가하려고했지만 (NAME_OF_THEME 대신 내 테마 이름 사용) template.php에 작동하지 않았습니다. 어떤 아이디어? 이것이 내가 가진 것입니다 : function nocturnal_preprocess_page(&$variables) { drupal_add_library('system', 'ui'); drupal_add_library('system', 'ui.datepicker'); }
— Ben
@ben 새로운 후크 또는 전처리 기능을 추가 할 때마다 캐시를 ​​비워야합니다. 캐시를 지우십시오. 자체적으로 아무것도하지 않는 JS 파일 만 추가하기 때문에 작동하는지 테스트하는 방법이 필요합니다.
— googletorp
캐시를 지우고 이전에 수동으로 참조 된 jquery UI를 사용했던 일부 날짜 필드에서 작동해야합니다. 여전히 디버깅 중이지만 지금까지 잘못된 것을 찾을 수 없습니다.
— 벤
@Ben 첫 번째 단계는 소스를보고 파일이 포함되어 있는지 확인하는 것입니다 (설정된 경우 JS 집계 사용 안함)
— googletorp
3
@googletorp : 당신은 차이 betweeen에 조금 정교한 수 drupal_add_library('system', 'ui');와 drupal_add_library('system', 'ui.accordion');? 첫 번째 것이 모든 것을 가져 오는가 아니면 핵심을 가져 오는가? 내가 사용하는 모든 플러그인마다 줄이 필요합니까?
— Jarl
4

date_popup 모듈 을 사용해 보셨습니까 ? 양식 API와 잘 작동

— LSU_JBob
소스
모듈이 필요한 양식은 매우 복잡하고 사용자 지정 코딩이 필요하기 때문에 모듈을 원하지 않습니다. 테마의 템플릿에 하드 코딩되어 있습니다. Drupal과 함께 제공되는 jquery UI를 사용하는 가장 좋은 방법을 찾으려고합니다. 내가 그것을 작동시킬 수있는 유일한 방법은 그것을 테마의 폴더에 넣고 거기에 연결하는 것입니다. 그러나 하나의 Drupal 설치에서 여러 사이트를 실행하고 있으며 이러한 모든 사이트에는 jQuery UI가 필요하므로 내장 jQuery UI를 사용하여 중복 작업을 방지하고 싶었습니다.
— Ben
모든 사이트에서 jquery UI를 호출하고 추가 할 수 있어야합니다. 드루팔 코어에 있습니다. 양식이 Form API로 작성 되었습니까?
— LSU_JBob
2
양식이 템플릿 파일에 내장 된 이유는 무엇입니까? 양식 API를 사용하지 않으면 SQL 주입 공격의 내장 보안과 같은 몇 가지 이점을 놓칠 수 있습니다. 템플릿 파일에서 양식을 제거하고 Form API를 사용하여 양식을 작성하는 사용자 정의 모듈을 작성하는 것이 좋습니다. 카우보이가되지 마십시오. 어쨌든 drupal_add_js ( '/ misc / ui / jquery.ui.core.min.js', 'file')와 같은 drupal_add_js를 사용하여 어디서나 자바 스크립트를 참조 할 수 있습니다. AND drupal_add_js ( '/ misc / ui / jquery.ui.datepicker.js', 'file');
— LSU_JBob
3
Form API를 사용하여 사용자 정의 모듈에서 양식을 작성한 다음 tpl 파일에서 render (drupal_get_form ( 'form_id')); 나는 아마도 사용자 정의 자바 스크립트로 양식 API를 사용하여 복잡한 요구 사항을 처리 할 수 ​​있다고 약속합니다. 이 모든 기능을 tpl 파일로 작성하여 자신을 힘들게 만드는 것 같습니다. 이는 기술적으로 테마 계층이므로 기능적인 백엔드 코드를 대량으로 사용하는 것이 가장 좋은 방법은 아닙니다.
— LSU_JBob
3
그가 모듈 만들기 라고 말하고 있다고 생각 합니다. 양식과 같은 기능적인 것은 모듈에 속합니다. Form API를 사용하면 사용자 정의 모듈에서 상상할 수있는 모든 종류의 양식을 작성할 수 있습니다. 대부분의 경우 테마는 기능과 무관해야합니다. 이를 통해 더 많은 유연성을 얻을 수 있습니다.
— Jonathan Rowny
4
  1. .tpl 파일의 하드 코딩 된 양식을 Form API 구현으로 리팩토링하십시오. @LSU_JBob이 말했듯이 FAPI를 사용하지 않고 양식을 작성해야하는 이유는 없습니다. Form API 빠른 시작 안내서 를 읽고 Form API 참조 페이지를 책갈피로 지정 하십시오.
  2. 양식을 작성하고 값을 제출하고 처리하는 등의 작업을 수행 한 후 Date contrib 모듈 에서 코드를 다운로드하여 읽으십시오 . 날짜는 생성하려는 날짜 팝업 종류를 제공하는 데 사용되지만 D6의 CCK 및 D7의 코어 필드에 사용됩니다. 필드 작업을 원하지는 않지만 Date 모듈은 JQuery UI를 사용하여 수행하려는 작업을 수행합니다. 이 모듈은 확실한 예를 제공해야합니다.
— 아마추어 바리 스타
소스
감사. 이러한 링크가 도움이됩니다. 나는 PHP에 들어가고 싶지 않지만이 경우에 내가하고 싶은 일을 정확하게 수행해야한다고 생각합니다. 현재 Drupal PHP를 배울 시간이 없기 때문에 시간을 절약하기 위해 tpl 파일에 보관할 것입니다. 그래도 모두의 좋은 조언.
— 벤
3

googletorp답변 해 주셔서 감사 합니다.

UI 플러그인 사용 과 관련하여 여전히 명확하지 않은 경우 추가하십시오 .

언급 할 때 : drupal_add_library('system', 'ui');
이것은 모든 UI 플러그인을 자동으로 활성화하지는 않습니다.

drupal 7에서 사용 가능한 jquery ui 플러그인 목록을 찾을 수 있습니다. /misc/ui/

perticular 플러그인 (예 : :)을 사용하려면 jquery.ui.slider.min.js다음 행을 추가해야합니다.

drupal_add_library('system', 'ui.slider');

이것이 유용하기를 바랍니다.

— 수모 아난드
소스
2

최근 에이 문제가 발생했습니다. 누군가 나에게 JQuery UI가 모든 페이지에로드되도록 맞춤형 모듈을주었습니다. 간단하게 다시 만들 수 있습니다. 먼저 jquery_update를 설치 하고 작동하는지 확인하십시오. 그런 다음이 모듈을 작성하고 사용하십시오.

'jquery_force'라는 경로 / to / modules에 폴더를 만듭니다.

내부에 두 개의 파일을 추가하십시오.

jquery_force.info :

name = JQuery UI Force
description = Forces JQuery UI to always load
dependencies[] = jquery_update
package = User Interface
core = 7.x
files[] = jquery_force.module

jquery_force.module :

<?php
/**
 * @file jquery_force.module
 * TODO: Enter file description here.
 */

/**
 * Implements hook_init().
 */
function jquery_force_init() {
    drupal_add_library('system', 'ui');
}
— mtro
소스
2

template.php파일에 전처리 후크를 추가해도 효과가 없었습니다.

단순히 넣어 drupal_add_library('system', 'ui');에 template.php자체 파일 작동합니다.

— 사용자 17418
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.