Multi Line Text Field - Adjust height and add scrollbar

[IvanS]

Hello, I would like to adjust the height of the input text box for a multi line text field and add a scroll bar so that the box won't take up the whole space when requesting items. My form is a catalog item and so far I have tried accessing the multi line variable text area with name "justification" by using g_form.getControl();, document.getElementById(), document.selectQueryAll(); and it didn't let me change the style. It either gives a flat out javascript console error when I try loading my form or says that the style.property (like style.height) doesn't exist. I have been trying to use my variable name as well as looking for the HTML ID of the variable in the form, it seems our forms have system-defined IDs and I can't really single out that input text box area. 

[Murthy Ch]

Hey @IvanS 

It's not recommended to control the OOB variable. Instead, I would recommend you to create custom widget to achieve your requirement.

Basically what I'm doing in the below widget is copying the information into the multi-line text variable.

So, you can save the space into your catalog.

NOTE: Widgets will not shown in the native UI that's why we are copying the information into the OOB variable.

HTML:

<div>
<!-- your widget template -->
  <label for="multiline">Justification</label><br>
  <textarea id="multiline" name="multiline" rows="3" cols="120" ng-model="multiLineTextValue" ng-blur="fieldChanged()"></textarea><br>
</div>

CSS:

#multiline {
  resize: none;
  border-radius: 5px;
}

Client script:

function($scope){
	//var field = $scope.page.field; //gives the access to all the field names and the values
	var g_form = $scope.page.g_form; // gives the access to the page
	$scope.fieldChanged = function(){;
		g_form.setValue("multi_line_text_oob", $scope.multiLineTextValue);
	}
}

You can hide the OOB multi line text variable in the portal view by just creating a simple UI-policy
Please let me know if you stuck anywhere. Happy to help:)

[Murthy Ch]

@IvanS 

Any luck on this?