Skip to Content
0
Former Member
Jul 03, 2016 at 10:16 AM

Tile to display when the button is selected using function

29 Views

Hi Everyone,

i have a button when i select, it needs to read the auto selected value and populate a tile with content.

For some reason below code is not working, any help.

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>

<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"

id="sap-ui-bootstrap"

data-sap-ui-libs="sap.ui.commons,sap.ui.ux3,sap.ui.table, sap.m, sap.suite.ui.commons"

data-sap-ui-theme="sap_bluecrystal">

</script>

<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

<script src="http://dl.dropboxusercontent.com/u/15208254/stackoverflow/jquery.jgfeed.js"></script>

<style type="text/css">

.sapMStdTileNumS {

font-size: 1rem;

color:green;

margin-top: -0.125rem;

}

.sapMStdTileInfo {

white-space: nowrap;

overflow: hidden;

text-overflow: ellipsis;

text-align: start;

font-size: 0.8rem;

color:red;

margin-top: 2rem;

}

</style>

<script type="text/javascript">

jQuery.sap.require("sap.ui.core.IconPool");

var app = new sap.m.App();

var page = new sap.m.Page({});

page.setEnableScrolling(false);

app.setInitialPage(page.getId());

page.setShowHeader(true);

jQuery.sap.require("sap.ui.model.json.JSONModel");

var oModel7 = new sap.ui.model.json.JSONModel();

oModel7.loadData("http://ZZZZ/AtrView_Odata/CustomerInfo.xsodata/CustomerCollecion/?$format=json");

var oAuto7 = new sap.ui.commons.AutoComplete({

tooltip: "Enter a name",

maxPopupItems: 20,

displaySecondaryValues: true,

width : '500px',

semanticColor: sap.ui.commons.TextViewColor.Positive,

items: {

path: "/d/results/",

template: new sap.ui.core.ListItem({text:"{KUNNR}", additionalText: "{NAME1}" })

},

//liveChange : function(oEvent){

// sap.ui.getCore().getControl("TextView").setText(oEvent.getParameter("liveValue"));

//}

});

oModel7.setSizeLimit(15000);

oAuto7.setModel(oModel7);

//Define a custom filter

oAuto7.setFilterFunction(function(sValue, oItem){

return jQuery.sap.startsWithIgnoreCase(oItem.getText(), sValue) || jQuery.sap.startsWithIgnoreCase(oItem.getAdditionalText(), sValue);

});

var oNameInput = new sap.m.Input({placeholder : "Enter Name of SCN User"});

var oButtonDisplay = new sap.m.Button("display", {

type: sap.m.ButtonType.Default,

text: "Display",

icon: sap.ui.core.IconPool.getIconURI("display"),

enabled: true,

press : showData

});

var oButtonReset = new sap.m.Button("refresh", {

type: sap.m.ButtonType.Default,

text: "Refresh",

icon: sap.ui.core.IconPool.getIconURI("refresh"),

enabled: true,

press : resetData

});

app.addPage(page);

page.addContent(oAuto7);

// page.addContent(oNameInput);

page.addContent(oButtonDisplay);

page.addContent(oButtonReset);

app.placeAt('content');

function handlePress(oEvent) {

window.open(oEvent.oSource.getActiveIcon(), "_blank");

}

function showData(oEvent) {

if (!oAuto7.getValue()) {

jQuery.sap.require("sap.m.MessageBox");

sap.m.MessageBox.alert("Complete your input first.");

return;

}

var CustomerNumber = oAuto7.getValue();

console.log(CustomerNumber);

var oTileContainer = new sap.m.TileContainer({

tiles : [

new sap.m.StandardTile({

icon : "sap-icon://play",

title : "Customer NUmber",

number : CustomerNumber,

press : function() {

oController.nav.to("AfoStart");

}

})

],

});

page.addContent(oTileContainer);

}

function resetData(oEvent) {

oTileContainer.destroyTiles();

// page.setTitle();

oNameInput.setValue();

}

</script>

<script>

sap.ui.localResources("tile3");

var app = new sap.m.App({initialPage:"idTilefromInput1"});

var page = sap.ui.view({id:"idTilefromInput1", viewName:"tile3.TilefromInput", type:sap.ui.core.mvc.ViewType.HTML});

app.addPage(page);

app.placeAt("content");

</script>

</head>

<body class="sapUiBody" role="application">

<div id="content"></div>

</body>

</html>