richardfan1126/yii2-js-register

Yii2 widget to register JS into view

Maintainers

👁 richardfan1126

Package info

github.com/richardfan1126/yii2-js-register

Wiki

Type:yii2-extension

pkg:composer/richardfan1126/yii2-js-register

Statistics

Installs: 59 300

Dependents: 8

Suggesters: 0

Stars: 13

Open Issues: 0

v0.0.1 2016-06-29 17:28 UTC

Requires

Requires (Dev)

None

Suggests

None

Provides

None

Conflicts

None

Replaces

None

MIT e6a49b1523942c0a861bfa9f5cf7371e3bfd94f9

javascriptextensionwidgetyii2

This package is auto-updated.

Last update: 2026-06-26 03:03:27 UTC


README

👁 Latest Stable Version
👁 Total Downloads
👁 GitHub stars
👁 GitHub issues

Yii2 widget to register JS into view

Why do I need this?

How to register JS script into view in Yii2?

In Yii2, the way to register JS script into view is using \yii\web\View::registerJS(),

For example, if you want to initialize a jQuery plugin, you do:

// in view file

<div class="modal fade" tabindex="-1" role="dialog">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-body">
 <p>Hello World!</p>
 </div>
 </div>
 </div>
</div>

<?php
$this->registerJS('$(".modal").modal({backdrop:"static",keyboard:"false"})');
?>

Obviously, this is a very bad way because:

  1. Hard to read for human
  2. Hard to read for you editor (Means no syntax coloring for the JS code)
  3. You have to handle the single / double quote

This widget help you register JS script in Yii just as you write script block directly into HTML!

Getting Started

Installing

Install with Composer:

composer require richardfan1126/yii2-js-register "*"

or

php composer.phar require richardfan1126/yii2-js-register "*"

or add

"richardfan1126/yii2-js-register":"*"

to the require section of your composer.json file.

How to use

In your view file, wrap your JS script with <script> tag, and wrap all the things with this widget.

example:

// in view file

use richardfan\widget\JSRegister;

<div class="modal fade" tabindex="-1" role="dialog">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-body">
 <p>Hello World!</p>
 </div>
 </div>
 </div>
</div>

<?php JSRegister::begin(); ?>
<script>
 $(".modal").modal({
 backdrop:"static",
 keyboard:"false"
 });
</script>
<?php JSRegister::end(); ?>

IMPORTANT Remember not to add anything out of the <script> block.

Configurations

There are 2 configurations for this widget, which are the parameters passed into \yii\web\View::registerJS() method. example:

<?php JSRegister::begin([
 'key' => 'bootstrap-modal',
 'position' => \yii\web\View::POS_READY
]); ?>
<script>
 // JS script
</script>
<?php JSRegister::end(); ?>
  • key (optional)The key that identifies the JS code block. If null, it will use $js as the key. If two JS code blocks are registered with the same key, the latter will overwrite the former. Default to null
  • position (optional) The position at which the JS script tag should be inserted in a page. Default to \yii\web\View::POS_READY