Skip to Content
0

SAPUI5 : How to update display on SelectedKey change?

Dec 27, 2017 at 12:26 PM

103

avatar image
Former Member

I have problem with display information. I need to set the values from the Drop box.

Code from clothing.json

{
  "catalog": {
    "clothing": {
      "categories": [
        {"name": "Women", "categories": [
          {"name":"Clothing", "categories": [
            {"name": "Dresses", "categories": [
              {"name": "Casual Red Dress", "amount": 16.99, "currency": "EUR", "size": "S"},
              {"name": "Short Black Dress", "amount": 47.99, "currency": "EUR", "size": "M"},
              {"name": "Long Blue Dinner Dress", "amount": 103.99, "currency": "USD", "size": "L"}
            ]},

Code from View.xml

<Column id="colSize" width="11rem">
  <m:Label text="Size"/>
  <template>
     <m:Select
        id = "selSize"
        selectedKey="{size}"
        items="{path: '/sizes', templateShareable: true}"
        visible="{= !!${size}}"
        forceSelection="false">
        <core:Item key="{key}" text="{value}"/>
      </m:Select>
   </template>
 </Column>

and part the code from Controller.js

 onPressBtnSetSize: function() {
        var oComboBox = this.byId("cbxSelectSize"),
            sKey = oComboBox.getSelectedItem().getKey(),
            oSelect = this.byId("selSize");
            oSelect.setSelectedKey(sKey);       
    }

Now, when I call the method getSelectedKey(). I get the meaning of my sKey. But the display in the table does not change.

I think need to refresh the table. But all my attempts failed. Kindly help!

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

3 Answers

Best Answer
Ivan Mirisola
Dec 27, 2017 at 02:01 PM
0

Hi Roman,

Your table will display the data in your model (JSON Model). So if you need it to display changes based on the selected key from the combo box element, your code needs to loop through the elements on the JSON model and change the corresponding values. Since your code is incomplete, there is no way we can understand how the JSON model is being created. But I assume you set the view's model on component initialization or controller's init method. Either way, the event handler for the Combo box element would need to change the corresponding JSON string and set it again so the view receives the notification to repaint.

Also, please check that the model is being set as two-way-data-binding. Usually if you are not using method setDefaultBindingMode on your JSON Model than the default would be two-way.

Regards,
Ivan

Show 4 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Thanks for the answer.

Could you, tell me. How can I quickly access fields "size"?
since, I only know the long way:
this.getView().getModel().getProperty("/catalog/clothing/categories");

....

and as I understand, it will take a lot of code

.....

0

Hi Roman,

Not sure what you mean by getting the field size. Are you referring to a JSON attribute value? Or are you referring to performing a loop on the categories and you want to know how many are there in your json string? If it is the latter, please check this site for JQuery examples. Otherwise, please be more specific.

Regards,
Ivan

0
Former Member

Yes

I referring to a JSON attribute value ("size").

Regards,
Roman

0

in that case you could loop thru the values on your json model and replace the values from "size" attribute using the example mentioned (jquery.each).

0
Irfan Gokak Dec 27, 2017 at 03:16 PM
0

Hi,

What do you want to do on getting the key in the table?

Show 2 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi,

At first, I thought that I could just change the value of the property "selectedKey" inside the container <Select>.

I tried to do it this way:

onPressBtnSetSize:function(){
        var oComboBox = this.byId("cbxSelectSize"),
            sKey = oComboBox.getSelectedItem().getKey(),
            oSelect = this.byId("selSize");
            oSelect.setSelectedKey(sKey);}

But, apparently, it does not work like that.

Now, I want to access to a JSON attribute value ("size"). And change it

Regards,
Roman

0

Hi,

Can you tell me how you're setting value to the combo box. I mean show me the code how you're binding values to thecbxSelectSize this combo box

0
avatar image
Former Member
Dec 30, 2017 at 06:20 PM
0

Hi Roman

Sorry we are unable to understand your requirement. It is kind of hard to figure out what are your intention.

here is what I believe you are looking for. Sorry if I get it wrong

http://jsbin.com/lutocan/

http://jsbin.com/lutocan/edit?html,js,output

Thanks

-D

Share
10 |10000 characters needed characters left characters exceeded