Prefilling e-Form

Learn how to pass data to e-Form and pre-fill components with data.

Using Form Parameter

Example

• Pass values to OZFormParam parameters in e-Form.

• Use viewer options connection.pcount and connection.args

customer-formparam.ozr

1. Open customer.ozr and save it as customer-formparam.ozr.

2. Add an OZFormParam name.

3. Bind the parameter name with the TextBox name.

customer-formparam.html

1. Open customer.html and save it as customer-formparam.html.

2. Pass values for the parameter name and smoker as below:

customer-formparam.html

<script type="text/javascript" >
var name = "John Kim";
var smoker = "Yes";
function SetOZParamters_OZViewer(){
    var oz = document.getElementById("OZViewer");
    oz.sendToActionScript("connection.servlet", "/training/server");
    oz.sendToActionScript("connection.reportname","/forcs/john.kim/customer-formparam.ozr");
    // pass values for form parameters
    oz.sendToActionScript("connection.pcount", "2"); // the number of paramters
    oz.sendToActionScript("connection.args1", "name=" + name); // for the parameter "name"
    oz.sendToActionScript("connection.args2", "smoker=" + smoker); // for the parameter "smoker"
}
start_ozjs("OZViewer", "/html5viewer/");
</script>

Using INPUTJSON viewer option

Example

• Send a JSON data string to your e-Form with the viewer option connection.inputjson.

• All item values in JSON will be put into the corresponding components in the e-Form automatically.✨

Prepare data string in JSON to fill in customer.ozr

1. Open customer.ozr.

2. Set AllowSending (of input components that you don't want to use) to False.

3. Preview

4. Enter field values as you prefer.

5. Right-click the Hamberger icon on the top-right of the Viewer.

6. Select Copy input data (json) from the menu list.

7. Save the copied JSON string as jsondata.txt

customer-inputjson.html

1. Open customer.html and save it as customer-inputjson.html.

2. Add a variable data and assign its value from the clipboard.

3. The JSON string must be wrapped with single quotes.

4. Assign the variable data to the connection.inputjson option.

5. Get the value of smoker field from the JSON string.

customer-inputjson.html

<script type="text/javascript" >
var data = '{"name":"John Kim","n1":"A","n2":"1","n3":"2","n4":"3","n5":"4","n6":"5","n7":"6","n8":"7","n9":"Z","gender":"Male","birth_dd":"05","birth_mm":"09","birth_yyyy":"2000","phone":"[phone]","email":"[email protected]","country":"Others","country_other":"Korea","address":"Seoul","smoker":"Yes","height":"170","weight":"65","index":"22.49"}';
function SetOZParamters_OZViewer(){
    var oz = document.getElementById("OZViewer");
    oz.sendToActionScript("connection.servlet", "/training/server");
    oz.sendToActionScript("connection.reportname","/forcs/john.kim/customer.ozr");
    oz.sendToActionScript("connection.inputjson", data); // pass json data
    oz.sendToActionScript("connection.pcount", "1"); 
    oz.sendToActionScript("connection.args1", "smoker=" + JSON.parse(data).smoker);
    return true;
}
start_ozjs("OZViewer", "/html5viewer/");

customer.ozr

1. No need to add a parameter to get the JSON string from HTML.

2. Show if country_other got a value.

country_other

// OnEndBind
if (This.GetValue()) {
    This.SetVisible(true);
}

Item names in JSON string must be the same as the Name or FormID of corresponding components in the e-Form.

Using JSON Dataset

Example

customer-jsondataset.ozr

1. Open customer.ozr and save it as customer-jsondataset.ozr.

2. Add a JSON Dataset customer. (refer to the video clip above)

3. Assign dataset fields to input components.

4. Add a form parameter jsondata.

5. Set the Runtime Dataset of the dataset customer to the Parameter(data).

How-to video

customer-jsondataset.html

1. Open customer.html and save it as customer-jsondataset.html.

2. Send a JSON string to the parameter jsondata

<script type="text/javascript" >
var data = '{"name":"John Kim","n1":"A","n2":"1","n3":"2","n4":"3","n5":"4","n6":"5","n7":"6","n8":"7","n9":"Z","gender":"Male","birth_dd":"05","birth_mm":"09","birth_yyyy":"2000","phone":"[phone]","email":"[email protected]","country":"Others","country_other":"Korea","address":"Seoul","smoker":"Yes","height":"170","weight":"65","index":"22.49"}';
function SetOZParamters_OZViewer(){
    var oz = document.getElementById("OZViewer");
    oz.sendToActionScript("connection.servlet", "/training/server");
    oz.sendToActionScript("connection.reportname","/forcs/john.kim/customer-jsondataset.ozr");
    oz.sendToActionScript("connection.pcount", "1");
    oz.sendToActionScript("connection.args1", "jsondata=" + data);
    return true;
}
start_ozjs("OZViewer", "/ozviewer/");
</script>

customer-jsondataset.ozr

1. Tick male or female of the Gender using customer.gender.

2. Tick Yes or No of the Smoker using customer.smoker.

3. Show the bmi_band using customer.gender instead of OZFormParam.smoker.

male

// OnBind
if (This.GetDataSetValue("customer.gender") == "Male") {
    This.SetChecked(true);
}

female

// OnBind
if (This.GetDataSetValue("customer.gender") == "Female") {
    This.SetChecked(true);
}

smoker_y

// OnBind
if (This.GetDataSetValue("customer.smoker") == "Yes") {
    This.SetChecked(true);
}

smoker_n

// OnBind
if (This.GetDataSetValue("customer.smoker") == "No") {
    This.SetChecked(true);
}

bmi_band

// OnBind of the BMI band
if(This.GetDataSetValue("customer.smoker") == "Yes"){
    This.SetEnable(true);
}else{
    This.SetEnable(false);
}

JSON Dataset from URL

Example

1. Prepare the URL of the jsondata.txt.

2. customer-jsondataset-url.ozr

   • Set the Runtime Dataset of the dataset customer to the Parameter(URL).

Using ODI Dataset

Prefill data in OZR from the database using ODI.

Example

• Create customer-odidataset.odi

• Import customer-odidataset.odi into customer-odidataset.ozr

<script type="text/javascript" >
function SetOZParamters_OZViewer(){
    var oz = document.getElementById("OZViewer");
    oz.sendToActionScript("connection.servlet", "/training/server");
    oz.sendToActionScript("connection.reportname","/forcs/john.kim/customer-odidataset.ozr");
    oz.sendToActionScript("odi.odinames","customer-odidataset");
    return true;
}
start_ozjs("OZViewer", "/ozviewer/");

• customer-odidataset.ozr

• customer-odidataset.odi

For detailed information on ODI, refer to: Query Design