个人中心
gpt4 book ai didi

javascript - 如何将值从 XML View 传递到 Controller ？

转载 作者：行者123 更新时间：2023-11-29 10:13:51 24 4
gpt4 key购买 nike

我正在练习使用 openUI5 中的 mvc 进行数据绑定(bind)。我有一个 XML View ，其中包含一个从 JSON 模型填充的表，每行的文本字段旁边都有一个按钮。我想在文本字段中输入一个新的 Position，按下它旁边的按钮并更新 Position 列单元格，以演示绑定(bind)。

ID    Name       Age   Position     Update Position
101   Brian Cox  23    Developer    [text area for new position]   [update button]

XML View :

<mvc:View
  controllerName="view.App"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns:l="sap.ui.layout"
  xmlns="sap.m">
  <Table items="{/employee}">
<columns>
  <Column>
    <Text text="ID" />
  </Column>
  <Column>
    <Text text="Name" />
  </Column>
  <Column>
    <Text text="Age" />
  </Column>
  <Column>
    <Text text="Position" />
  </Column>
  <Column>
    <Text text="Update Position" />
  </Column>
  <Column>
  </Column>
</columns>

<items>
  <ColumnListItem>
    <cells>
      <Text text="{id}" />
      <Text text="{Name}" />
      <Text text="{Age}" />
      <Text text="{Position}"/>
      <TextArea />
      <Button text="Update" press="posUpdate"/>
    </cells>
  </ColumnListItem>
</items>

</Table>
</mvc:View>

在我的 Controller 中，我有一个附加到按钮的函数来更新员工的 JSONModel。

sap.ui.controller("view.App", {

onInit: function(){
    oModel = new sap.ui.model.json.JSONModel("employee.json");
    oModel.setDefaultBindingMode(sap.ui.model.BindingMode.OneWay);
    this.getView().setModel(oModel);
    sap.ui.getCore().setModel(oModel);
},

posUpdate: function(){
    //trying to fetch the value of the textarea in the view
    var data = sap.ui.getCore().byId("newPos").getValue();
    sap.ui.getCore().getModel('oModel').getProperty("Position");
    oModel.setData({Position: data}, true);
}
});

JSON:

{
"employee": [
    {
        "id": 101,
        "Name": "Brian Cox",
        "Age": "23",
        "Position": "Developer"
    },
    {
        "id": 102,
        "Name": "Richard Feynman",
        "Age": "66",
        "Position": "HR Clerk"
    },
    {
        "id": 103,
        "Name": "Tycho Brahe",
        "Age": "65",
        "Position": "Developer"
    },
    {
        "id": 104,
        "Name": "Albert Einstein",
        "Age": "32",
        "Position": "Consultant"
    }
 ]
}

索引.html:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='X-UA-Compatible' content='IE=edge' />
<title>UI5 MVC with XmlView</title>
<script id='sap-ui-bootstrap' type='text/javascript'
    src='../resources/sap-ui-core.js'
    data-sap-ui-theme='sap_bluecrystal'
    data-sap-ui-libs='sap.m, sap.ui.table'></script>

<script>
    sap.ui.localResources("view");

    var view = new sap.ui.xmlview("App", "view.App").placeAt("content");

</script>
</head>
<body class="sapUiBody">
    <div id="content"></div>
</body>
</html>

在 Controller 的 posUpdate 函数中，我想检索文本字段的值，并将模型中的 Position 值更改为该值。我如何为特定的 JSON 对象执行此操作？我觉得我需要以某种方式更改 JSON 文件以适应这一点。

我是 UI5 的新手，也欢迎对我的代码结构和一般实践提出任何有用的评论。

提前谢谢你。

最佳答案

要演示绑定(bind)，您需要做的就是:

替换:

  <TextArea />

与

<TextArea value="{Position}"/>

并完全删除更新按钮。

直接 DOM 或 SAP 对象操作来获取值违背了双向绑定(bind)框架的全部目的!!!

Allen，绑定(bind)需要 7 行代码？？？请告诉我你在开玩笑。

关于javascript - 如何将值从 XML View 传递到 Controller ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27148363/

24 4 0
文章推荐： javascript - javascript中的斜线转义
文章推荐： mysql - 如何在 Laravel 模型类中实现 GROUP_CONCAT？
文章推荐： javascript - 如何在 Protractor 中运行相同的测试文件两次？
文章推荐： javascript - 找到所有没有被任何字符包围的 ":)"
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com