Add Disabled to New-UDInputField (#1426)

* Fix label overlap issue when value is provided #1330 * Placeholder should be active label and not overlap #921 * Revert "Placeholder should be active label and not overlap" This reverts commit 938fd37. * UpdateTabIndicator so we dont get a scroll Models have issues trying to figure out how wide they are so we need to tell materialize to update the tabIndicator so we dont get a scroll bar. #1221 * Add test for disabled textbox #1380 * Disabled InputField Adding Disabled to new-inputfield #1380 * Remove false * Update NewInputFieldCommand.cs Co-authored-by: Adam Driscoll <[email protected]>
ironmansoftware · Jan 7, 2020 · da23492 · da23492
1 parent 95a88de
commit da23492
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 5 deletions.
diff --git a/src/UniversalDashboard.Materialize/Components/ud-input-field.jsx b/src/UniversalDashboard.Materialize/Components/ud-input-field.jsx
@@ -75,6 +75,7 @@ export default class UdInputField extends React.Component {
             name: this.props.name,
             type: this.props.type,
             value: this.props.value,
+            disabled: this.props.disabled,
             placeholder: this.props.placeholder,
             validOptions: this.props.validOptions,
             validating: this.props.validating,
@@ -121,6 +122,7 @@ export default class UdInputField extends React.Component {
                 id={field.name} name={field.name} 
                 onChange={e => this.onTextFieldChange(field, e) } 
                 value={field.value} 
+                disabled={field.disabled}
                 onBlur={e => this.onValidateField(field, e)} 
                 onKeyDown={this.onKeyDown.bind(this)}  
                 label={field.placeholder ? field.placeholder[0] : field.name}
@@ -134,6 +136,7 @@ export default class UdInputField extends React.Component {
                 name={field.name}
                 onChange={e => this.onTextFieldChange(field, e) } 
                 value={field.value}  
+                disabled={field.disabled}
                 label={field.placeholder ? field.placeholder[0] : field.name}
             />
         }
@@ -145,7 +148,7 @@ export default class UdInputField extends React.Component {
                 value = String(field.value).toLowerCase() === "true";
             }
 
-            return <Checkbox id={field.name} name={field.name} onChange={e => this.onCheckboxChanged(field, e) } checked={value} label={field.placeholder ? field.placeholder[0] : field.name} />
+            return <Checkbox id={field.name} name={field.name} disabled={field.disabled} onChange={e => this.onCheckboxChanged(field, e) } checked={value} label={field.placeholder ? field.placeholder[0] : field.name} />
         }
 
         if (field.type === 'date') {
@@ -165,6 +168,7 @@ export default class UdInputField extends React.Component {
                     className="ud-input">{field.placeholder ? field.placeholder[0] : field.name}</label>,
                 <DatePicker  
                     className="ud-input"
+                    disabled={field.disabled}
                     options={options} onChange={function(e) {  
                         const moment = require('moment');
                         let m = moment(e);
@@ -186,11 +190,11 @@ export default class UdInputField extends React.Component {
 
             return [
                 <label id={field.name + 'label'} htmlFor={field.name} style={{color: this.props.fontColor}}>{field.placeholder ? field.placeholder[0] : field.name}</label>,
-                <TimePicker id={field.name} options={options} onChange={function(e) {   
+                <TimePicker id={field.name} options={options} disabled={field.disabled} onChange={function(e) {   
                     var val = this.get('select');
                     comp.onTextFieldChange({name: comp.props.name},  {target: {value: val}});
                 }} />
-            ]
+            ] 
         }
 
         if (field.type == 'switch') {
@@ -207,7 +211,7 @@ export default class UdInputField extends React.Component {
                 value = String(field.value).toLowerCase() === "true";
             }
 
-            return <Switch id={field.name} name={field.name} onChange={e => this.onCheckboxChanged(field, e) } checked={value} offLabel={off} onLabel={on} />
+            return <Switch id={field.name} name={field.name} disabled={field.disabled} onChange={e => this.onCheckboxChanged(field, e) } checked={value} offLabel={off} onLabel={on} />
         }
 
         if (field.type == 'select') {
@@ -218,7 +222,7 @@ export default class UdInputField extends React.Component {
                 });
             }
 
-            return <Select label={field.placeholder ? field.placeholder[0] : field.name} onChange={e => this.onSelectChanged(field, e) } value={field.value}>
+            return <Select label={field.placeholder ? field.placeholder[0] : field.name} disabled={field.disabled} onChange={e => this.onSelectChanged(field, e) } value={field.value}>
                 {options}
             </Select>
         }

diff --git a/src/UniversalDashboard.Materialize/Tests/textbox.tests.ps1 b/src/UniversalDashboard.Materialize/Tests/textbox.tests.ps1
@@ -1,5 +1,37 @@
 Describe "Textbox" {
 
+    Context "textbox disabled UDInput" {
+        Set-TestDashboard -Content {
+        New-UDInput -Title "Simple Form" -Id "Form" -Content {
+            New-UDInputField -Name 'checkbox' -Type 'checkbox' -Disabled
+            New-UDInputField -Name 'textbox' -Type 'textbox' -Disabled
+            New-UDInputField -Name 'checkboxEnabled' -Type 'checkbox'
+            New-UDInputField -Name 'textboxEnabled' -Type 'textbox'
+        } -Endpoint {
+                param($checkbox, $textbox)
+
+                $Cache:Data = @{
+                    checkbox = $checkbox 
+                    textbox = $textbox
+                }
+            }
+        }     
+        It "should be disabled" {
+            $textbox = Find-SeElement -Name 'textbox' -Driver $Driver
+            $textbox.Enabled | should be $false
+        }
+    }
+
+    Context "textbox disabled" {
+        Set-TestDashboard -Content {
+            New-UDTextbox -Id 'EndTimestamp' -Label 'EndTimestamp' -Disabled   
+        }        
+        It "should be disabled" {
+            $textbox = Find-SeElement -Id 'EndTimestamp' -Driver $Driver
+            $textbox.Enabled | should be $false
+        }
+    }
+
     Context "textbox no value" {
         Set-TestDashboard -Content {
             New-UDTextbox -Id 'EndTimestamp' -Label 'EndTimestamp'   

diff --git a/src/UniversalDashboard/Cmdlets/Inputs/NewInputFieldCommand.cs b/src/UniversalDashboard/Cmdlets/Inputs/NewInputFieldCommand.cs
@@ -27,6 +27,9 @@ public class NewInputFieldCommand : PSCmdlet
         [Parameter()]
         public string[] Placeholder { get; set; }
 
+        [Parameter()]
+        public SwitchParameter Disabled { get; set; }
+
         [Parameter()]
         [ValidateSet("textbox", "checkbox", "select", "radioButtons", "password", "textarea", "switch", "date", "file", "time", "binaryFile")]
         public string Type { get; set; }
@@ -67,6 +70,7 @@ protected override void EndProcessing()
 				ValidOptions = Values,
 				Value = DefaultValue,
                 Placeholder = Placeholder,
+                Disabled = Disabled.IsPresent,
                 Type = Type,
                 OkText = OkText,
                 CancelText = CancelText,

diff --git a/src/UniversalDashboard/Models/Input.cs b/src/UniversalDashboard/Models/Input.cs
@@ -65,6 +65,8 @@ public class Field
 
 		[JsonProperty("value")]
 		public object Value { get; set; }
+		[JsonProperty("disabled")]
+		public object Disabled { get; set; }
 		[JsonProperty("links")]
 		public Hashtable[] Links { get;set;}
         [JsonProperty("okText")]