Regarding Model Data Binding.

[former_member184111]

Hi ,

I need information about MODEL DATA BINDING concept .

I have already read the blog [BSP In-Depth: Model Data Binding|https://www.sdn.sap.com/irj/sdn/weblogs?blog=/pub/wlg/2007] [original link is broken] [original link is broken] [original link is broken];

but couldnt make much out of it.

Also tried out the PDF given in blog but couldnt complete the example application in that PDF becuae of some errors.

Can anyone please explain the concept in simple and easy terms, prefferably with a simple example.

Thanks everyone.

[Former Member · Accepted solution]

Hi Anubhav,

Model Data Binding in business server pages ensure that data which is entered by the user in

the user interface(view) automatically passes to the model attributes and also output from the

backend system automatically passes to the result view.

So we need n't handle the data which is going to backend or the data which is coming from

backend system.

Data binding takes care of all the data handling .so we need n't write code to handle the data.

All i can say is data binding means binding the UI elements with the model class attributes.

If data binding is not available in BSP, we would have written lot of code in controller class

of business server pages.

I am giving simple example here to make you understand.

The initial view in this application contains 2 input fields, 4 radio buttons and 1 button.

Here radio buttons named Add, Multiple , Subtract and Divide.

The functionality i this application is whenever user enters numbers in input fields and select on

radio button and click on button , the result has to be displayed in the result view.

Initial View:

<htmlb:content design="design2003">

<htmlb:page title = " ">

<htmlb:form>

<htmlb:textView text = "value1"

design = "EMPHASIZED" />

<htmlb:inputField id = "f1" value = "//model/v1" />

<htmlb:textView text = "value2"

design = "EMPHASIZED" />

<htmlb:inputField id = "f2" value = "//model/v2" />

<htmlb:radioButtonGroup id="rbg" selection="//model/s" >

<htmlb:radioButton id="id_add" text="add"/>

<htmlb:radioButton id="id_sub" text="sub"/>

<htmlb:radioButton id="id_mul" text="mul"/>

<htmlb:radioButton id="id_div" text="div"/>

</htmlb:radioButtonGroup>

</htmlb:form>

This code in the above view shows the data binding;

<htmlb:inputField id = "f1" value = "//model/v1" /> and

<htmlb:inputField id = "f2" value = "//model/v2" /> and

<htmlb:radioButtonGroup id="rbg" selection="//model/s" >

Here v1,v2 and s are model class attributes . model is reference variable of model class .model is declared

as page attribute in BSP.

As i said above automatically the values of inputfields are passes to the model class without writing the code.

Code in model class method:

METHOD toall.

IF s = 'id_add' .

v3 = v1 + v2.

ELSEIF s = 'id_sub'.

v3 = v1 - v2.

ELSEIF s = 'id_mul'.

v3 = v1 * v2.

ELSE.

v3 = v1 / v2.

ENDIF.

ENDMETHOD.

</htmlb:page>

</htmlb:content>

Result View:

<htmlb:content design="design2003">

<htmlb:page title = " ">

<htmlb:form>

<htmlb:textView text = "output"

design = "EMPHASIZED" />

<htmlb:textView text = "//model/v3"

design = "EMPHASIZED" />

</htmlb:form>

</htmlb:page>

</htmlb:content>

Here the result is available v3 attribute of model class and it is binded to the text view of the result view.

Finally the result is displayed in result view.In the above example i didn't explain about controller class

I hope you know about controller class.

Hope it helps.

Reward points,if found useful.

Thanks,

Narendra.M

[Former Member]

Hi Jain,

Data binding enables data transfer between views and models, so that we don't have to add or change controller coding to work with models.

Syntax for DataBinding:

For <htmlb:InputField>

<htmlb:InputField value="//query/a"/>

This example code creates an inputfield that takes its initial value from the a attribute of query model.

here query is the instance for model we can define in conroller Do init method.

For ex if you want to add two numbers by using model data binding.

Create method add in model which has three attributes value1,value2, and result.We have to define these attributes in model.Result is to print the added vaue.

Then we have to add these values to the model in the view by using above syntax:

<htmlb:InputField value="//query/value1"/>

<htmlb:InputField value="//query/value2"/>

<htmlb:InputField value="//query/result"/>

here query is instance for the model.

Here you have to remeber one point that no need to define these attributes(value1,value2,result) in the view again but you have define model instance in the attributes of view.

Try using this concept..........

Reward points if useful.