XML view does not support data-binding functionality

I have encountered a problem with data visualization when using the XML view compared to the JSON view in a simple example. The binding works fine with JSON, but no data is visualized with XML. Why is that?

This code snippet represents the controller logic for both XML and JSON views..

sap.ui.controller("appIntra.test", {

    onInit : function() {
        var data = {
                names: [
                    {firstName: "Peter", lastName: "Mueller"},
                    {firstName: "Petra", lastName: "Maier"},
                    {firstName: "Thomas", lastName: "Smith"},
                    {firstName: "John", lastName: "Williams"},
                    {firstName: "Maria", lastName: "Jones"}
                ]
            };
        // create a Model with this data
        var model = new sap.ui.model.json.JSONModel();
        model.setData(data);

        console.log("controller");
        sap.ui.getCore().setModel(model);
        //this.getView().setModel(model);

    },


});

Now let's take a look at the JSON view.

sap.ui.jsview("appIntra.test", {

    /** Specifies the Controller belonging to this View. 
    * In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
    * @memberOf appIntra.test
    */ 
    getControllerName : function() {
        return "appIntra.test";
    },

    /** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed. 
    * Since the Controller is given to this method, its event handlers can be attached right away. 
    * @memberOf appIntra.test
    */ 
    createContent : function(oController) {
        console.log("view");
        // create a List control
        var list = new sap.m.List({
            headerText:"Names"
        });

        // bind the List items to the data collection
        list.bindItems({
            path : "/names", 
            template : new sap.m.StandardListItem({
                title: "{lastName}",
                description: "{firstName}",
                type: sap.m.ListType.Navigation,
            })
        });






        return new sap.m.Page({
            title: "Title",
            content: list
        });
    }

});

Lastly, here is a snippet of the XML view.

                    <List
                        items="{
                          path: '/items',
                          sorter: {
                            path: 'padre',
                            descending: false,
                            group: true
                          }
                        }" 
                        headerText="Operazioni" >
                        <StandardListItem
                          title="{text}" 
                        />
                    </List> 

Answer №1

                   <List
                    data-items="{
                      url: '/names',
                      sort: {
                        by: 'parent',
                        order: asc,
                        grouping: true
                      }
                    }" 
                    title="Actions" >
                    <StandardListItem
                      name="{text}" 
                    />
                </List> 

Answer №2

To enhance the functionality, consider including the suggested parameter in the bootstrap configuration of the HTML document.

data-custom-ui-xx-syntax="rich"

Best regards, Alexis

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Google Shopping XML data feed

We currently have a functional XML file that we provide via a link for Google Merchant Center to utilize (for an online store specializing in gardening products). Here is a brief overview of the structure: <?xml version="1.0" encoding="utf-8"?> < ...

My goal is to develop a custom forEach function that retrieves a substring from each element in an array

I have a file containing image names like: sciFi.png, posed.png, birdA.png, dolphin.png, horse.png, shake.png, loft.png, basement.png, avenger.png, friend.png In my JavaScript document, I am trying to read this file and convert it into an array. Then, I w ...

What's the process for setting a value in selectize.js using Angular programmatically?

Currently, I am implementing the AngularJS directive to utilize selectize.js from this source: https://github.com/kbanman/selectize-ng In my scenario, I have two dropdowns and my goal is to dynamically populate one of them called selectizeVat based on the ...

Generate a dynamic JSON object using data from MONGODB, then save the object to a .json file for future reference

