Jak poprawnie dodać i używać zewnętrznych skryptów js?
W ApsAssets dodałem:
public $js = [
'js/morris.js/morris.js',
];
W źródle strony skrypt jest dodany.
Tylko jak z niego teraz korystać?
Tagi <script> nie działają
Jak poprawnie dodać i używać zewnętrznych skryptów js?
W ApsAssets dodałem:
public $js = [
'js/morris.js/morris.js',
];
W źródle strony skrypt jest dodany.
Tylko jak z niego teraz korystać?
Tagi <script> nie działają
Dodanie elementu do tablicy ApsAssets to to samo co dodanie w widoku <script></script>.
Jeżeli nie działa to sprawdź w debuger toolbar i kodzie strony czy w ogóle jest to odwołanie gdzieś na stronie,
public $js = [
'js/morris/morris.js',
];
Jeżeli potrzebujesz tego wykresu nie na wszystkich podstronach a tylko na wybranych możesz dać w widoku.
$this->registerJsFile('@web/js/morris/morris.js', );
jeżeli jest a nie działa sprawdź zależności (depends), w tedy daje się po przecinku np ‘yii\web\YiiAsset’ ja jednak preferuje umiejscowienie pliku za pomocą liczby mówiącej czy plik ma być w header, content czy w footer przed plkami js czy po
$this->registerJsFile('@web/js/morris/morris.js', 3);
Dzięki za odpowiedź.
Nakierowało mnie to i udało się, że coś już tam jest kreślone.
Pozostała mi tylko jedna kwestia.
Jak korzystam z cdn:
$this->registerCssFile('//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css');
$this->registerJsFile('//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js', ['position' => \yii\web\View::POS_HEAD]);
$this->registerJsFile('//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js',['position' => \yii\web\View::POS_HEAD]);
$this->registerJsFile('//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js',['position' => \yii\web\View::POS_HEAD]);
To wszystko działa.
Źródło html:
<link href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css" rel="stylesheet">
<link href="/praca_inzynierska/web/assets/d7aa453f/css/bootstrap.css" rel="stylesheet">
<link href="/praca_inzynierska/web/css/site.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script></head>
Pobrałem js’y lokalnie i niestety już nie działa.
$this->registerCssFile('@web/js/morris.js/morris.css');
$this->registerJsFile('@web/js/morris.js/morris.js', ['position' => \yii\web\View::POS_HEAD]);
$this->registerJsFile('@web/js/raphael/raphael-min.js', ['position' => \yii\web\View::POS_HEAD]);
$this->registerJsFile('@web/js/jquery/jquery.min.js',['position' => \yii\web\View::POS_HEAD]);
Źródło html:
link href="/praca_inzynierska/web/js/morris.js/morris.css" rel="stylesheet">
<link href="/praca_inzynierska/web/assets/d7aa453f/css/bootstrap.css" rel="stylesheet">
<link href="/praca_inzynierska/web/css/site.css" rel="stylesheet">
<script src="/praca_inzynierska/web/js/morris.js/morris.js"></script>
<script src="/praca_inzynierska/web/js/raphael/raphael-min.js"></script>
<script src="/praca_inzynierska/web/js/jquery/jquery.min.js"></script></head>
Odwołania do plików dobre bo po kliknięciu otwierają się js’y.
Co tu jest nie tak, że pobrane lokalnie nie działają?
jquery jest najważniejsze i powinno być pierwsze, potem pliki bootstrap, potem reszta.
jQuery jest już w assets dodawane, chyba nie musisz tego dodawać w ogóle. Assets Yii2 ma wbudowaną logikę wykrywającą jQuery, jeżeli używasz registerJS albo registerJsFile a nie dasz miejsca to framework może wykryć że któryś plik js wymaga jQuery i ulokować linkowanie do niego pod linkowaniem do jQuery. Ale jak ręcznie dodałeś jeszcze Jquery to są możliwe anomalie.
Dziękuję bardzo za odpowiedź i pomoc.
Rzeczywiście problemem była zła kolejność skryptów.