代码之家  ›  专栏  ›  技术社区  ›  Chan Yoong Hon

Sappui5从表中获取所选项目

  •  1
  • Chan Yoong Hon  · 技术社区  · 6 年前

    我在sapui5中构建了一个表,在我的表中我有一个输入字段和两个按钮。我已附上我的表的图像:

    用户可以编辑和更改产品项目的数量值。一旦用户单击勾选按钮,它将获取数量值并更新后端的OData服务。我现在的问题是,我无法获得单击勾选按钮时输入的数量值。

    以下是我的代码

    视图.xml

    <table id=“idProductStable”inset=“false”items=“path:'orderModel>/txn_orddtls'”>
    列;
    <column minscreenwidth=“tablet”demandpopin=“true”>
    <text text=“name”/>
    lt;/列& gt;
    <column minscreenwidth=“tablet”demandpopin=“true”>
    <text text=“数量”/>
    lt;/列& gt;
    <column minscreenwidth=“tablet”demandpopin=“true”>
    <text text=“UOM”/>
    lt;/列& gt;
    <column minscreenwidth=“tablet”demandpopin=“true”>
    <text text=“price”/>
    lt;/列& gt;
    <column minscreenwidth=“tablet”demandpopin=“true”>
    <text text=“subtotal”/>
    lt;/列& gt;
    <column id=“buttoncolumn1”width=“5%”minscreenwidth=“tablet”demandpopin=“true”popinsplay=“withoutheader”halign=“right”class=“sapmtableContentMargin”>
    和标题;
    <label id=“cartemedit”text=“cancel”visible=“=$设备>/system/phone”/>
    L&/Health≫
    lt;/列& gt;
    <column id=“buttoncolumn2”width=“5%”minscreenwidth=“tablet”demandpopin=“true”popinsplay=“withoutheader”halign=“right”class=“sapmtableContentMargin”>
    和标题;
    <label id=“cartemdelete”text=“cancel”visible=“=$设备>/system/phone”/>
    L&/Health≫
    lt;/列& gt;
    </columns>
    项目;
    <columnlistitem valign=“middle”>
    细胞;
    <text text=“orderModel>产品”/>
    <input id=“itemprdqty”value=“orderModel>prd”width=“70px”/>
    <text text=“orderModel>UOM U CD”/>
    <text text=“订单型号>价格”/>
    <text text=“订单型号>总金额”/>
    &!--添加按钮-->
    <button id=“editcartbutton”tooltip=“edit item”icon=“sap icon://accept”press=“editcartitempressed”type=“transparent”/>gt;
    <button id=“DeleteCartButton”tooltip=“删除项目”icon=“sap icon://decline”press=“DeleteCartItemPressed”type=“transparent”/>gt;
    &细胞/细胞;
    </columnlistitem>
    &项目/项目;
    &表;
    < /代码> 
    
    

    控制器.js

    editcartitempressed:function(oEvent){
    var noofitems=this.getview().byid(“itemprdqty”).getvalue();
    控制台日志(noofitems);
    
    
    }
    < /代码> 
    
    

    有什么解决办法可以得到我的数量值吗?

    用户可以编辑和更改产品项目的数量值。一旦用户单击勾选按钮,它将获取数量值并更新后端的OData服务。我现在的问题是我不能得到我在点击勾选按钮时输入的数量值。

    以下是我的代码

    VIEW XML

    <Table id="idProductsTable" inset="false" items="{path:'orderModel>/TXN_ORDDTLs'}">
                <columns>
                    <Column minScreenWidth="Tablet" demandPopin="true">
                        <Text text="Name"/>
                    </Column>
                    <Column minScreenWidth="Tablet" demandPopin="true">
                        <Text text="Quantity"/>
                    </Column>
                    <Column minScreenWidth="Tablet" demandPopin="true">
                        <Text text="UOM"/>
                    </Column>
                    <Column minScreenWidth="Tablet" demandPopin="true">
                        <Text text="Price"/>
                    </Column>
                    <Column minScreenWidth="Tablet" demandPopin="true">
                        <Text text="Subtotal"/>
                    </Column>
                    <Column id="buttonColumn1" width="5%" minScreenWidth="Tablet" demandPopin="true" popinDisplay="WithoutHeader" hAlign="Right" class="sapMTableContentMargin">
                        <header>
                            <Label id="cartItemEdit" text="Cancel" visible="{= ${device>/system/phone}}"/>
                        </header>
                    </Column>
                    <Column id="buttonColumn2" width="5%" minScreenWidth="Tablet" demandPopin="true" popinDisplay="WithoutHeader" hAlign="Right" class="sapMTableContentMargin">
                        <header>
                            <Label id="cartItemDelete" text="Cancel" visible="{= ${device>/system/phone}}"/>
                        </header>
                    </Column>
                </columns>
                <items>
                    <ColumnListItem vAlign="Middle">
                        <cells>
                            <Text text="{orderModel>PRODUCT_NO}"/>
                            <Input id="itemPrdQty" value="{orderModel>PRD_QTY}" width="70px"/>
                            <Text text="{orderModel>UOM_CD}"/>
                            <Text text="{orderModel>PRICE}"/>
                            <Text text="{orderModel>GROSS_AMT}"/>
                            <!-- Add Button -->
                            <Button id="editCartButton" tooltip="Edit Item" icon="sap-icon://accept" press="editCartItemPressed" type="Transparent"/>
                            <Button id="deleteCartButton" tooltip="Delete Item" icon="sap-icon://decline" press="deleteCartItemPressed" type="Transparent"/>
                        </cells>
                    </ColumnListItem>
                </items>
            </Table>
    

    控制器JS

            editCartItemPressed: function(oEvent){
                var NoOfItems = this.getView().byId("itemPrdQty").getValue();
                console.log(NoOfItems);
    
    
            },
    

    有什么解决办法可以得到我的数量值吗?

    1 回复  |  直到 6 年前
        1
  •  1
  •   Erch    6 年前

    好的,我知道你要做什么,但是如果你想让它符合FIORI的指导方针,这里是你需要做的:

    • 添加到表格模式中:“singleselect”:

      <Table id="idProductsTable" mode="SingleSelect" inset="false" items=" 
      

      路径:'ordermodel>/txn_orddtls'“>

    • 从表格中删除按钮

    • 在表格工具栏中重新创建按钮

    • 将方法更改为:

      editCartItemPressed: function(){
          var oItem= this.getView().byId("idProductsTable").getSelectedItem();
          var oEntry = oItem.getBindingContext("yourODataModel").getObject();
          console.log(oEntry.Quantity); //your quantity you want to update
      
          //yourODataModel.update(oItem.getBindingContextPath(), oEntry, {
          //    success: function(){}, // your success handler
          //    error:   function(){} // your error handler
          //});
      
      
      },
      

    结果: 你有一张带有单选按钮的桌子。通过这些选项,您可以选择一行并通过表格工具栏中的按钮编辑/删除。

    我建议您在创建应用程序之前检查FIORI设计指南,如果您不确定如何实现所需的结果,请在以下位置检查样本: https://sapui5.hana.ondemand.com/1.54.8/#/controls