Default variable values in an Application

Erlebacher
Level 4
Default variable values in an Application

Inside an Application, I define an "Edit project Variables" section, followed by my variable definitions: an "INT" and a "STRING".

2022-12-05_22-07-00.png===========

[
{
"name": "welcome",
"label": "on",
"defaultValue": "5.2 is my game",
"mandatory": true,
"canSelectForeign": false,
"markCreatedAsBuilt": false,
"allowDuplicates": true,
"visibilityCondition": "true",
"getChoicesFromPython": false,
"triggerParameters": [],
"disableAutoReload": false,
"canCreateDataset": false
},
{
"name": "my_int",
"type": "INT",
"label": "my int label",
"mandatory": true,
"canSelectForeign": false,
"markCreatedAsBuilt": true,
"allowDuplicates": true,
"visibilityCondition": "true",
"getChoicesFromPython": false,
"triggerParameters": [],
"disableAutoReload": false,
"canCreateDataset": false
}
]==================================

I set visibility to True, and do not provide default variables. I am hoping that the default variables defined in the Variables section of my project will provide the default values. Here are my variable definitions:

.........

{
"my_int": 47,
"my_float": 3.14159,
"my_string": "my name is Gordon"
}

........

defined as both project and locations. I would like the values of these variables to be transmitted to the Application interface when I click on "Test". But that does not happen. Instead, I get:

2022-12-05_22-19-07.png

Notice that the string gives an error of "undefined parameter". I can find no explanations, no good examples online. Any insight would be greatly appreciated. I am at a complete loss at this time. Thanks.


Operating system used: mac, Ventura


Operating system used: mac, ventura

0 Kudos
4 Replies
Erlebacher
Level 4
Author

Nobody appears to know the answer to my question? 

People who work at Dataiku, perhaps the person who wrote the "Application Designer" could help out? 

Here is a related question: can somebody point me to a working example of the custom UI? Given that nobody knows the answer to my previous question, I might take the more complex route. Specifically, I would like, if possible, an example using the three elements below:  (thanks!)

2022-12-06_15-49-15.png

0 Kudos
Erlebacher
Level 4
Author

Here is possibly a simpler question 🙂

I define a project variable:    {"welcome": "Hello World"}

In a custom UI in the Application Designer, I have some HTML and would like to expand this variable. How is this done? I tried (unsuccessfully): 

<div ng-app="myApp" ng-controller="myCtrl">
<input ng-model="name" value="${welcome}">
</div>

I simply got ${welcome} returned to me, verbatim. 

Any insight is appreciated. Thanks.

0 Kudos
Erlebacher
Level 4
Author

Here is some of what I have been trying in the custom UI.  
(I have tried to use code brackets, but keep getting the error that there is illegal HTML in my posts and I am prevented from posting). 

In the HTML section: 

<div ng-app="myApp" ng-controller="myCtrl">
<input ng-model="name">
<p>The input field is bound to the "name" variable:</p>
{{name}}
</div>

In the JS section: 

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.name = "John Doe";
});

And I do not know what to put into the Angular module section. I have read documentation, but see no example that documents exactly what to do for the custom UI. Could somebody please post an example or provide a link to one? Thanks.

0 Kudos
yeshuaw
Level 1

I'm actually kinda surprised that no one has answered this from Dataiku as it's now the first search result when searching "Dataiku App default value." This took a while to find a solution but I'll try to explain the best way possible.

1) Like the recipe plugins json file that defines a plugin form, the object properties of an app's auto-generated controls share similar attributes; however, "defaultValue" that exists for plugins doesn't seem to apply to applications. Maybe Dataiku can add this in as a feature request since it's the most straight forward option.

2) The default values set in the variables for the project don't auto-populate either--maybe they should but that's yet another feature request.

3) The easiest option I've been able to find is to create a tile to edit project variables, set the behavior to "inline," and use the "Custom UI" options.

I won't cover the custom Python code helper section as this is well documented--even if it's about plugins as the functionality is the same.

In the "Custom UI HTML" section, a simple hidden input will do.

<div ng-controller="DefaultSetter as defSet">
<div class="control-group" >
<div class="controls" >
<input type="hidden" id="defaultInput_9f4nfjvaj3" ng-model="config.projectVariableName" />
</div>
</div>
</div>

 Some notes: the id in the input is random junk in case you happen to choose something that Dataiku already has assigned to some other element--it's a big app. The ng-model here is using the "config.projectVariable" that we'll use in the AngularJS $scope (referenced as $scope.config.projectVariable later). Without the "config" part the model will be scoped to the top level of your controller (i.e. $scope.myCustomVariable). That's still powerful as you can setup other variables without directly watching/changing the project variables. The input won't show here because it's hidden, but it'll still create a section of tile. You can maybe try using 'style="display:none;" ' at the top of the div element--I didn't try.

In the "Custom UI JS" section, we can set our defaults.

 

var app = angular.module('defaultSetter', []);
app.controller('DefaultSetter', function($scope) {
$scope.$watch('config.projectVariableThatMightChange', function(inva){
    //Do something once the variable updates if you'd like
});
let setDefaults = function(){
       let defaultVars = {
          "projectVariableName": 2
      };
       $scope.config = Object.assign($scope.config, defaultVars);
};
setDefaults();
});

More notes: Take note of the app module name "defaultSetter," we'll need it for the last part. The $watch line isn't necessary but if you have other parts of the app that might change, you can centralize a lot of your code here. I created a new object called "defaultVars" that uses the same variable names for my project. The "Object.assign" is a Javascript function that merges the $scope.config object with the defaultVars. You can also directly assign each variable like "$scope.config.projectVariableName = 1;" This example only has one variable but you can just as easily copy/paste your project variables JSON after the equal sign to save some keystrokes. Since the $scope.config object contains ALL project variables, the Object.assign allows you to only update the variables you want without destroying the model completely.

Finally, in the "Angular Module" section, you're going to input just your app's name, in this case "defaultSetter" in the box. Save, Test, and Deploy. Keep in mind, this will ALWAYS reset the project variables to your defaults, even if users revisit the app again where it usually saved their last inputs.

Hope this helps!

0 Kudos