Servoy 2020 Documentation
Child pages
  • Form Component

Versions Compared

Old Version 5

changes.mady.by.user Johan Compagner (wiki)

Saved on

compared with

New Version 6

changes.mady.by.user Johan Compagner (wiki)

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The form component gets from the system on its formcomponent property value a few extra properties that it can use to show the elements.:

svy_formHeight: the height of the contained form.

svy_formWidht: the height of the contained form.

svy_absoluteLayout: Is the contained form an absolute layout form (false means it is a reponsive form)

...

So if a height or widht is given then it will generate everything inside a div, with that specific height. If no height is given but the containedForm is in absoluteLayout it will use the form height and width to generate that wrapping div.

 

Code Block
languagejs
   function createContent() {
	   $element.empty();
 	   var newValue = $scope.model.containedForm;
	    if (newValue) {
		    	var elements = $scope.svyServoyapi.getFormComponentElements("containedForm", newValue);
 		       var height = $scope.model.height;
  		      var width = $scope.model.width;
    		    if ($scopenewValue.model.svy_absoluteLayout) {
			    	if (!height) height = $scope.modelnewValue.svy_formHeight;
	     		   if (!width) width = $scope.modelnewValue.svy_formWidth;
     		   }
    		    if (height || width) {
     			   	var template = "<div style='position:relative;";
 			       	if (height) template += "height:" +height + "px;"
			        	if (width) template += "width:" +width + "px;"
   			     	template += "'";
     			   	if ($scope.model.styleClass)  template += " class='" +$scope.model.styleClass + "'";
     			   	template += "></div>";
     			   	var div = $compile(template)($scope);
			        	div.append(elements);
    			    	$element.append(div);
		        }
    		    else $element.append(elements);
 	   }
 	   else {
 		   	$element.html("<div>FormComponentContainer, select a form</div>");
	   }
  } }