May 23, 2012, 9:44 PM
[CLOSED] Create a textfield dynamically
Hi,
I am trying to create a textfield under each fileuploadfield that I create dynamically by clicking on the "Add" button, similar to the "Description" field (id: txtFileDescription). However, I am unable to get the textfield to appear below the fileuploadfield. Could you please advise what i may be missing? This is my sample code below:
Ravi Swaminathan
I am trying to create a textfield under each fileuploadfield that I create dynamically by clicking on the "Add" button, similar to the "Description" field (id: txtFileDescription). However, I am unable to get the textfield to appear below the fileuploadfield. Could you please advise what i may be missing? This is my sample code below:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="FileUpload2.aspx.vb" Inherits="EXTTabs.FileUpload2" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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">
<style type="text/css">
.flupd-height
{
height: 13px !important;
padding-bottom: 5px !important;
}
.cntnr-pad
{
padding-bottom: 5px !important;
}
.instructions
{ margin-top : 70px;
padding-bottom: 30px;
font-size: 110%;
font-weight: bold;
color: #000000;
text-align: center;
}
</style>
<title>Ext.Net Example</title>
</head>
<body>
<form id="Form1" runat="server" enctype="multipart/form-data" method="post">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<div class="instructions">Please select a file to upload. For more files click on Add and then Upload all files at once</div>
<ext:Viewport ID="Viewport1" runat="server" Layout="HBoxLayout">
<LayoutConfig>
<ext:HBoxLayoutConfig Pack="Center" Align="Stretch" />
</LayoutConfig>
<Items>
<ext:Container ID="Container1" runat="server" Layout="VBoxLayout">
<LayoutConfig>
<ext:VBoxLayoutConfig Pack="Start" />
</LayoutConfig>
<Items>
<ext:Container ID="Container2" runat="server">
<LayoutConfig>
<ext:TableLayoutConfig Columns="1" />
</LayoutConfig>
<Items>
<ext:FormPanel ID="FormPanel1" runat="server" Region="Center" Width="500" AutoHeight="true">
<Items>
<ext:CompositeField ID="CompositeField1" runat="server" AnchorHorizontal="95%">
<Items>
<ext:FileUploadField ID="FileUploadField1" Cls="flupd-height" runat="server" Flex="1" />
<ext:Button ID="Button1" runat="server" Width="45" Text="Add">
<Listeners>
<Click Handler="FormPanel1.addAndDoLayout({
xtype : 'container',
layout : 'hbox',
anchor : '90%',
cls : 'cntnr-pad',
items : [{
xtype: 'fileuploadfield',
flex : 1,
cls : 'flupd-height'
}, {
xtype: 'button',
text: 'Remove',
listeners: {
click: {
fn: function (btn) {
var ct = btn.ownerCt,
formPanel = ct.ownerCt;
formPanel.remove(ct);
}
}
}
}]
},
{
xtype: 'container',
layout: 'auto',
items : [
new Ext.form.TextField({
xtype: 'textfield',
fieldlabel: 'Description'
})
]
});" />
</Listeners>
</ext:Button>
</Items>
</ext:CompositeField>
<ext:TextField ID="txtFileDescription" runat="server" Width="250" AllowBlank="false" BlankText="Please enter a file description" FieldLabel="Description" />
</Items>
</ext:FormPanel>
<ext:FormPanel ID="FormPanel2" Layout="FitLayout" runat="server" Width="500" Border="false">
<Items>
<ext:Button ID="btnUpload" runat="server" Text="UpLoad">
</ext:Button>
</Items>
</ext:FormPanel>
</Items>
</ext:Container>
</Items>
</ext:Container>
</Items>
</ext:Viewport>
</form>
</body>
</html>
ThanksRavi Swaminathan
Last edited by Daniil; May 24, 2012 at 9:34 PM.
Reason: [CLOSED]