Fixed #109 and #107

Author: unclead

CHANGELOG.md

@@ -1,6 +1,12 @@
 Yii2 multiple input change log
 ==============================
 
+2.3.0
+=====
+
+- #107: render a hidden input when `MultipleInput` is used for active field
+- #109: respect ID when using a widget's placeholder
+
 2.2.0
 =====
 

README.md

@@ -8,7 +8,7 @@ Yii2 widget for handle multiple inputs for an attribute of model and tabular inp
 [![License](https://poser.pugx.org/unclead/yii2-multiple-input/license)](https://packagist.org/packages/unclead/yii2-multiple-input)
 
 ##Latest release
-The latest stable version of the extension is v2.2.0 Follow the [instruction](./UPGRADE.md) for upgrading from previous versions
+The latest stable version of the extension is v2.3.0 Follow the [instruction](./UPGRADE.md) for upgrading from previous versions
 
 ##Installation
 The preferred way to install this extension is through [composer](http://getcomposer.org/download/).

composer.json

@@ -9,7 +9,7 @@
         "yii2 tabular input"
     ],
     "type": "yii2-extension",
-    "version": "2.2.0",
+    "version": "2.3.0",
     "license": "BSD-3-Clause",
     "support": {
         "issues": "https://github.com/unclead/yii2-multiple-input/issues?state=open",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jquery.multipleInput",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "jQuery multipleInput",
   "scripts": {
 	  "build": "npm install && (gulp || node node_modules/gulp/bin/gulp.js)"

src/MultipleInput.php

@@ -12,6 +12,7 @@
 use yii\base\InvalidConfigException;
 use yii\base\Model;
 use yii\helpers\ArrayHelper;
+use yii\helpers\Html;
 use yii\widgets\ActiveForm;
 use yii\widgets\InputWidget;
 use yii\db\ActiveRecordInterface;
@@ -188,7 +189,15 @@ protected function guessColumns()
      */
     public function run()
     {
-        return $this->createRenderer()->render();
+        $content = '';
+        if ($this->hasModel()) {
+            $content .= Html::hiddenInput(Html::getInputName($this->model, $this->attribute), null, [
+                'id' => Html::getInputId($this->model, $this->attribute)
+            ]);
+        }
+        $content .= $this->createRenderer()->render();
+
+        return $content;
     }
 
     /**
@@ -197,7 +206,7 @@ public function run()
     private function createRenderer()
     {
         $config = [
-            'id'                => $this->options['id'],
+            'id'                => $this->getId(),
             'columns'           => $this->columns,
             'min'               => $this->min,
             'max'               => $this->max,

src/TabularInput.php

@@ -147,7 +147,7 @@ public function run()
     private function createRenderer()
     {
         $config = [
-            'id'                => $this->options['id'],
+            'id'                => $this->getId(),
             'columns'           => $this->columns,
             'min'               => $this->min,
             'max'               => $this->max,

src/assets/src/js/jquery.multipleInput.js

@@ -48,16 +48,37 @@
     };
 
     var defaultOptions = {
+        /**
+         * the ID of widget
+         */
         id: null,
-        // the template of row
+        /**
+         * the ID of related input in case of using widget for an active field
+         */
+        inputId: null,
+        /**
+         * the template of row
+         */
         template: null,
-        // string that collect js templates of widgets which uses in the columns
+        /**
+         * string that collect js templates of widgets which uses in the columns
+         */
         jsTemplates: [],
-        // how many row has to renders
+        /**
+         * how many row are allowed to render
+         */
         max: 1,
-        // minimum number of rows
+        /**
+         * a minimum number of rows
+         */
         min: 1,
+        /**
+         * active form options of attributes
+         */
         attributes: {},
+        /**
+         * default prefix of a widget's placeholder
+         */
         indexPlaceholder: 'multiple_index'
     };
 
@@ -73,7 +94,7 @@
             var settings = $.extend(true, {}, defaultOptions, options || {}),
                 $wrapper = $('#' + settings.id),
                 form = $wrapper.closest('form'),
-                id = this.selector.replace('#', '');
+                inputId = settings.inputId;
 
             $wrapper.data('multipleInput', {
                 settings: settings,
@@ -96,7 +117,7 @@
 
             var intervalID = setInterval(function () {
                 if (typeof form.data('yiiActiveForm') === 'object') {
-                    var attribute = form.yiiActiveForm('find', id),
+                    var attribute = form.yiiActiveForm('find', inputId),
                         defaultAttributeOptions = {
                             enableAjaxValidation: false,
                             validateOnBlur: false,
@@ -113,7 +134,7 @@
                             }
                         });
 
-                        form.yiiActiveForm('remove', id);
+                        form.yiiActiveForm('remove', inputId);
                     }
 
                     // append default options to option from settings

src/assets/src/js/jquery.multipleInput.min.js

@@ -289,6 +289,7 @@ protected function registerAssets()
 
         $options = Json::encode([
             'id'                => $this->id,
+            'inputId'           => $this->context->options['id'],
             'template'          => $template,
             'jsTemplates'       => $jsTemplates,
             'max'               => $this->max,

src/renderers/BaseRenderer.php

@@ -39,7 +39,7 @@ protected function internalRender()
 
         $content = Html::tag('table', implode("\n", $content), $options);
 
-        return Html::tag( 'div', $content, [
+        return Html::tag('div', $content, [
             'id' => $this->id,
             'class' => 'multiple-input'
         ]);