zeppelin git commit: [HOTFOX][Branch-0.7] Fix multi dynamic select forms behaviour

[ah...@apache.org]

Repository: zeppelin
Updated Branches:
  refs/heads/branch-0.7 abd02502b -> 8f25137fd


[HOTFOX][Branch-0.7] Fix multi dynamic select forms behaviour

### What is this PR for?
This PR is same with #2154 with base branch `branch-0.7`.

Please refer to #2154's description for the details about what the problem is now.

### What type of PR is it?
Bug Fix & Hot Fix

### What is the Jira issue?
N/A

### How should this be tested?
1. Create multiple select forms
```
%md
My first selection is ${my selection1=1,1|2|3}
My second selection is ${my selection2=4,4|5|6}
```

2. Create different types of dynamic form (e.g. 1 select form + 1 checkbox)
```
%md

My selection is ${my selection=1,1|2|3}
My check list is ${checkbox:checkboxTest=list1|list2, list1|list2|list3|list4}

```

There should be `Run on selection change` menu under the paragraph control menu in the above cases. And the select form should appear!

### Screenshots (if appropriate)
 - When multiple select forms are created
![double-selectforms](https://cloud.githubusercontent.com/assets/10060731/24073573/af12ae2c-0c3c-11e7-80fa-18abe98f2dfd.gif)

 - When different dynamic forms are created (e.g. 1 checkbox + 1 select form)
![checkbox_selectform](https://cloud.githubusercontent.com/assets/10060731/24073578/bce7af52-0c3c-11e7-85df-c858342f7e2e.gif)

### Questions:
* Does the licenses files need update? no
* Is there breaking changes for older versions? no
* Does this needs documentation? no

Author: RyuAhyoung <ah...@MacBook-Pro-5.local>

Closes #2156 from AhyoungRyu/branch-0.7-fix/multiDynamicFormBehaviour and squashes the following commits:

ca3d82e [RyuAhyoung] Update docs since the option is applicable for the checkbox
850d4b5 [RyuAhyoung] Give 'runOnSelectionChange' option to 'Checkbox' as well
c7f8a09 [RyuAhyoung] [branch-0.7] Fix multi dynamicforms behaviour


Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/8f25137f
Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/8f25137f
Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/8f25137f

Branch: refs/heads/branch-0.7
Commit: 8f25137fd5bcf6e9bb40e2e39b98231f5567c5f7
Parents: abd0250
Author: RyuAhyoung <ah...@MacBook-Pro-5.local>
Authored: Sun Mar 19 08:30:06 2017 +0900
Committer: ahyoungryu <ah...@apache.org>
Committed: Sun Mar 19 20:39:25 2017 +0900

----------------------------------------------------------------------
 docs/manual/dynamicform.md                            | 12 ++++++++++--
 .../src/app/notebook/paragraph/paragraph-control.html |  3 +--
 .../paragraph/paragraph-parameterizedQueryForm.html   | 14 +++++++++++++-
 .../app/notebook/paragraph/paragraph.controller.js    | 12 +++++++-----
 4 files changed, 31 insertions(+), 10 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/8f25137f/docs/manual/dynamicform.md
----------------------------------------------------------------------
diff --git a/docs/manual/dynamicform.md b/docs/manual/dynamicform.md
index b3ef4ed..33ed97e 100644
--- a/docs/manual/dynamicform.md
+++ b/docs/manual/dynamicform.md
@@ -57,8 +57,9 @@ Also you can separate option's display name and value, using `${formName=default
 <img src="../assets/themes/zeppelin/img/screenshots/form_select_displayname.png" />
 
 The paragraph will be automatically run after you change your selection by default.
-But in case you have multiple select forms in one paragraph, you might want to run the paragraph after changing all the selections.
-You can control this by unchecking the below **Run on selection change** option in the setting menu. Even if you uncheck this option, still you can run it by pressing `Enter`.
+But in case you have multiple types dynamic form in one paragraph, you might want to run the paragraph after changing all the selections.
+You can control this by unchecking the below **Run on selection change** option in the setting menu.
+Even if you uncheck this option, still you can run it by pressing `Enter`.
 
 <img src="../assets/themes/zeppelin/img/screenshots/selectForm-checkbox.png" />
 
@@ -72,6 +73,13 @@ Besides, you can specify the delimiter using `${checkbox(delimiter):formName=...
 
 <img src="../assets/themes/zeppelin/img/screenshots/form_checkbox_delimiter.png">
 
+Like [select form](#select-form), the paragraph will be automatically run after you change your selection by default.
+But in case you have multiple types of dynamic form in one paragraph, you might want to run the paragraph after changing all the selections.
+You can control this by unchecking the below **Run on selection change** option in the setting menu.
+Even if you uncheck this option, still you can run it by pressing `Enter`.
+
+<img src="../assets/themes/zeppelin/img/screenshots/selectForm-checkbox.png" />
+
 ## Creates Programmatically
 
 Some language backend uses programmatic way to create form. For example [ZeppelinContext](../interpreter/spark.html#zeppelincontext) provides form creation API

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/8f25137f/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html b/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
index 9833f48..d1d7359 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph-control.html
@@ -56,8 +56,7 @@ limitations under the License.
         </li>
         <li role="separator" class="divider"></li>
         <li style="padding-top:8px"
-            ng-if="paragraph.settings.forms[$root.keys(paragraph.settings.forms)].options &&
-                   paragraph.settings.forms[$root.keys(paragraph.settings.forms)].type != 'checkbox'">
+            ng-if="paragraph.config.runOnSelectionChange == true || paragraph.config.runOnSelectionChange == false">
           <span ng-if="paragraph.config.runOnSelectionChange == true" class="fa fa-toggle-on shortcut-icon" style="padding:3px 8px 8px 20px"></span>
           <span ng-if="paragraph.config.runOnSelectionChange == false" class="fa fa-toggle-off shortcut-icon" style="padding:3px 8px 8px 20px"></span>Run on selection change
           <form style="display:inline; float:right">

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/8f25137f/zeppelin-web/src/app/notebook/paragraph/paragraph-parameterizedQueryForm.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph-parameterizedQueryForm.html b/zeppelin-web/src/app/notebook/paragraph/paragraph-parameterizedQueryForm.html
index 7ead979..2d0d170 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph-parameterizedQueryForm.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph-parameterizedQueryForm.html
@@ -46,12 +46,24 @@ limitations under the License.
               ng-options="option.value as (option.displayName||option.value) for option in paragraph.settings.forms[formulaire.name].options">
       </select>
     </div>
-    <div ng-if="paragraph.settings.forms[formulaire.name].type == 'checkbox'">
+    <div ng-if="paragraph.config.runOnSelectionChange == true &&
+         paragraph.settings.forms[formulaire.name].type == 'checkbox'">
       <label ng-repeat="option in paragraph.settings.forms[formulaire.name].options"
              class="checkbox-item input-sm">
         <input type="checkbox"
                ng-class="{'disable': paragraph.status == 'RUNNING' || paragraph.status == 'PENDING' }"
                ng-checked="paragraph.settings.params[formulaire.name].indexOf(option.value) > -1"
+               ng-click="toggleCheckbox(formulaire, option, false); runParagraph(getEditorValue())"/> {{option.displayName||option.value}}
+      </label>
+    </div>
+    <div ng-if="paragraph.config.runOnSelectionChange == false &&
+         paragraph.settings.forms[formulaire.name].type == 'checkbox'">
+      <label ng-repeat="option in paragraph.settings.forms[formulaire.name].options"
+             class="checkbox-item input-sm">
+        <input type="checkbox"
+               ng-class="{'disable': paragraph.status == 'RUNNING' || paragraph.status == 'PENDING' }"
+               ng-checked="paragraph.settings.params[formulaire.name].indexOf(option.value) > -1"
+               ng-enter="runParagraph(getEditorValue())"
                ng-click="toggleCheckbox(formulaire, option, false)"/> {{option.displayName||option.value}}
       </label>
     </div>

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/8f25137f/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
index b039a47..c40a56d 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
@@ -133,11 +133,13 @@ function ParagraphCtrl($scope, $rootScope, $route, $window, $routeParams, $locat
     if (config.enabled === undefined) {
       config.enabled = true;
     }
-
-    if (forms[Object.keys(forms)]) {
-      if (forms[Object.keys(forms)].options && forms[Object.keys(forms)].type !== 'checkbox') {
-        if (config.runOnSelectionChange === undefined) {
-          config.runOnSelectionChange = true;
+  
+    for (var idx in forms) {
+      if (forms[idx]) {
+        if (forms[idx].options) {
+          if (config.runOnSelectionChange === undefined) {
+            config.runOnSelectionChange = true;
+          }
         }
       }
     }