Imagine having your MongoDB database and needing to back up the data into a .json file. For instance, an example output file could be named database.json containing: { "collections": [ {"name": "admin"}, {"name": "class"}, {"name": "les ...

Unlocking the Secret: Retrieving Click Event Values from a jQuery Function

Is there a way to retrieve the onclick event value change in jQuery when clicking on a DIV? $("ul li").click(function(){ var newValue = $(this).val(); }); $(function(){ alert(newValue); }); ...

delay of Paypal API disbursement for transactions with a range of money values

After browsing through various resources such as this link, that link, and another one on the PayPal developer website, I attempted to implement a payment processing system that allows users to approve a preset amount of money. Similar to services like Ube ...

Encountering issues with trailing bytes error in redis 3.0.6 when using socket.io-redis

Utilizing phpredis for transmitting data to node.js through the pubsub method brought about an issue after upgrading node.js to stable version 4.2, resulting in a trailing byte error from the socket.io-redis module. Here is the code snippet in question: ...

Next.js threw a wrench in my plans when the HTML syntax was completely disrupted upon saving the index.js

I have encountered an issue in my VSCode environment while working on a next.js project. Whenever I attempt to save the index.js file, the HTML syntax crashes. I am at a loss on how to resolve this issue, so any assistance would be greatly appreciated. Tha ...

C# Rest Client Tool that Works with Various REST API's

I am looking to develop a REST client in C# that can dynamically read API call details from a configuration file, process the JSON responses received, and generate corresponding CSV files. Additionally, there will be another configuration file specifying a ...

Different ways to streamline the validation process for multiple input fields in a form using Vue 3

Within my application, there lies a form consisting of numerous input fields. These text input fields are displayed based on the selection made via radio buttons. I am currently validating these input fields by specifying the field name and its correspondi ...

Creating a User Registration and Authentication System with JavaScript for a Database

I'm new to the world of web development and I've encountered a bit of a challenge. I'm looking for a Javascript framework that can handle user registration and authentication with a database, similar to what I would do with PHP and MySql. I ...

Copy values of multiple input fields to clipboard on click

I have a collection of buttons in my Library, each with different text that I want to copy when clicked function copyTextToClipboard(id) { var textElement = document.getElementById(id); textElement.select(); navigator.clipboard.writeText(textElement. ...

Value-based JavaScript object prototype

Is there a way to ensure that every new object I create has its own unique dataTransfer property? For instance, when I try something like Object.prototype.dataTransfer = new DataTransfer();, I want a.dataTransfer.prop to remain 1 even if b.dataTransfer.pro ...

Effortless 'rotational' script

I am currently developing a HTML5 Canvas game with the help of JavaScript. My aim is to create an object that smoothly transitions to a specific direction. The direction is being stored as a variable and calculated in radians. Here's how the code op ...

Retrieving a particular value from JSON data on the internet

Hello, I have a script that retrieves JSON output in an array. However, I am attempting to extract only the name field, specifically the domain TLDs from the HostBill API. Despite trying various methods, I keep encountering this error: Notice: Trying to ge ...

Convert a unicode stream by reading and uploading the XML file

I am working with a file upload control to upload XML documents. The challenge I am facing is that the XML files are encoded in unicode format, and I need to convert them to UTF8 for proper rendering as XML files. Currently, I am saving the uploaded file ...

Discovering if a web element includes a pseudo element in Java

Within my Java Selenium automation project, I am faced with the challenge of determining whether certain web elements contain pseudo elements or not. I came across this question but found that the provided answer does not work as expected. This solut ...

Utilizing D3.js to filter nodes and links by making multiple selections from a checkbox

I am interested in enhancing my current forced directed graph by adding more flexibility. You can access the Jsfiddle here. Currently, there are radio buttons that control the opacity of nodes and links. There are 4 types of nodes: Agent, Customer, Pho ...

Generating buttons automatically and transforming them into an accordion

My code consists of a function that generates buttons based on the current month, creating 28 buttons for February, 31 buttons for March, and so on. Additionally, I have implemented an accordion function. However, I am facing difficulty in integrating both ...

c3.js Error: The value of b is not defined

Struggling to create a graph using a JSON object generated in PHP. Despite following the documentation example, I keep encountering a TypeError: b.value is undefined in the JS log. The data seems to be structured correctly. for($i = 0; $i < 10; $i++){ ...