How come when the resource manager is placed inside the head it gets rendered to the form and placed inside the form it gets rendered to the head?
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title></title>
<ext:ResourceManager ID="testRM" runat="server"></ext:ResourceManager>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:Panel ID="testPanel" runat="server" Height="500" Width="500" Visible="true" Title="Hello?">
<Content>
Hello World!
</Content>
</ext:Panel>
</div>
</form>
</body>
</html>
OUTPUT:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1"><title>
</title></head>
<body>
<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTUwNDkwMDA0Mw9kFgICAw9kFgICAQ9kFgJmDxYCHgVjbGFzcwUIeC1oaWRkZW5kGAEFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYCBQZ0ZXN0Uk0FCXRlc3RQYW5lbHhTYnYpmBGhur7y+wSCGDuduKJY" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKGyPBDAp+S1ZsK6tNMkmJNkuuWIK74DVEfLI36iXI=" />
</div>
<div>
<div id="testPanel_Container">
<div id="testPanel_Content" class="x-hidden">
Hello World!
</div>
</div>
<link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all-embedded-css/ext.axd?v=36328" />
<link rel="stylesheet" type="text/css" href="/extjs/resources/css/xtheme-gray-embedded-css/ext.axd?v=36328" id="ext-theme" />
<script type="text/javascript" src="/extjs/adapter/ext/ext-base-js/ext.axd?v=36328"></script>
<script type="text/javascript" src="/extjs/ext-all-js/ext.axd?v=36328"></script>
<script type="text/javascript" src="/extnet/extnet-core-js/ext.axd?v=36328"></script>
<script type="text/javascript">
//<![CDATA[
Ext.net.ResourceMgr.init({id:"testRM",BLANK_IMAGE_URL:"/extjs/resources/images/gray/s-gif/ext.axd",aspForm:"form1",theme:"gray"});Ext.onReady(function(){Ext.QuickTips.init();new Ext.Panel({id:"testPanel",contentEl:"testPanel_Content",renderTo:"testPanel_Container",height:500,width:500,title:"Hello?"});});
//]]>
</script>
</div>
</form>
</body>
</html>
In this one the rm is in the form but gets rendered to the head:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ExtNetIE8Bug._Default" %>
<!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 id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="testRM" runat="server"></ext:ResourceManager>
<ext:Panel ID="testPanel" runat="server" Height="500" Width="500" Visible="true" Title="Hello?">
<Content>
Hello World!
</Content>
</ext:Panel>
</div>
</form>
</body>
</html>
<!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 id="Head1">
<link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all-embedded-css/ext.axd?v=36328" />
<link rel="stylesheet" type="text/css" href="/extjs/resources/css/xtheme-gray-embedded-css/ext.axd?v=36328" id="ext-theme" />
<title>
</title>
<script type="text/javascript" src="/extjs/adapter/ext/ext-base-js/ext.axd?v=36328"></script>
<script type="text/javascript" src="/extjs/ext-all-js/ext.axd?v=36328"></script>
<script type="text/javascript" src="/extnet/extnet-core-js/ext.axd?v=36328"></script>
<script type="text/javascript">
//<![CDATA[
Ext.net.ResourceMgr.init({id:"testRM",BLANK_IMAGE_URL:"/extjs/resources/images/gray/s-gif/ext.axd",aspForm:"form1",theme:"gray"});Ext.onReady(function(){Ext.QuickTips.init();new Ext.Panel({id:"testPanel",contentEl:"testPanel_Content",renderTo:"testPanel_Container",height:500,width:500,title:"Hello?"});});
//]]>
</script>
</head>
<body>
<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJLTc0NDg4NDk3D2QWAgIDD2QWAgIDD2QWAmYPFgIeBWNsYXNzBQh4LWhpZGRlbmQYAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgIFBnRlc3RSTQUJdGVzdFBhbmVsm1YSEkAoD1BQFW2KDBPY8f4JpGY=" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgLqi/3vAgKfktWbConA1HXAeVZHDd7zyAo41YuphB3Z" />
</div>
<div>
<div id="testPanel_Container">
<div id="testPanel_Content" class="x-hidden">
Hello World!
</div>
</div>
</div>
</form>
</body>
</html>