Question

我在Web IDE中创建了一个表，其中包含一个复选框和输入框，默认显示＆＃34; 100％＆＃34;选中复选框时。它在我从json添加数据之前工作但是现在我将列列表项设置为从某些列的json获取数据的模板，选择复选框时输入框不会填写。

现在显示什么：

我想要出现的内容：

如果我使用类似消息框的内容，则在选中复选框时会执行正确的输出。

sap.m.MessageBox.alert("100%")
sap.m.MessageBox.alert("0%")

我将事件绑定到选择下的复选框。这是复选框的代码。

    percentCheck: function(oEvent) {
        //inputText is the input Text box  
        var inputText = this.getView().byId("inputPercent");
        var isSelected = oEvent.getParameter("selected");

        if (isSelected) {
            inputText.setValue("100%");
        } else {
            inputText.setValue("");
        }
    }

Answer 1

我认为最好更新模型而不是直接更改控件的值。这是一个例子 http://jsbin.com/yuhipop/edit?html,js,output

$http.post(baseURL, {
        id:id,
        action:'SingleMessage'
   }).then(function(response){
       if(response.data.status == 1){
angular.element('[name=message_page]').val(response.data.data.message_page);
(function() {
            [].slice.call( document.querySelectorAll( 'select.cs-select' ) ).forEach( function(el) {
                new SelectFx(el);
            } );
        })();
        }
},function errorCallback(response){
     console.log(response);
   });

视图

<!DOCTYPE HTML>
<html>

  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="UTF-8">
    <title>MVC</title>
    <script id="sap-ui-bootstrap" type="text/javascript"
            src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
            data-sap-ui-theme="sap_bluecrystal"
            data-sap-ui-libs="sap.m,sap.ui.table"
            data-sap-ui-xx-bindingSyntax="complex">
    </script>

    <script id="oView" type="sapui5/xmlview">
    <mvc:View height="100%" controllerName="myView.Template"
      xmlns="sap.m" 
      xmlns:core="sap.ui.core"
      xmlns:mvc="sap.ui.core.mvc"
      xmlns:table="sap.ui.table">

    <table:Table id="Table1" rows="{/}"
      selectionMode="None">
      <table:columns>
        <table:Column>
        <Label text="Employee name"/>
        <table:template>
          <Text text="{name}" ></Text>
        </table:template>
        </table:Column>
        <table:Column>
          <Label text="Company"/>
          <table:template>
            <Text text="{company}"></Text>
          </table:template>
        </table:Column>
        <table:Column>
        <Label text="Checkbox"/>
        <table:template>
          <CheckBox selected="{selected}" 
            select="checkBoxChanged"/>
        </table:template>
        </table:Column>
        <table:Column>
        <Label text="Bonus"/>
        <table:template>
          <Input value="{bonus}" 
            change="inputChanged"/>
        </table:template>
        </table:Column>
      </table:columns>

    </table:Table>
  </mvc:View>
    </script>

  </head>

  <body class="sapUiBody" role="application">
    <div id="content"></div>
  </body>

</html>

Answer 2

这是我能够使用它来使用数据

查看：

<CheckBox id="checkEstimate" select="estimatePercentageSelect"/>
<Input value="{percent}" width="100%" id="inputPercent"/>

控制器：

estimatePercentageSelect: function(oEvent) {
//get parameter if checkbox is selected
var isSelected = oEvent.getParameter("selected");
//get source to bind
var cxt = oEvent.getSource().getBindingContext();

//if checkbox is selected, set property "percent" to 100%
if (isSelected) {
  cxt.getModel().setProperty("percent","100%",cxt);
  }
  else{
    cxt.getModel().setProperty("percent",null,cxt);
  }
}

选中复选框时输入框不会更新sapiu5

2 个答案: