setXml: function(){
oXMLModel = new sap.ui.model.xml.XMLModel();
var sXML ="<res><SolutionsResponse><SolList><Solution><SupportedMobileDetails><SupportedMobileDetail><SupportedMobileDevice>Smartphone</SupportedMobileDevice><SupportedMobileOS>Blackberry</SupportedMobileOS><Version>6</Version><StatusDescription>Productive</StatusDescription><SupportedMobileURL>https://hxi-cust802.dev.sapbydesign.com/sap/cpa/ui/esdownloads/0194814131_0/Smartphone_Blackberry_2.0/SalesService.zip</SupportedMobileURL><SupportedMobileDeviceCode>2</SupportedMobileDeviceCode><SupportedMobileOSCode>4</SupportedMobileOSCode></SupportedMobileDetail></SupportedMobileDetails></Solution><Solution><SupportedMobileDetails><SupportedMobileDetail><SupportedMobileDevice>Tablet</SupportedMobileDevice><SupportedMobileOS>ios</SupportedMobileOS><Version>6</Version><StatusDescription>New</StatusDescription><SupportedMobileURL>https://hxi-cust802.dev.sapbydesign.com/sap/cpa/ui/esdownloads/0194814131_0/Smartphone_Blackberry_2.0/SalesService.zip</SupportedMobileURL><SupportedMobileDeviceCode>2</SupportedMobileDeviceCode><SupportedMobileOSCode>4</SupportedMobileOSCode></SupportedMobileDetail></SupportedMobileDetails></Solution><Solution><SupportedMobileDetails><SupportedMobileDetail><SupportedMobileDevice>Tablet</SupportedMobileDevice><SupportedMobileOS>ios</SupportedMobileOS><Version>6</Version><StatusDescription>New</StatusDescription><SupportedMobileURL>https://hxi-cust802.dev.sapbydesign.com/sap/cpa/ui/esdownloads/0194814131_0/Smartphone_Blackberry_2.0/SalesService.zip</SupportedMobileURL><SupportedMobileDeviceCode>2</SupportedMobileDeviceCode><SupportedMobileOSCode>4</SupportedMobileOSCode></SupportedMobileDetail><SupportedMobileDetail><SupportedMobileDevice>SmartPhone</SupportedMobileDevice><SupportedMobileOS>ios</SupportedMobileOS><Version>6</Version><StatusDescription>New</StatusDescription><SupportedMobileURL>https://hxi-cust802.dev.sapbydesign.com/sap/cpa/ui/esdownloads/0194814131_0/Smartphone_Blackberry_2.0/SalesService.zip</SupportedMobileURL><SupportedMobileDeviceCode>2</SupportedMobileDeviceCode><SupportedMobileOSCode>4</SupportedMobileOSCode></SupportedMobileDetail></SupportedMobileDetails></Solution></SolList></SolutionsResponse></res>";
this.oModel = sap.ui.getCore().getModel(this.oController.sModelId);
this.oModel.setXML(sXML);
sap.ui.getCore().byId('rr1').setModel(this.oModel);
},
var oSixthCell = new sap.ui.commons.layout.MatrixLayoutCell();
var omainLayout = new sap.ui.commons.layout.HorizontalLayout('main');
var oRowRepeater = new sap.ui.commons.RowRepeater("rr1");
var matrixRow, matrixCell, control;
var oRowTemplate = new sap.ui.commons.layout.MatrixLayout("template");
matrixRow = new sap.ui.commons.layout.MatrixLayoutRow();
control = new sap.ui.commons.Link({
press: function() {
control = new sap.ui.commons.Link({
press: function() {
control = new sap.ui.commons.Link({
press: function() {
control = new sap.ui.commons.Link();
control.bindProperty("text","type");
matrixCell = new sap.ui.commons.layout.MatrixLayoutCell();
matrixCell.addContent(control);
matrixRow.addCell(matrixCell);
}
});
control.bindProperty("text","version");
matrixCell = new sap.ui.commons.layout.MatrixLayoutCell();
matrixCell.addContent(control);
matrixRow.addCell(matrixCell);
}
});
control.bindProperty("text","os");
matrixCell = new sap.ui.commons.layout.MatrixLayoutCell();
matrixCell.addContent(control);
matrixRow.addCell(matrixCell);
}
});
control.bindProperty("text","/SupportedMobileDetail/SupportedMobileDevice");
matrixCell = new sap.ui.commons.layout.MatrixLayoutCell();
matrixCell.addContent(control);
matrixRow.addCell(matrixCell);
this.setXml();
var sXMl = this.oModel.getXML();
var sXMLOS = new sap.cp.core.util.XMLUtil(sXMl);
oVarXmlModelOS= new sap.ui.model.xml.XMLModel();
oVarXmlModelOS.setSizeLimit(5000);
oVarXmlModelOS.setXML(jQuery.sap.serializeXML(sXMLOS.Find('Solution')[0]));
omainLayout.setModel(oVarXmlModelOS);
oRowRepeater.bindRows("/", oRowTemplate);
omainLayout.addContent(oRowRepeater);
oSixthCell.addContent(omainLayout);
oDownloadTrialLayout.createRow(oSixthCell);
I'm creating a SAPUI5 application with XML data to be bind. I need some help in binding the XML to my structure.
Related
I need to add another style to an existing stylesheet. I created this style using the OpenXML Productivity Tools. Unfortunately I can't manage to add this style to the existing stylesheet. The stylesheet is always overwritten. Do I need to adjust the counts (borders, fills, etc)? Or is there a better way?
void AppendStylesToStylesheet(WorkbookStylesPart workbookStylesPart)
{
var styleSheet = workbookStylesPart.Stylesheet;
var fonts1 = new Fonts { Count = 1U, KnownFonts = true };
var font1 = new Font();
font1.Append(new FontSize { Val = 11D });
font1.Append(new Color { Theme = 1U });
font1.Append(new FontName { Val = "Calibri" });
font1.Append(new FontFamilyNumbering { Val = 2 });
font1.Append(new FontScheme { Val = FontSchemeValues.Minor });
fonts1.Append(font1);
var fills1 = new Fills { Count = 3U };
var fill1 = new Fill();
fill1.Append(new PatternFill { PatternType = PatternValues.None });
var fill2 = new Fill();
fill2.Append(new PatternFill { PatternType = PatternValues.Gray125 });
var fill3 = new Fill();
var patternFill3 = new PatternFill { PatternType = PatternValues.Solid };
patternFill3.Append(new ForegroundColor { Theme = 0U, Tint = -4.9989318521683403E-2D });
patternFill3.Append(new BackgroundColor { Indexed = 64U });
fill3.Append(patternFill3);
fills1.Append(fill1);
fills1.Append(fill2);
fills1.Append(fill3);
var borders1 = new Borders { Count = 2U };
var border1 = new Border();
var leftBorder1 = new LeftBorder();
var rightBorder1 = new RightBorder();
var topBorder1 = new TopBorder();
var bottomBorder1 = new BottomBorder();
var diagonalBorder1 = new DiagonalBorder();
border1.Append(leftBorder1);
border1.Append(rightBorder1);
border1.Append(topBorder1);
border1.Append(bottomBorder1);
border1.Append(diagonalBorder1);
var border2 = new Border();
var leftBorder2 = new LeftBorder();
var rightBorder2 = new RightBorder();
var topBorder2 = new TopBorder { Style = BorderStyleValues.Dotted };
topBorder2.Append(new Color { Theme = 0U, Tint = -0.24994659260841701D });
var bottomBorder2 = new BottomBorder { Style = BorderStyleValues.Dotted };
bottomBorder2.Append(new Color { Theme = 0U, Tint = -0.24994659260841701D });
var diagonalBorder2 = new DiagonalBorder();
border2.Append(leftBorder2);
border2.Append(rightBorder2);
border2.Append(topBorder2);
border2.Append(bottomBorder2);
border2.Append(diagonalBorder2);
borders1.Append(border1);
borders1.Append(border2);
var cellStyleFormats1 = new CellStyleFormats { Count = 1U };
cellStyleFormats1.Append(new CellFormat { NumberFormatId = 0U, FontId = 0U, FillId = 0U, BorderId = 0U });
var cellFormats1 = new CellFormats { Count = 3U };
var cellFormat2 = new CellFormat { NumberFormatId = 0U, FontId = 0U, FillId = 0U, BorderId = 0U, FormatId = 0U };
var cellFormat3 = new CellFormat { NumberFormatId = 14U, FontId = 0U, FillId = 2U, BorderId = 1U, FormatId = 0U, ApplyNumberFormat = true, ApplyFill = true, ApplyBorder = true, ApplyAlignment = true };
var alignment1 = new Alignment { Vertical = VerticalAlignmentValues.Center };
cellFormat3.Append(alignment1);
var cellFormat4 = new CellFormat { NumberFormatId = 0U, FontId = 0U, FillId = 0U, BorderId = 0U, FormatId = 0U, ApplyAlignment = true };
var alignment2 = new Alignment { Vertical = VerticalAlignmentValues.Center };
cellFormat4.Append(alignment2);
cellFormats1.Append(cellFormat2);
cellFormats1.Append(cellFormat3);
cellFormats1.Append(cellFormat4);
var cellStyles1 = new CellStyles { Count = 1U };
var cellStyle1 = new CellStyle { Name = "Standard", FormatId = 0U, BuiltinId = 0U };
cellStyles1.Append(cellStyle1);
var differentialFormats1 = new DifferentialFormats { Count = 0U };
var tableStyles1 = new TableStyles { Count = 0U, DefaultTableStyle = "TableStyleMedium2", DefaultPivotStyle = "PivotStyleLight16" };
var colors1 = new Colors();
var mruColors1 = new MruColors();
var color4 = new Color { Rgb = "FFFFFFCC" };
mruColors1.Append(color4);
colors1.Append(mruColors1);
var stylesheetExtensionList1 = new StylesheetExtensionList();
var stylesheetExtension1 = new StylesheetExtension { Uri = "{EB79DEF2-80B8-43e5-95BD-54CBDDF9020C}" };
stylesheetExtension1.AddNamespaceDeclaration("x14", "http://schemas.microsoft.com/office/spreadsheetml/2009/9/main");
var slicerStyles1 = new X14.SlicerStyles { DefaultSlicerStyle = "SlicerStyleLight1" };
stylesheetExtension1.Append(slicerStyles1);
var stylesheetExtension2 = new StylesheetExtension { Uri = "{9260A510-F301-46a8-8635-F512D64BE5F5}" };
stylesheetExtension2.AddNamespaceDeclaration("x15", "http://schemas.microsoft.com/office/spreadsheetml/2010/11/main");
var timelineStyles1 = new X15.TimelineStyles { DefaultTimelineStyle = "TimeSlicerStyleLight1" };
stylesheetExtension2.Append(timelineStyles1);
stylesheetExtensionList1.Append(stylesheetExtension1);
stylesheetExtensionList1.Append(stylesheetExtension2);
styleSheet.Append(fonts1);
styleSheet.Append(fills1);
styleSheet.Append(borders1);
styleSheet.Append(cellStyleFormats1);
styleSheet.Append(cellFormats1);
styleSheet.Append(cellStyles1);
styleSheet.Append(differentialFormats1);
styleSheet.Append(tableStyles1);
styleSheet.Append(colors1);
styleSheet.Append(stylesheetExtensionList1);
styleSheet.Save();
}
I wish to generate a custom dropdown filter, based on categories from a database.
How is this achieved?
In my example, this is (poorly) implemented with some hard coding and duplication.
var serviceOverlays = [
{name:"Cardiology", value:"cardiology"},
{name:"Opthamology", value:"opthamology"}
];
var oSelect = L.control({position : 'topright'});
oSelect.onAdd = function (map) {
var overlayParent = document.getElementById('new-parent'); // overlays div
var node = L.DomUtil.create('select', 'leaflet-control');
node.innerHTML = '<option value="cardiologist">Cardioligist</option><option value="opthamology">Opthamology</option>';
overlayParent.appendChild(node);
L.DomEvent.disableClickPropagation(node);
L.DomEvent.on(node,'change',function(e){
var select = e.target;
for(var name in serviceOverlays){
serviceOverlays[name].removeFrom(map);
}
serviceOverlays[select.value].addTo(map);
});
Fiddle
I created a Control for you:
L.Control.Select = L.Control.extend({
options: {
position : 'topright'
},
initialize(layers,options) {
L.setOptions(this,options);
this.layers = layers;
},
onAdd(map) {
this.overlayParent = L.DomUtil.create('div', 'leaflet-control select-control');
this.node = L.DomUtil.create('select', 'leaflet-control',this.overlayParent);
L.DomEvent.disableClickPropagation(this.node);
this.updateSelectOptions();
L.DomEvent.on(this.node,'change',(e)=>{
var select = e.target;
for(var value in this.layers){
this.layers[value].layer.removeFrom(map);
}
this.layers[select.value].layer.addTo(map);
});
return this.overlayParent;
},
updateSelectOptions(){
var options = "";
if(this.layers){
for(var value in this.layers){
var layer = this.layers[value];
options += '<option value="'+value+'">'+layer.name+'</option>';
}
}
this.node.innerHTML = options;
},
changeLayerData(layers){
this.layers = layers;
this.updateSelectOptions();
}
});
var oSelect = new L.Control.Select(serviceOverlays,{position : 'topright'}).addTo(map);
The data structure have to be:
var serviceOverlays = {
"cardiology": {name:"Cardiology", layer: cities},
"opthamology": {name:"Opthamology", layer: badCities}
};
Demo: https://jsfiddle.net/falkedesign/1rLntbo5/
You can also change the data dynamicl< with oSelect.changeLayerData(serviceOverlays2)
I am working on OSM using leaflet..I enable dragging:true on my destination marker as I need it to be draggable ,but while dragging marker my MAP also moves .Is there a way I can only move the marker.
$(document).ready(function()
{
homepg();
});
var cab_map = null;
function homepg()
{
var str = '';
var markers = new L.MarkerClusterGroup();
var lat = '19.068246';
var lng = '72.850638';
cab_map = ddmap.init('mapdivcab',[lat,lng],14);
ddmap.getDirection(13.039680,77.580214,13.040850,77.625532,cab_map,'lmenu');
}
getDirection: function(flat,flon,tlat,tlon,map,mapdv)
{
this.dirMap = map;
this.mapDiv = mapdv;
this.sourceLatLng = new L.LatLng(flat,flon);
this.targetLatLng = new L.LatLng(tlat,tlon);
if(this.fScript)
head.removeChild(fScript);
fScript = document.createElement('script');
fScript.setAttribute("type","text/javascript");
fScript.setAttribute("src", ddmap.serverUrl+"jsonp=ddmap.updateAddressFrom/nearbylocation/"+flat.toFixed(6).replace('.','')+"/"+flon.toFixed(6).replace('.','')+"/1?json_callback=%jsonp");
document.getElementsByTagName("head")[0].appendChild(fScript);
if(this.tScript)
head.removeChild(tScript);
tScript = document.createElement('script');
tScript.setAttribute("type","text/javascript");
tScript.setAttribute("src", ddmap.serverUrl+"jsonp=ddmap.updateAddressTo/nearbylocation/"+tlat.toFixed(6).replace('.','')+"/"+tlon.toFixed(6).replace('.','')+"/1?json_callback=%jsonp");
document.getElementsByTagName("head")[0].appendChild(tScript);
if(this.currentScript)
head.removeChild(currentScript);
currentScript = document.createElement('script');
currentScript.setAttribute("type","text/javascript");
currentScript.setAttribute("src", "viaroute?z=13&output=json&jsonp=ddmap.showRoute&loc="+flat+","+flon+"&loc="+tlat+","+tlon+"&instructions=true");
document.getElementsByTagName("head")[0].appendChild(currentScript);
}
showRoute: function(response) {
var geometry = this._decode(response.route_geometry, 6);
var route = new L.Polyline( [], {dashArray:""} );
route.setLatLngs( geometry );
var sIcon = L.icon({iconUrl:this.imageHost+"/images/marker-source.png",iconAnchor:[10,30],shadowUrl: this.imageHost+'/images/marker-shadow.png'});
var tIcon = L.icon({iconUrl:this.imageHost+"/images/marker-target.png",iconAnchor:[10,30],shadowUrl: this.imageHost+'/images/marker-shadow.png'});
mrkrSrc = L.marker(this.sourceLatLng, {icon: sIcon});
mrkrTgt = L.marker(this.targetLatLng, {icon: tIcon,draggable:'true'});
if(this.mainLayer)
this.dirMap.removeLayer(this.mainLayer);
this.mainLayer = L.layerGroup([mrkrSrc, mrkrTgt])
.addLayer(route)
.addTo(this.dirMap);
var bounds = new L.LatLngBounds(this.sourceLatLng, this.targetLatLng);
this.dirMap.fitBounds(bounds);
this.showRouteDesc(response,geometry);
//
mrkrTgt.on('drag', function(event){
var marker = event.target;
var dst = marker.getLatLng();
var src = mrkrSrc.getLatLng();
ddmap.getroute(src.lat,src.lng,dst.lat,dst.lng,cab_map,'lmenu');//instead of calling getDriection i m calling this function
});
//this function is same as getDirection but i have removed some code, thought that is not required and it was making 'drag event' rough and time taking
getroute: function(flat,flon,tlat,tlon,map,mapdv)
{
this.dirMap = map;
this.mapDiv = mapdv;
this.sourceLatLng = new L.LatLng(flat,flon);
this.targetLatLng = new L.LatLng(tlat,tlon);
if(this.currentScript)
head.removeChild(currentScript);
currentScript = document.createElement('script');
currentScript.setAttribute("type","text/javascript");
currentScript.setAttribute("src", "viaroute?z=13&output=json&jsonp=ddmap.showRoute&loc="+flat+","+flon+"&loc="+tlat+","+tlon+"&instructions=true");
document.getElementsByTagName("head")[0].appendChild(currentScript);
}
I am doing adding/delete of the panel section container in openui5. While deleting the selected panel container I can able to do it. But after the deletion of container and again adding the new container I am getting the error of "adding element with duplicate id txn_1". How to fix this issue?
I am using the below code:
var Iconadd = new sap.ui.commons.Button({ //add container code
text : "ADD",
width:"65px",
icon : "sap-icon://add",
press : function() {
var len=$('#panelcontainer .sapUiPanel').length;
//alert("len"+len);
Createnewtransaction(len+1);
//alert(""+len);
//var content=$("#panelcontainer").html();
//$("#panelcontainer").append(content);
//var length=$('#panelcontainer').length;
// alert(""+length);
}
});
Createnewtransaction(1);//onload defaultly one conatiner should show
function Createnewtransaction(len){ //panel code and delete container code
//alert("in"+len);
var oPanel3 = new sap.ui.commons.Panel("txn_"+len,{width: "100%", showCollapseIcon: false});
oPanel3.setAreaDesign(sap.ui.commons.enums.AreaDesign.Fill);
oPanel3.setBorderDesign(sap.ui.commons.enums.BorderDesign.None);
oPanel3.setTitle(new sap.ui.core.Title({text:"Transaction Details"}));
//oPanel3.setTitle(new sap.ui.core.Title({text:"Transaction Details"}));
var oMatrix3 = new sap.ui.commons.layout.MatrixLayout({ width: '600px', columns: 8,width:"auto"});
//oMatrix3.setWidths('150px', '200px','200px','170px','200px');
oMatrix3.setWidths('150px','200px','200px','170px','200px','210px');
oMatrix3.setLayoutFixed(true);
var oLabelmaterial = new sap.ui.commons.Label({text: 'Material:*'});
var oCustomserachmaterial = new sap.ui.commons.TextField({value: '', width: '88%'},{
enabled:true,
change:function(){
}
});
oLabelmaterial.setLabelFor(oCustomserachmaterial);
var oLabelinvoice = new sap.ui.commons.Label({text: 'Invoice Number:'});
var oLabelText = new sap.ui.commons.TextField({value: '', width: '100%'});
oLabelinvoice.setLabelFor(oLabelText);
var oLabelInvoicedate = new sap.ui.commons.Label({text: 'Invoice Date:*'});
// create a simple DatePicker
var oDatePicker1 = new sap.ui.commons.DatePicker('');
oDatePicker1.setWidth("170px");
// oDatePicker1.setYyyymmdd("20100101");
oDatePicker1.setLocale("en-US"); // Try with "de" or "fr" instead!
oDatePicker1.attachChange(
function(oEvent){
if(oEvent.getParameter("invalidValue")){
oEvent.oSource.setValueState(sap.ui.core.ValueState.Error);
}else{
oEvent.oSource.setValueState(sap.ui.core.ValueState.None);
}
}
);
// attach it to some element in the page
//oDatePicker1.placeAt("sample1");
//oMatrix3.createRow(oLabelmaterial,oCustomserachmaterial,oLabelinvoice,oLabelText,oLabelInvoicedate,oDatePicker1,oLabelcurrency,oCustomserachcurrency,oLabelinvoiceline,oLabelInvoicelinetext,oLabelShipmentdate,oDatePicker2,oLabelunits,oCustomserachunits,oLabelAgreement,oCustomserachagreementnumber);
oMatrix3.createRow(oLabelmaterial,oCustomserachmaterial,oLabelinvoice,oLabelText,oLabelInvoicedate,oDatePicker1);
var oLabelcurrency = new sap.ui.commons.Label({text: 'Currency:*'});
var oCustomserachcurrency = new sap.ui.commons.TextField({value: '', width: '88%'});
oLabelcurrency.setLabelFor(oCustomserachcurrency);
var oLabelinvoiceline = new sap.ui.commons.Label({text: 'Invoice Line Number:'});
var oLabelInvoicelinetext= new sap.ui.commons.TextField({value: '', width: '100%'});
oLabelinvoiceline.setLabelFor(oLabelInvoicelinetext);
var oLabelShipmentdate = new sap.ui.commons.Label({text: 'Shipment Date:'});
// create a simple DatePicker
var oDatePicker2 = new sap.ui.commons.DatePicker('');
oDatePicker2.setWidth("170px");
// oDatePicker1.setYyyymmdd("20100101");
oDatePicker2.setLocale("en-US"); // Try with "de" or "fr" instead!
oDatePicker2.attachChange(
function(oEvent){
if(oEvent.getParameter("invalidValue")){
oEvent.oSource.setValueState(sap.ui.core.ValueState.Error);
}else{
oEvent.oSource.setValueState(sap.ui.core.ValueState.None);
}
}
);
oMatrix3.createRow(oLabelcurrency,oCustomserachcurrency,oLabelinvoiceline,oLabelInvoicelinetext,oLabelShipmentdate,oDatePicker2);
var oImage = new sap.ui.commons.Image();
oImage.setSrc("icon:image/required_field_icon.png");
oImage.setAlt("alternative image text for image");
var oLabelunits = new sap.ui.commons.Label({text: 'Units:*'});
var oCustomserachunits= new sap.ui.commons.TextField({value: '', width: '88%'});
oLabelunits.setLabelFor(oCustomserachunits);
var oLabelAgreement = new sap.ui.commons.Label({text: 'Agreement Number:'});
var oLabelagreement = new sap.ui.commons.TextField({value: '', width: '100%'});
oLabelAgreement.setLabelFor(oLabelagreement);
//Create Search Field for Custom column search
/* var oCustomserachagreementnumber = new sap.ui.commons.SearchField("s9",{
enableListSuggest:false,
placeholder:"Search",
width:"170px",
serach:function(oEvent){
}
});*/
var oLabelnone = new sap.ui.commons.Label({text: ''});
var oLabelnone1 = new sap.ui.commons.Label({text: ''});
var deletebton=new sap.ui.commons.Button({
text:"Delete",
width:"70px",
icon:"sap-icon://delete",
//lite:true,
press:function(oEvent){
if(!oPanel3.getCollapsed()){
oPanel3.setCollapsed(false);
}else{
oPanel3.setCollapsed(false);
}
var len=$('#panelcontainer .sapUiPanel').length;
// var headlen=$('#panelcontainer .sapUiPanel .sapUiPanelHdr').length;
// alert(len);
var selected=oPanel3.getId();
// $('#panelcontainer .sapUiPanel').not( "#txn_1" ).remove();
if(len==1){
$("#"+selected).not("#txn_1").remove();
}else{
$("#"+selected).remove();
}
var splitdata=selected.split('_');
var delposition=parseInt(splitdata[1]);
// alert(delposition);
$('#panelcontainer .sapUiPanel').each(function(i, obj) {
//alert("i22"+i);
var i=i+1;
if(delposition >= i )
{
var newid=splitdata[0]+"_"+i;
$(this).attr("id", newid);
$(this).attr("data-sap-ui", newid);
$(this).attr("aria-labelledby",newid+"-title");
$(this).attr("aria-describedby",newid+"-acc");
}
});
$('#panelcontainer .sapUiPanel .sapUiPanelHdr').each(function(i, obj) {
//alert("i22"+i);
var i=i+1;
if(delposition >= i )
{
var newid=splitdata[0]+"_"+i;
$(this).attr("id",newid+"-hdr");
}
});
$('#panelcontainer .sapUiPanel .sapUiPanelHdr .sapUiPanelTitle').each(function(i, obj) {
//alert("i22"+i);
var i=i+1;
if(delposition >= i )
{
var newid=splitdata[0]+"_"+i;
$(this).attr("id",newid+"-title");
}
});
$('#panelcontainer .sapUiPanel .sapUiPanelHdr .sapUiPanelTb ').each(function(i, obj) {
//alert("i22"+i);
var i=i+1;
if(delposition >= i )
{
var newid=splitdata[0]+"_"+i;
$(this).attr("id",newid+"-tb");
}
});
$('#panelcontainer .sapUiPanel .sapUiPanelCont').each(function(i, obj) {
//alert("i22"+i);
var i=i+1;
if(delposition >= i )
{
var newid=splitdata[0]+"_"+i;
$(this).attr("id",newid+"-cont");
}
});
/*for(i;i<len;i++){
var newid=splitdata[0]+"_"+i;
var j = i+1;
var oldID = splitdata[0]+"_"+j;
$("#"+oldID).css({"border-color":"red","border-width":"1px","border-style":"solid"});
$("#"+selected).attr("id",newid);
}*/
//$(this).parent().remove();
// dispAlert() ;
}
}).addStyleClass("datacheck");
//deletebton.addStyleClass("deletedata");
//oPanel3.addButton(deletebton);
oPanel3.onAfterRendering = function() {
if (sap.ui.commons.Panel.prototype.onAfterRendering) {
sap.ui.commons.Panel.prototype.onAfterRendering.apply(this, arguments);
}
var $this = this.$();
var span = $this.find('.sapUiPanelIco');
span.detach();
$this.find('.sapUiPanelHdr').append(span);
};
oMatrix3.createRow(oLabelunits,oCustomserachunits,oLabelAgreement,oLabelagreement,oLabelnone,deletebton);
oPanel3.addContent(oMatrix3);
oPanel3.placeAt("panelcontainer");
}
It's quite clear that you get errors. SAPUI5 offers controls with a powerful API on top of jQuery, including DOM manipulation. If I understand your source code correctly your are manipulationg the DOM by yourself, but you should do this via the API. Please check the documentation for the Panel, there is a method to safely remove content. And please provide well formatted coding examples in future, this is just a mess and only are few people will be helping you through this mess.
Need to show a pop-up when user clicks on the line. Code as below but does not work:
var ClickLon;
var ClickLat;
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
defaultHandlerOptions: {
'single': true,
'double': false,
'pixelTolerance': 0,
'stopSingle': false,
'stopDouble': false
},
initialize: function(options) {
this.handlerOptions = OpenLayers.Util.extend(
{}, this.defaultHandlerOptions
);
OpenLayers.Control.prototype.initialize.apply(
this, arguments
);
this.handler = new OpenLayers.Handler.Click(
this, {
'click': this.trigger
}, this.handlerOptions
);
},
trigger: function(e) {
var lonlat = map.getLonLatFromPixel(e.xy);
ClickLon = lonlat.lon;
ClickLat = lonlat.lat;
}
});
function onPopupClose(evt) {
selectControl.unselect(selectedFeature);
}
function onFeatureSelect(feature) {
selectedFeature = feature;
id = feature.id;
alert(ClickLon);
var lonLat = new OpenLayers.LonLat(ClickLon, ClickLat).transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));
popup = new OpenLayers.Popup.FramedCloud("chicken",
lonLat,
null,
"<div style='font-size:.8em'>" +CableLineText_arr[id] +"</div>",
null, true, onPopupClose);
feature.popup = popup;
map.addPopup(popup);
}
function onFeatureUnselect(feature) {
map.removePopup(feature.popup);
feature.popup.destroy();
feature.popup = null;
}
...
var lineLayer = new OpenLayers.Layer.Vector("Line Layer");
map.addLayer(lineLayer);
map.addControl(new OpenLayers.Control.DrawFeature(lineLayer, OpenLayers.Handler.Path));
var click = new OpenLayers.Control.Click();
map.addControl(click);
click.activate();
selectControl = new OpenLayers.Control.SelectFeature(lineLayer,
{onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});
drawControls = {
polygon: new OpenLayers.Control.DrawFeature(lineLayer,
OpenLayers.Handler.Polygon),
select: selectControl
};
for(var key in drawControls) {
map.addControl(drawControls[key]);
}
Map projection is EPSG:4326.
Line drawing as:
var points = new Array(
new OpenLayers.Geometry.Point(47, 32.24),
new OpenLayers.Geometry.Point(45, 33),
new OpenLayers.Geometry.Point(49, 35)
);
var line = new OpenLayers.Geometry.LineString(points);
line.transform(new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913"));
var style = {
strokeColor: '#0000ff',
strokeOpacity: 0.5,
strokeWidth: 5
};
var lineFeature = new OpenLayers.Feature.Vector(line, null, style);
alert(lineFeature.id);
lineLayer.addFeatures([lineFeature]);
Trying to combine these two examples: http://openlayers.org/dev/examples/select-feature-openpopup.html and http://openlayers.org/dev/examples/click.html
I do not see the place where you activate your control.SelectFeature.