Oct 13, 2010, 12:09 PM
User control's java script is not getting rendered
Hi,
I have used Extjs TabPanel container & in each tab I used User control(Which contains Grid panel). The loading of user controls takes place at the design time but the databinding with the grids(user control) takes place on tabchanged.
In gridpanel(User control) i used ImageCommand which calls the Javascript fucntions.
On tab changed the data is getting Binded with the GridPanel(UserControl). But when i try to click on the Icon which is present in ImageCommand, the JavaScript funciton is not getting called.
I have seen the ViewSource of that page but that Javascript is not getting rendered.
For reference the code is
User Control ASCX page code :-
UserControl .CS file code :
Web Page .CS code : -
I have used Extjs TabPanel container & in each tab I used User control(Which contains Grid panel). The loading of user controls takes place at the design time but the databinding with the grids(user control) takes place on tabchanged.
In gridpanel(User control) i used ImageCommand which calls the Javascript fucntions.
On tab changed the data is getting Binded with the GridPanel(UserControl). But when i try to click on the Icon which is present in ImageCommand, the JavaScript funciton is not getting called.
I have seen the ViewSource of that page but that Javascript is not getting rendered.
For reference the code is
User Control ASCX page code :-
<script language="javascript" type="text/javascript">
function EditClick(command,data)
{
if(command == 'Delete')
{
confirm('Are you sure u want to delete?');
return false;
}
}
</script>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td>
<ext:Store ID="StoreAddress" runat="server" RefreshAfterSaving="None" OnRefreshData="MyData_Refresh">
<Reader>
<ext:ArrayReader ReaderID="company">
<Fields>
<ext:RecordField Name="AddressType" />
<ext:RecordField Name="Address1" />
<ext:RecordField Name="Address2" />
<ext:RecordField Name="Address3" />
<ext:RecordField Name="City" />
<ext:RecordField Name="State" />
<ext:RecordField Name="Address4" />
<ext:RecordField Name="Pincode" />
<ext:RecordField Name="Region" />
<ext:RecordField Name="Country" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
<ext:GridPanel ID="grdAddress" runat="server" Height="215" StoreID="StoreAddress"
StripeRows="true" AutoWidth="true" Border="False" TrackMouseOver="True">
<ColumnModel ID="ColumnModel5" runat="server">
<Columns>
<ext:Column ColumnID="AddressType" DataIndex="AddressType" Header="Address Type"
Sortable="true" Width="120">
</ext:Column>
<ext:Column DataIndex="Address1" Header="Address1" Sortable="true" Width="165">
</ext:Column>
<ext:Column DataIndex="Address2" Header="Address2" Sortable="true" Width="150">
</ext:Column>
<ext:Column DataIndex="Address3" Header="Address3" Sortable="true" Width="150">
</ext:Column>
<ext:Column DataIndex="City" Header="City" Sortable="true" Width="120">
</ext:Column>
<ext:Column DataIndex="State" Header="State" Sortable="true" Width="120">
</ext:Column>
<ext:ImageCommandColumn Width="60px" DataIndex="Function">
<Commands>
<ext:ImageCommand CommandName="EditAddress" Icon="TableEdit">
<ToolTip Text="Edit" />
</ext:ImageCommand>
<ext:ImageCommand CommandName="Delete" Icon="Delete">
<ToolTip Text="Delete" />
</ext:ImageCommand>
</Commands>
</ext:ImageCommandColumn>
</Columns>
</ColumnModel>
<Listeners>
<Command Handler="EditClick(command, record.data);" />
</Listeners>
<LoadMask ShowMask="true" />
<BottomBar>
<ext:PagingToolbar ID="PagingToolBar5" runat="server" PageSize="6" />
</BottomBar>
</ext:GridPanel>
</td>
</tr>
</table>UserControl .CS file code :
protected void Page_Load(object sender, EventArgs e)
{
}
public void BindAddressData()
{
StoreAddress.DataSource = AddressData;
StoreAddress.DataBind();
}
private object[] AddressData
{
get
{
DateTime now = DateTime.Now;
return new object[]
{
new object[] { "Type1", "ergsdertegd","cvbxcvhfgh","fsdhgfghfhtyu","Mumbai","Maharashtra","asdfsdf","45645456","Vidharbha","woeirwoe"},
new object[] { "Type2", "hjkjhouiou","cvbcxvbhgf","hjkljkluij","Delhi","U.P.","asdfsdf","9879879","U.P.","woeirwoe"},
new object[] { "Type3", "hjyuytuj","fghrtyrty","cvcxvdgf","Nagpur","Maharashtra","asdfsdf","2343545677","Vidharbha","uiouih"}
};
}
}
protected void MyData_Refresh(object sender, StoreRefreshDataEventArgs e)
{
this.BindAddressData();
}<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager2" runat="server">
</ext:ScriptManager>
<asp:ScriptManager runat="server" ID="script">
</asp:ScriptManager>
<div>
<div>
<asp:UpdatePanel ID="main" runat="server">
<ContentTemplate>
<ext:TabPanel ID="tabContainer1" runat="server" ActiveTabIndex="0" Height="308px"
OnTabChanged="TbPnlSupplierMaster_TabChanged" AutoPostBack="true" BodyBorder="true"
Border="true" EnableTabScroll="True">
<Tabs>
<ext:Tab ID="firstTab" runat="server">
<Body>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<ext:Label ID="Label1" runat="server" Text="Hi I am on First Tab">
</ext:Label>
</ContentTemplate>
</asp:UpdatePanel>
</Body>
</ext:Tab>
<ext:Tab ID="SecondTab" runat="server">
<Body>
<asp:UpdatePanel ID="updt" runat="server">
<ContentTemplate>
<Add:AddGrid ID="grdId" runat="server" />
<ext:Label ID="Label2" runat="server" Text="Hi I am on Second Tab">
</ext:Label>
</ContentTemplate>
</asp:UpdatePanel>
</Body>
</ext:Tab>
</Tabs>
</ext:TabPanel>
</ContentTemplate>
</asp:UpdatePanel>
<%--<ajaxToolkit:TabContainer ID="tabContainer1" runat="server" OnClientActiveTabChanged="loadTabPanel"
ActiveTabIndex="0">
<ajaxToolkit:TabPanel ID="tabPanel_0" runat="server">
<HeaderTemplate>
<asp:Label ID="lblHeader0" runat="server" Text="Doors" ForeColor="Crimson"></asp:Label>
</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="updatePanel_0" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="TabButton0" runat="server" OnClick="TabButton_Click" Style="display: none;" />
<asp:Panel ID="TabContent0" runat="server">
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="tabPanel_1" runat="server">
<HeaderTemplate>
<asp:Label ID="lblHeader1" runat="server" Text="CardHolders" ForeColor="Crimson"></asp:Label>
</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="updatePanel_1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<Add:AddGrid ID="grdId" runat="server" />
<asp:Button ID="TabButton1" runat="server" OnClick="TabButton_Click" Style="display: none;" />
<asp:Panel ID="TabContent1" runat="server" Visible="false">
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>--%>
</div>
</div>
</form>Web Page .CS code : -
protected void Page_Load(object sender, EventArgs e)
{
}
protected void TbPnlSupplierMaster_TabChanged(object sender, EventArgs e)
{
if (tabContainer1.ActiveTabIndex == 1)
{
grdId.BindAddressData();
}
}
Last edited by geoffrey.mcgill; Oct 20, 2010 at 3:38 PM.
Reason: please use [CODE] tags
Originally Posted by pooja
