PDA

View Full Version : History management not working in Iframe Panel



DineshGudikandula
18 Jan 2013, 10:02 AM
Hi All......

In my application,Under one panel i have created two panels, one is simple panel which contains the js code and the other panel is an Iframe where by updating the panel content with js code the O/P of the corresponding JS file is showing

I want to execute one History management example. First time successfully able to run the app but clicking on the Back button of the Browser the previous O/p is not coming but the url in the browser is changing to the previous O/P one.How can is get the preview in Iframe While click on Browser preview button.

See the Attached Image:

41374


Thanks in advance...........

existdissolve
18 Jan 2013, 1:46 PM
Can you post some code?

DineshGudikandula
18 Jan 2013, 8:39 PM
Hi existdissolve...

This is my sample code...


Ext.define('ST.view.PlaygroundPanel', {
extend: 'Ext.panel.Panel',
alias: 'widget.playgroundpanel',

requires: ['ST.view.CodeEditor',
'ST.view.Preview',
'ST.view.Toolbar'],


initComponent: function() {
var tbar = Ext.create('ST.view.Toolbar',{});

this.layout = 'border';
this.tbar = tbar;
this.items = [{
region: 'west',
width: 500,
split: true,
xtype: 'tabpanel',
activeTab : 2,
items :[
{
title : 'JS',
xtype : 'codeeditor'
}]

}, {
region: 'center',
xtype: 'preview',
id: 'preview',
}];

this.callParent();
},

showCode: function( model ) {

if (Ext.isEmpty(model) || Ext.isEmpty(model.code)) {
return;
}

var tabPanel = Ext.ComponentQuery.query('playgroundpanel tabpanel')[0];
tabPanel.setActiveTab(2);
Ext.ComponentQuery.query('codeeditor')[2].setValue(model.code);

//select the code, if any
if (!Ext.isEmpty(model.highlight)) {


var ed = Ext.ComponentQuery.query('codeeditor')[2];
var str = new String(model.highlight);
var sels = str.split(',');
for ( var i = 0; i < sels.length; i++) {
var range = sels[i].split('-');
var start = range[0] - 1;
var end = range[1];


// if no range is defined
if (Ext.isEmpty(end)) {
end = start + 1;
}


for ( var j = start; j < end; j++) {
ed.highlightLine(j);
}
}
}

// Show the preview by default when topic is selected in Tutorial list.
this.fireEvent('runcode');

},
resetTabs : function( ) {

var tabPanel = Ext.ComponentQuery.query('playgroundpanel tabpanel')[0];
var code = Ext.ComponentQuery.query('codeeditor');

for (var i=0; i<2; i++ ){

tabPanel.setActiveTab(i);
code[i].setValue('');
}
},

readFile : function(url, tab){

if( url && (url.length > 0) )
{
Ext.Ajax.request({

url : url,
method : "GET",

success : function( response, request ) {

var abc = response.responseText;
var tabPanel = Ext.ComponentQuery.query('playgroundpanel tabpanel')[0];

if ( tab ){

var codeeditor = Ext.ComponentQuery.query('codeeditor')[0];
tabPanel.setActiveTab(0);
codeeditor.setValue(abc);
} else {

var codeeditor = Ext.ComponentQuery.query('codeeditor')[1];
tabPanel.setActiveTab(1);
codeeditor.setValue(abc);
}

Ext.ComponentQuery.query('playgroundpanel')[0].fireEvent('runcode');
tabPanel.setActiveTab(2);
},
failure : function( response, request ) {
console.log("failed -- response: "+response.responseText);
}
});
}

}
});


Ext.define('ST.view.Preview' ,{
extend: 'Ext.ux.SimpleIFrame',
alias : 'widget.preview',

title : 'Preview'
});







Plz it's argent....