PDA

View Full Version : Use of same HTML 'id' tag twice in the panels makes the content to disappear



Brightwin
7 Sep 2011, 1:21 AM
Hi,

I have created a panel with the static content being set using the property contentEl: 'content', where in the 'content' is created using 'id' tag in HTML . I also have created the overlay on tap of that panel and set the same static content id for the ovelray, But as the result , the content in the parent panel disappear as soon as the overlay is launched.

code used is:


index.html:
<!DOCTYPE html>
<html>
.....
.....
<div style="display: none;">
<div id="cell1_content">
<img class="imageClass" src="res/sencha.jpg" alt="spaceshuttle" height="150" width="150" />

<h1 class="headlines">Sencha touch </h1>
<p class="summary">Sencha Touch is a JavaScript UI Framework specifically built for Mobile Web. It can be used by Web developers to develop user interface for mobile web applications that look and feel like native applications on supported mobile devices. It is completely based on web standards like HTML5, CSS3 and JavaScript..</p>
</div>
</body>
</html>


main.js:


var rootContainer;

Ext.setup({
onReady: function() {
rootContainer = new Ext.Panel({
fullscreen: true,
contentEl:'cell1_content',
cls:'cell1'
});
rootContainer.addListener({
body: {
tap: function () {
var overlay = new Ext.Panel({
floating: true,
modal: true,
centered: false,
width: Ext.is.Phone ? 450 : 400,
height: Ext.is.Phone ? 280 : 400,
styleHtmlContent: true,
scroll: 'vertical',
contentEl: 'cell1_content',
cls: 'htmlcontent'
});
overlay.setCentered(true);
//overlayTb.setTitle('Centered Overlay');
overlay.show();
}
}

})
}
});






Is there any fix for this? Or else I have to make n number of different id tags with he same content to place in the main panel and in its overlay.

Thanks.

Regards,
Brightwin