Fiori2.0学习笔记-dialog应用

dialog is means duihua in chinese.

sap.m.dialog also known as Pop-up components(弹出框组件).

For example, Loading Data,Comfirm,Warning…

Property
sap.m.BusyDialog : Wait
sap.m.Dialog:in common use and we can deal with something
sap.m.SelectDialog:make use of the drop-down box from the select component
sap.m.TableSelectDialog
sap.m.ViewSettingsDialog
sap.m.P13nDialog

Demo

<content>
    <Button text="showBusyDialog" press="showBusyDialog"></Button>
    <Button text="showSelectDialog" press="showSelectDialog"></Button>
</content>

    showBusyDialog: function(oEvent) {
            // instantiate dialog
            if (!this._dialog) {
                this._dialog = sap.ui.xmlfragment("richard.demo.dialogDialogDemoCase.view.BusyDialog", this);
                //Associated life cycle
                this.getView().addDependent(this._dialog);
            }

            // open dialog
            this._dialog.open();

            // simulate end of operation
            this._timeout = jQuery.sap.delayedCall(3000, this, function() {
                this._dialog.close();
            });

            //call dialog in view.
            // var oDialog = this.getView().byId("BusyDialog");
            // oDialog.open();

        onDialogClosed: function(oEvent) {
            jQuery.sap.clearDelayedCall(this._timeout);
            if (oEvent.getParameter("cancelPressed")) {
                MessageToast.show("The operation has been cancelled");
            } else {
                MessageToast.show("The operation has been completed");
            }
        }

If you want to get a simple loading ,you could to delect the property.

<core:FragmentDefinition
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
    <BusyDialog
        title="Loading Data"
        text="... now loading the data from a far away server"
        showCancelButton="true"
        close="onDialogClosed"/>
</core:FragmentDefinition>

sap.m.SelectDialog

<core:FragmentDefinition
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
    <SelectDialog
        class="sapUiSizeCompact"
        noDataText="No Products Found"
        title="Select Product"
        search="handleSearch"
        confirm="handleClose"
        items="{
            path: '/PurchaseOrderCollection'
        }" >
        <StandardListItem
        class="sapUiSizeCompact"
            title="{ID}"
            description="{Status}"
            iconDensityAware="false"
            iconInset="false"
            type="Active" />
    </SelectDialog>
</core:FragmentDefinition>

    showSelectDialog: function(oEvent) {
            if (!this._oDialog) {
                this._oDialog = sap.ui.xmlfragment("richard.demo.dialogDialogDemoCase.view.SelectDialog", this);
                this._oDialog.setModel(this.getView().getModel());
                this.getView().addDependent(this._dialog);
            }

            // Multi-select if required
            this._oDialog.setMultiSelect(false);

            // Remember selections if required
            this._oDialog.setRememberSelections(false);

            // clear the old search filter
            this._oDialog.getBinding("items").filter([]);
            //jQuery.sap.syncStyleClass("sapUiSizeCompact", this.getView(), this._oDialog);
            this._oDialog.open();
        }

    handleSearch: function(oEvent) {
            var sValue = oEvent.getParameter("value");
            var oFilter = new Filter("ID", sap.ui.model.FilterOperator.Contains, sValue);
            var oBinding = oEvent.getSource().getBinding("items");
            oBinding.filter([oFilter]);
        }

        handleClose: function(oEvent) {
            var aContexts = oEvent.getParameter("selectedContexts");
            //var aContexts = oEvent.getParameter("selectedItem");
            if (aContexts.length) {
                MessageToast.show("You have chosen " + aContexts.map(function(oContext) {
                    return oContext.getObject().ID;
                }).join(", "));
            }
            oEvent.getSource().getBinding("items").filter([]);
        }