Search code examples
odatasapui5

Edit multiple rows from the table


I have tied ODataModel with table using "TwoWay" binding. I need to allow user to edit the rows of the table at the bottom of which I have 'Save' button. Currently though the table is editable I am unable to edit the entries in multiple rows of the table.
Please find my code below:

var oTable = new sap.ui.table.Table("dprTable",{
        visibleRowCount: 4,
        visible: true,
        navigationMode: sap.ui.table.NavigationMode.Paginator
    });

    var oColumn = new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "DBR/DPR"}),
        template: new sap.m.Link({
            "target": "_blank",
            press:[controller.onClickDemoNo,controller]

        }).bindProperty("text","DemoId"),
        width: "auto",
        tooltip: "DBR/DPR"
    });

    oTable.addColumn(oColumn);

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Description"}),
        template: new sap.ui.commons.TextView().bindProperty("text", "DemoDesc"),
        width: "auto",
        tooltip: "Description"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Required Date"}),
        template: new sap.ui.commons.DatePicker("",{
            value:{
                path:"ReqDate",
                type: new sap.ui.model.type.Date({pattern: "dd-MM-yyyy"})
            },
            change: function(){
                console.log('the date is changed and it\'s value is'+value);
            },


        }),
        width: "auto",
        tooltip: "Required Date"
    }));


    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Requestor"}),
        template: new sap.ui.commons.TextView().bindProperty("text", "RequestorName"),
        width: "auto",
        tooltip: "Requestor"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Requestor/Project Lead"}),
        template: new sap.ui.commons.TextView().bindProperty("text", "LeadName"),
        width: "auto",
        tooltip: "Requestor/Project Lead"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Solution"}),
        template: new sap.ui.commons.TextView().bindProperty("text", "SolutionText"),
        width: "auto",
        tooltip: "Solution"

    }));



    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Start Date"}),
        template: new sap.ui.commons.DatePicker("",{
            value:{
                path:"StartDate",
                type: new sap.ui.model.type.Date({pattern: "dd-MM-yyyy"})
            }
        }),
        width: "auto",
        tooltip: "Start Date"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "End Date"}),
        template: new sap.ui.commons.DatePicker("",{
            value:{
                path:"StartDate",
                type: new sap.ui.model.type.Date({pattern: "dd-MM-yyyy"})
            }
        }),
        width: "auto",
        tooltip: "End Date"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Estimated Duration"}),
        template: new sap.ui.commons.TextView().bindProperty("text", "EstDuration"),
        width: "auto",
        tooltip: "Estimated Duration"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Hours"}),
        template: new sap.m.Input("",{}).bindProperty("value", "ActDuration"),
        width: "auto",
        tooltip: "Hours"

    }));

    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Status"}),
        template: new sap.ui.commons.ComboBox({items: [
            new sap.ui.core.ListItem({text: "New",key:"1"}),
            new sap.ui.core.ListItem({text: "In Process",key:"2"}),
            new sap.ui.core.ListItem({text: "Completed",key:"3"})
        ]}).bindProperty("value","StatusText"),
        width: "auto",
        tooltip: "Status"

    }));

    oTable.setBusyIndicatorDelay(1);
    //oData service call

    var oModel = new sap.ui.model.odata.ODataModel("/sap/opu/odata/sap/ZSECENTRAL_SRV",true);
    oModel.setDefaultBindingMode("TwoWay");
    oModel.attachRequestSent(function (oEvent) {
        console.log('request sent');
         oTable.setBusy(true);
    });
    oModel.attachRequestCompleted(function () {
            console.log('request completed');
            oTable.setBusy(false);

    });
    oModel.attachRequestFailed(function () {
              oTable.setBusy(false);
    });

    oTable.setModel(oModel);
    oTable.bindRows("/DEOPENDBRSet");

Is there something pending in the settings? And to update the multiple records in the table do I have to make use of some batch operations? Any help would be appreciated.

Thanks


Solution

  • For OData, one http request can only contains one CRUD operation, unless using batch. Thus, for multiple records updating, suggest using batch