Skip to Content

SAPUI5 Select Values are not visible

Hi guys

I have a JSON-Model which I initialized in the init-function of my controller. In the view I created a select-control. So know the values are invisible but the dropdown is there.

I'm a bit fustrated because I don't see the error..

Please help me!

This is the code in my view:

<Select id="amountOfDaysSelector" items="{model>/Selector/WeekMonthSelector}">
	<core:ListItem text="{WeekMonthSelector}" />
</Select>

This is my controller:

onInit : function () {
	var oModel = new sap.ui.model.json.JSONModel({
		Selector: 
			{
				WeekMonthSelector: {
					day1: 1,
					day2: 2,
					day3: 3,
					day4: 4,
					day5: 5
					},
				MonthSelector: {
					day1: "gugus",
					day2: "supisupi"
				}
			}
	});
	this.getView().setModel(oModel, "model");
}

I also tried to add a path and sorter variable in the items property of the select-control. But it always started a HTTP-Request, which obviously failes because the data is not in the backend...

like this:

<Select id="amountOfDaysSelector" items="{
                             path: '/Selector',
                             sorter: {path: 'WeekMonthSelector'}}" />
   <core:ListItem text="{WeekMonthSelector}" />
</Select>

I'm looking forward of your answers.

Cheers,
Shana

Add a comment
10|10000 characters needed characters exceeded

Assigned Tags

Related questions

1 Answer

  • Best Answer
    Posted on Jul 15, 2020 at 08:59 AM

    Hi Shana,

    There a couple of corrections needed for your code to work.

    As I understand, you have done aggregation binding on the structure: WeekMonthSelector. Further the drop down should show the values for the days in the drop down.

    In order to do this, your JSON Model should look like so:

    var oModel = new sap.ui.model.json.JSONModel({
    		Selector: 
    			{
    				WeekMonthSelector: [
    					{
    						day: 1
    					},
    					{
    						day: 2
    					},
    					{
    						day: 3
    					},
    					{
    						day: 4
    					},
    					{
    						day: 5
    					}],
    				MonthSelector: {
    					day1: "gugus",
    					day2: "supisupi"
    				}
    			}
    	});
    

    Basically, the aggregation binding has to be done on an Entity Set or any data variable which in turn also has a structure within it. Also, the key of the data variable in the repeating structure needs to be same.

    With the above structure, the relative property binding should be as:

    <Select id="amountOfDaysSelector" items="{model>/Selector/WeekMonthSelector}">
    	<core:ListItem text="{model>day}" />
    </Select>

    If you want to do something similar for your MonthSelector, then you can follow the above approach.

    Do let me know if this resolves your issue.

    Best Regards,

    Rohit

    Add a comment
    10|10000 characters needed characters exceeded

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.