All geek questions in one place

Using SearchField Inside Popover Continues to Publish "Select" Event and Rerenders Popover

I am using a custom control for popover, like this:

sap.ui.define([
  "sap/m/Popover"
], function(Popover) {
  "use strict";

  return Popover.extend("name of controle", {
    init: function() {
      Popover.prototype.init.apply(this, arguments);
        this.oPopup.setAutoClose(false);
    },

    renderer : "sap.m.PopoverRenderer"

  });
});

And I use this custom popover element as follows:

<core:FragmentDefinition
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  xmlns:path="path to custom popover"
>
  <path:CustomPopover
    placement="Left"
    contentHeight="80%"
    contentWidth="25%"
  >
    <path:content>
      <!-- xmlview that has search field in it -->
    </path:conent>
  </path:CustomPopover>
</core:FragmentDefinition>

Now, if I use this snippet to create a Popover, the event selectcontinues to emit for this search field.

2017-02-15 09: 53: 47.456659 Event triggered: 'select' on Element sap.m.SearchField #__ field0 - sap.ui.core.UIArea

This popover works fine in chrome state even after continuous emission of an event, but in Internet Explorer, it continues to render, so it cannot use it. How to fix it?

+4
source share
1 answer

, . < modal.

, popover. modal.

false. true, Popover ( ).

Demo

sap.ui.getCore().attachInit(() => sap.ui.xmlview({
  viewContent: `<mvc:View
    xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m"
    controllerName="MyController"
  >
    <Button
      class="sapUiTinyMargin"
      text="Open Popover"
      press=".onPress"
    >
      <dependents>
        <Popover id="myPopover"
          modal="{/modal}"
          title="Modal"
          contentWidth="10rem"
        >
          <HBox justifyContent="Center">
            <Switch state="{/modal}"/>
          </HBox>
        </Popover>
      </dependents>
    </Button>
  </mvc:View>`,
  controller: sap.ui.controller("MyController", {
    onPress: function(event) {
      this.byId("myPopover").openBy(event.getSource());
    },
  }),
  async: true,
}).loaded().then(view => sap.ui.require([
  "sap/ui/model/json/JSONModel",
], JSONModel => view.setModel(new JSONModel()).placeAt("content"))));
<script id="sap-ui-bootstrap"
  data-sap-ui-libs="sap.ui.core, sap.m"
  data-sap-ui-preload="async"
  data-sap-ui-theme="sap_belize"
  src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
></script><body id="content" class="sapUiBody"></body>

modal IE 11.

0

Source: https://habr.com/ru/post/1669775/

More articles:


All Articles