Hi all,
I used extJs lib in my current project. It works fine. but when i tried to implement a simple logic in another page then it behavior is strange. Ext.onReady event only fire in Firefox.
My code of ASP.NET page is as follow.
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>ExtJs Popup</title>
</head>
<body>
<form id="frmMain" runat="server">
<asp:ScriptManager ID="PageScriptManager" runat="server"></asp:ScriptManager>
<div>
<asp:linkButton runat="Server" OnClientClick="return false;" id="showbtn">Cafe</asp:linkButton>
<input type="hidden" runat="server" value="1" id="hdnId" />
<div id="hello-win" class="x-hidden">
<div class="x-window-header">Contribute to Cafe</div>
<div class="x-window-body" >
<asp:UpdatePanel ID="pnlMain" runat="server">
<ContentTemplate>
<div id="divMsg" runat="server"></div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
</form>
</body>
</html>
<script type="text/javascript">
var win;
Ext.onReady(function(){
var button = Ext.get('showbtn');
var ele = Ext.get("x-tab");
button.on('click', function(){
var result = Ext.Ajax.request({
url: 'check.ashx',
params : {Id : document.getElementById('hdnId').value},
method: 'GET',
failure: function() { alert('error'); },
success: function ( result, request)
{
document.getElementById('divMsg').innerHTML = result.responseText;
if(!win){
win = new Ext.Window({
el:'hello-win',
layout:'fit',
width:500,
height:300,
closeAction:'hide',
plain: true,
buttons: [{
text: 'Close',
handler: function(){
win.hide();
}
}]
});
}
win.show(this);
},
});
});
});
function attachWindowContentsToForm()
{
var form1 = document.getElementById('frmMain');
var win1 = document.getElementById('hello-win');
form1.appendChild(win1);
}
</script>
Work fine in FF but don't even fire onReady event in IE, Opera
Reply With Quote