Skip to Content
avatar image
Former Member

SAP UI5 Code Problem for reading XML View input field in View Controller (Error "Can not call method 'GetValue' of Undefined" coming)

As I am in the learning process, I am stuck at one point for which I need your help. I am mentioning that in details below.

I have developed the following application in which one master page comes which shows the list of PRs to be approved by a user.

When clicking a particular PR, it shows the detail page.

In the detail page, several fields are displayed like general details, approval status list, comments (if any) and the list of attachments (attachments not yet integrated).

The line-item list is also displayed as follows –

Now, if I click on a particular line item, it opens a line item view as follows –

It is showing the selected line-item details. It will show the service sub-line item list also which is within that particular line-item as follows –

`

Line Number 00080 has sub-line item which is shown below.

Now, I have kept provision of modifying quantity, rate, cost center and G/L account (the value you are seeing above is placeholder value. I have created the gateway channels (along with RFC) for updating the same.

The process for updating the same through gateway also is known to me as I have seen some test applications (using X-CSRF-Token etc.). I have tested my gateway configuration and RFC also through test data in Postman Rest Client.

The problem I am facing is for reading the value of entered quantity, rate, G/L account, cost center in the line item controller once I presses the ‘Save Data’ button (details will be available in the lineitem view and lineitem controller in the WebContent folder). Along with that I need to read 2 fields – Banfn (PR number) and Bnfpo (PR Lineitem number) (these are needed for sending the data to gateway and updating R3 system) – these are already available in the line-item view model as data is displaying in the lineitem view.

I have to take those 6 values in 6 variables for passing to gateway service.

Can you please tell me how can I do that? It will be of great help to me if you please help me to read those 6 values in line item view controller once 'Save Data' button is pressed. I tried to attach the webcontent folder but could not attach. I am attaching the same document with screen-shots here separately.


It will be of great help if anybody can suggest what can be done to read those in controller. After reading code for sending to Gateway is known to me. I could not attach the webcontent folder as I can not upload .rar file, however I am giving the code for lineitem.view.xml and lineitem.controller.xml below -


Code of Lineitem.View.XML -


<core:View

   controllerName="sap.ui.demo.myFiori.view.LineItem"

   xmlns="sap.m"

   xmlns:core="sap.ui.core" >

   <Page

     id="page"

     title=" {i18n>LineItemTitle}"

     showNavButton="true"

     navButtonPress="handleNavBack" >

     <content>

     <ObjectHeader

         title="{Txz01}"

         number="{Tpreis1}"

         numberUnit="INR" >

      <attributes>

        <ObjectAttribute text="{Bnfpo}" />

        <ObjectAttribute text="{Menge}" />

        <ObjectAttribute text="{Preis1}" />

        <ObjectAttribute text="{Kostl}" />

        <ObjectAttribute text="{Sakto}" />

      </attributes>

     </ObjectHeader>

     <List

      headerText="Modify Quantity, Rate, Cost Center and G/L Account if needed">

     <InputListItem label="Quantity">

     <Input

     id="Vmenge"

     placeholder="Enter Value"

     value="{Menge}"/>

     </InputListItem>

     <InputListItem label="Rate">

     <Input

     id="Vpreis"

     placeholder="Enter Value"

     value="{Preis1}"/>

     </InputListItem>

     <InputListItem label="G/L Account">

     <Input

     placeholder="Enter Value"

     value="{Sakto}"/>

     </InputListItem>

     <InputListItem label="Cost Center">

     <Input

     placeholder="Enter Value"

     value="{Kostl}"/>

     </InputListItem>

     </List>

      <Table id="Table10"

       headerText="{i18n>SubLineItemTableHeader}"

       items="{LINETOSUBLINES}">

       <columns>

         <Column>

           <header><Label text="Service" /></header>

         </Column>

         <Column>

           <header><Label text="Quantity" /></header>

         </Column>

         <Column>

           <header><Label text="Rate" /></header>

         </Column>

         <Column>

           <header><Label text="Price" /></header>

         </Column>

        </columns>

       <ColumnListItem>

          <ObjectIdentifier

           title="{ShortText}"

           text="{Service}"

           class="sapTableContentMargin" />

          <ObjectNumber

            number="{Quantity}"/>

          <ObjectNumber

            number="{GrPrice}"

            unit="INR"/>

          <ObjectNumber

            number="{NetValue}"

            unit="INR"/>

        </ColumnListItem>

      </Table>

     </content>

     <footer>

       <Bar>

         <contentRight>

            <Button

             text="{i18n>dataSave}"

             type="Transparent"

             icon="sap-icon://save"

             press="handleUpdate" />

          </contentRight>

       </Bar>

     </footer>

   </Page>

</core:View>

Code of LineItem.Controller.JS

ap.ui.controller("sap.ui.demo.myFiori.view.LineItem", {

// onAfterRendering: function() {

  //       var var_menge = sap.ui.getCore().byId("Vmenge").getValue();

  //       var var_preis = sap.ui.getCore().byId("Vpreis").getValue();

  // },

  handleUpdate : function (evt) {

     // show confirmation dialog

     var bundle = this.getView().getModel("i18n").getResourceBundle();

     sap.m.MessageBox.confirm(

       bundle.getText("UpdateDialogMsg"),

       function (oAction) {

         if (sap.m.MessageBox.Action.OK === oAction) {

           var var_menge = sap.ui.getCore().byId("Vmenge").getValue();

           var var_preis = sap.ui.getCore().byId("Vpreis").getValue()

?? Was trying to read those variables but those were giving errors as below. Rest code for sending value to Gateway will be written once the above code is corrected -

I am getting the error while reading the input values from the XML view. (Error "Can not call method 'GetValue' of Undefined" coming)

_______________________________________________________________________________________________________

//LineItem.Controller.JS code is continuing below.         

// notify user

           var successMsg = bundle.getText("UpdateDialogSuccessMsg");

           sap.m.MessageToast.show(successMsg);

           // TODO call proper service method and update model (not part of this session)

         }

       },

       bundle.getText("UpdateDialogTitle")

     );

   },

   handleNavBack : function (evt) {&nbsp;

     this.nav.back("Detail");

   }

});

It will be of great help if anybody can suggest what can be done to read the input values in the controller.


Regards ....

Pic1.jpg (42.0 kB)
Pic2.jpg (50.5 kB)
Pic3.jpg (52.6 kB)
Pic4.jpg (50.7 kB)
Pic5.jpg (48.7 kB)
Pic6.jpg (54.8 kB)
Pic7.jpg (53.1 kB)
pic8.jpg (56.0 kB)
pic9.jpg (51.2 kB)
Pic10.jpg (97.6 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Best Answer
    Oct 22, 2014 at 11:12 AM

    Hi DrSubhabaha,

    So you try to get user input from a controller in view? You can do that in controller with:

    this.getView.byId(controlId).getValue();

    Could you try to write a shorter error description next time with more focused explanation of your error. Most forum users don't have the interest or time to read really long posts just to understand a problem description.

    Regards,

    Kimmo

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member Former Member

      Hi Florian,

      Thanks a lot for your great help through directing me how to read the input variables in the view controller. I am really thankful for that. I was stuck there for long and only for your precious help I was able to proceed further.

      I am giving model details of the application I am developing so that you can help me reading the other 2 variables Banfn and Bnfpo in the lineitem view controller.

      I am creating the approval application for purchase requisition.

      For bringing the basic data from the R3 system I have created the EBANMAINSet entity set in the Gateway service. The field details of the entity set is as follows –

      Banfn    1 – Key field

      Bsart      0

      Bstyp     0

      Ernam   0

      Erdat     0

      Afnam  0

      Menge 0

      Preis      0

      Peinh    0

      Ekgrp     0

      BstypTxt              0

      EkgrpTxt              0

      Username           0

      Werks   0

      WerksTxt             0

      In the component.JS, I have described the oData service as follows –

      var oModel = new sap.ui.model.odata.ODataModel( "http://blr-mt-erpdq.mul.manipal.net:8000/sap/opu/odata/sap/ZEBAN_FINAL1_SRV",false);&nbsp;
      oView.setModel(oModel);

      where ZEBAN_FINAL1_SRV is the service name.

      EBANMAINSet is the set of PRs which are to be approved by a particular individual.

      In the Master view list (Master.view.xml), I have used the following code in order to display the list –

      <List
      id="list"
      mode="{device>/listMode}"
      select="handleListSelect"
      items="{/EBANMAINSet}" >
      <ObjectListItem
      type="{device>/listItemType}"
      press="handleListItemPress"
      title="{Banfn}"
      number="{Preis}"
      numberUnit="INR" >
      <attributes>
      <ObjectAttribute text="{Afnam}"/>
      <ObjectAttribute text="{WerksTxt}"/>
      </attributes>


      </ObjectListItem>
      </List>

      It is giving the following display –


      Now, if I click on any of the PR, it will move to the detail page with the corresponding details.

      The code used in the Master.controller.js for that is as follows –

        handleListItemPress : function (evt) {
      var context = evt.getSource().getBindingContext();
      this.nav.to("Detail", context);
      },

      handleListSelect : function (evt) {
      var context = evt.getParameter("listItem").getBindingContext();
      this.nav.to("Detail", context);
      },

      Hence, the details view is displayed –


      Now, in the detail view, I am displaying the list item details as follows –

      The code used for displaying the line-item in the detail.view.xml is as follows –

      <Table id="Table1"
      headerText="{i18n>LineItemTableHeader}"
      items="{PRTOLINEITEMS}">
      <columns>
      <Column>
      <header><Label text="Material" /></header>
      </Column>
      <Column>
      <header><Label text="Quantity" /></header>
      </Column>
      <Column>
      <header><Label text="Rate" /></header>
      </Column>
      <Column>
      <header><Label text="Price" /></header>
      </Column>
      <Column>
      <header><Label text="Cost Centre" /></header>
      </Column>
      <Column>
      <header><Label text="GL Account" /></header>
      </Column>
      </columns>
      <ColumnListItem
      type="Navigation"
      press="handleLineItemPress">
      <ObjectIdentifier
      title="{Txz01}"
      text="{Bnfpo}"
      class="sapTableContentMargin" />
      <ObjectNumber
      number="{Menge}"/>
      <ObjectNumber
      number="{Preis1}"
      unit="INR"/>
      <ObjectNumber
      number="{Tpreis1}"
      unit="INR"/>
      <ObjectIdentifier
      title="{Kostl}"
      class="sapTableContentMargin" />
      <ObjectIdentifier
      title="{Sakto}"
      class="sapTableContentMargin" />
      </ColumnListItem>
      </Table>

      Now PRTOLINEITEMS is an association and created as follows –

      EBANLINEITEMSSet is the entity set of line-items with the following fields –

      Banfn – Key field (PR Number)

      Bnfpo – Key field (Line Item Number)

      Matnr

      Txz01

      Preis1

      Frgdt

      Menge

      Lfdat

      Tpreis1

      Sakto

      Kostl

      This is connected to EBANMAINSet as follows through association PRTOLINEITEMS–

      Now, there is provision of seeing each line-item in the detail page and once any line-item is clicked, it opens up a page where the line-item view is shown in the below 2 screen-shots –

      The code I have written in the Detail.Controller.JS for going to the line-item view from detail view is as follows –

        handleLineItemPress : function (evt) {
      var context = evt.getSource().getBindingContext();
      this.nav.to("LineItem", context);
      },



      When going to the Line-item view, the following is displayed in the context variable of the detail.controller.JS.



      The sPath value of context variable in oModel is as follows –

      "/EBANLINEITEMSSet(Banfn='10002715',Bnfpo='00010')"

      Now it is giving the lineitem.view.xml shown earlier and below also –



      Here the provision of modifying Quantity, Rate, G/L Account and Cost Centre has been kept which are the following fields - Menge, Preis1, Sakto and Kostl respectively.


      The following fields are to be sent to Gateway for saving the modified line-item details and for that I have already created an RFC and EntitySet named EBANLINEUPDATESet and details of that are shown below –


      Banfn and Banfpo are the key fields.


      I have implemented the CREATE service also for EBANLINEUPDATESet as follows –



      And tested the same in the Postman Rest Client and found that it is working perfectly.


      Hence, I need to send the following fields to the Gateway from the lineitem view –


      Banfn (Need to know how to read in a variable in Lineitem.controller.js)

      Bnfpo (Need to know how to read in a variable in Lineitem.controller.js)

      Menge (Already done as per your instruction – it is working – the variable I am now able to read in lineitem.controller.js)

      Preis1 (Already done as per your instruction – it is working – the variable I am now able to read in lineitem.controller.js)

      Kostl (Already done as per your instruction – it is working – the variable I am now able to read in lineitem.controller.js)

      Sakto (Already done as per your instruction – it is working – the variable I am now able to read in lineitem.controller.js)

      I want to know how to read the fields Banfn and Bnfpo in the lineitem.controller.js so that I am able to pass those to the gateway.


      Your answer will be solving my requirement completely.


      Thanks a lot Florian in advance for your great help.

      Regards .....




      Pic1.jpg (241.8 kB)
      Pic2.jpg (262.8 kB)
      Pic3.jpg (252.0 kB)
      Pic4.jpg (160.1 kB)
      Pic5.jpg (238.2 kB)
      Pic6.jpg (240.1 kB)
      Pic7.jpg (258.9 kB)
      Pic8.jpg (244.7 kB)
      Pic9.jpg (195.1 kB)
      Pic10.jpg (193.6 kB)
  • avatar image
    Former Member
    Oct 23, 2014 at 08:30 AM

    Hello DrSubhabaha Pal,

    Thanks for your extensive Description this helped a lot for understanding your application structure.

    I am not really sure about this as i´m not that familiar with how associations work in sapui5 but i think you could just try the following inside your handleUpdate method:

    //give your object header in the xmlview an id first to make accessing it easier
    var bnfpo = oView.byId("objectHeader").getBindingContext().getProperty("Bnfpo");
    var banfn = oView.byId("objectHeader").getBindingContext().getProperty("Banfn");
    

    As far as i understand the association Properties are injected into the entry so you should be able to read them through the getProperty() method.

    with best regards

    Florian

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Hi Florian,

      Thanks a lot. I forgot to give an ID to the Object Header in the Lineitem view. I have given that. Now it is working fine.

      Florian you have helped me a lot. I was stuck in some points in the development of the application as I am new to SAPUI5. This is my first UI5 application development as I am basically SAP ABAP consultant. Only for your kind support, I am now able to complete it successfully.

      I am very much thankful and oblized for your kind direction taking out time from your busy schedule. I do not think any further technical challenge I shall face in the current application development. But anything occurs in future for other application, I shall earnestly wait for your kind help and direction after posting it in this forum. Florian, I am really grateful for your kind direction for which I am now able to finish the application successfully.

      Regards ....

      Pic12.jpg (256.3 kB)
  • Oct 23, 2014 at 02:17 AM
    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Hi Masayuki,

      Actually as a first time member of SAP SCN Community, I was not aware where to post this query. Hence I posted at few places where it seemed relevant. I was not aware of this place at that time and afterwards one member told me about this place.

      I got my answer from Florian Hafner who helped me a lot.

      Thanks......