putting drop down on page in proper place - asp.net

i am designing Daily Attendance System. I have designed a page where Employer can put date range FROM--TO to find attendance of some worker for particular date range now i have been told to put NAME field too like an employer can search by date range but even for particular worker in particular date range. Now i am confused about design that where ti is best to put Name Drop DOwn List, which position on page sounds great for it which will make it better looking.
Interface:

You can try this.
<table>
<tr>
<td colspan="4">
Search By
</td>
</tr>
<tr>
<td>
Student Name :
</td>
<td colspan="3">
<asp:DropDownList ID="ddlStudentName" Width="320px" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
From Date :
</td>
<td>
<asp:TextBox ID="txtFromDate" runat="server" CssClass="datepicker" onkeypress="return false;"
Width="120px"></asp:TextBox>
</td>
<td style="width: 70px;">
To Date :
</td>
<td>
<asp:TextBox ID="txtToDate" runat="server" CssClass="datepicker" onkeypress="return false;"
Width="120px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
</td>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</td>
<td style="width: 70px;">
</td>
<td>
</td>
</tr>
</table>

Stack vertically with a two column three row layout. Labels on the left, right justified.

Related

Extending Boundfield

All,
I have been looking thru countless articles and I haven't really found a solution that will work. What I am looking to do is extent the BoundField to allow additional properties to be set that will be passed into the html. Here is what I would like it to look like:
<asp:Gridview id="theGV" runat="server" AutoGenerateColumns="false">
<custom:AdvancedBoundField HeaderText="Status" DataField="Status" htmlProperty="Something" />
<custom:AdvancedBoundField HeaderText="Name" DataField="Name" htmlProperty="Goes" />
<custom:AdvancedBoundField HeaderText="Average" DataField="Count"/>
<custom:AdvancedBoundField HeaderText="Count" DataField="Count" htmlProperty="Here" />
</asp:GridView>
and it would output something like:
<table>
<tr>
<td htmlProperty="Something">
Status
</td>
<td htmlProperty="Goes">
Name
</td>
<td>
Average
</td>
<td htmlProperty="Here">
Count
</td>
</tr>
<tr>
<td htmlProperty="Something">
Active
</td>
<td htmlProperty="Goes">
Nick
</td>
<td>
3
</td>
<td htmlProperty="Here">
14
</td>
</tr>
<tr>
<td htmlProperty="Something">
Inactive
</td>
<td htmlProperty="Goes">
Sam
</td>
<td>
123
</td>
<td htmlProperty="Here">
45
</td>
</tr>
</table>
any suggestions???

Adding more than 1 column to ListView (ASP.NET)

I am creating a webpage that is listing the names of places using ASP.NET. I am using a data source to read the data from a database file. The list view is displaying all the data in one column. What I am trying to do is add 7 rows of data and then as soon as the 7th row has been added, add another column, and then continue writing the data in the new created column. Here is my code:
<asp:ListView runat="server" DataSourceID="cwDataSource">
<ItemTemplate>
<tr style="">
<td>
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
</td>
<td>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</td>
<td>
VIEW STORE PAGE
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table runat="server">
<tr>
<td>
&nbsp
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr runat="server">
<td runat="server">
<table ID="itemPlaceholderContainer" runat="server" border="0" style="">
<tr runat="server" style="">
<td>COLUMN #</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr ID="itemPlaceholder" runat="server">
</tr>
</table>
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
</table>
</LayoutTemplate>
</asp:ListView>
Example of what the output should look like (The 'VIEW STORE PAGE' is just a link):
COLUMN 1 COLUMN 2
A.ADDED VIEW STORE PAGE H.ADDED VIEW STORE PAGE
B.ADDED VIEW STORE PAGE I.ADDED VIEW STORE PAGE
C.ADDED VIEW STORE PAGE J.ADDED VIEW STORE PAGE
D.ADDED VIEW STORE PAGE K.ADDED VIEW STORE PAGE
E.ADDED VIEW STORE PAGE L.ADDED VIEW STORE PAGE
F.ADDED VIEW STORE PAGE M.ADDED VIEW STORE PAGE
G.ADDED VIEW STORE PAGE N.ADDED VIEW STORE PAGE
Any help would be appreciated.
I got it working:
<asp:DataList ID="cwDataList" runat="server" DataSourceID="cwDataSource" RepeatDirection=Vertical RepeatColumns=2 style="text-align: center">
<ItemTemplate>
<table style="width: 500px;">
<tr style="">
<td align="left" style="width: 250px; height: 18px">
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
</td>
<td align="left" style="width: 250px; height: 18px">
VIEW STORE PAGE
</td>
</tr>
</table>
</ItemTemplate>
</asp:DataList>

Styling uneditable-input checkbox and textbox

I'm making a login form within a table but I'm having a hard time formatting everything just the way I want to (never mind the left margin of the table, is just messed up on paint).
I want to make it look something like this:
However it currently looks like this:
The whole table is inside a div called "span54".
The checkbox "box" currently has 50px width (I want it like that), however this also affects the width of the textboxes.
How can I differentiate textboxes within that div?
The current CSS code:
checkbox (inspected checkox)
textbox (inspected textbox)
table code
<table class="logintable">
<tr>
<th colspan="2" rowspan="1">Login</th>
</tr>
<tr>
<td class="creds"><asp:label id="user" runat="server" text="User:" /></td>
<td colspan="1" rowspan="1"><input id="UserNameTextBox" type="text" runat="server" /></td>
<td colspan="1" rowspan="1"><asp:RequiredFieldValidator ID="vUserName" ControlToValidate="UserNameTextBox" Display="Static" ErrorMessage="Username Inválido" runat="server" /></td>
</tr>
<tr>
<td class="creds"><asp:label id="pass" runat="server" text="Password:" /></td>
<td colspan="1" rowspan="1"><input id="PasswordTextBox" type="password" runat="server" /></td>
<td colspan="1" rowspan="1"><asp:RequiredFieldValidator ID="vUserPass" ControlToValidate="PasswordTextBox" Display="Static" ErrorMessage="Password Inválida" runat="server" /></td>
</tr>
<tr>
<td colspan="3" rowspan="1"><asp:Button ID="btnlogin" runat="server" Text="Login" Class="btn-login" onclick="LoginButton_Click" /><asp:CheckBox id="RemPassword" cssclass="checkbox" runat="server" autopostback="false" text="Lembrar-me"/></td>
</tr>
<tr>
<td><asp:Label id="MsgLabel" runat="server" /></td>
</tr>
</table>
Edit file dq.css, near line 336 change width:50px; to width:160px;

Connect Text Box to Table

I'm new in ASP.net and started my first Website Project. I want to connect the text box to my table which is "Details" please see the code below:
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<p class="style2">
<br />
DETAILS FORMS</p>
<p>
<table style="width: 100%; height: 117px;">
<tr>
<td class="style4">
<asp:Label ID="Label1" runat="server" Text="ID :"></asp:Label>
</td>
<td class="style3">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
<td class="style3">
</td>
</tr>
<tr>
<td class="style5">
<asp:Label ID="Label2" runat="server" Text="Date Recieved :"></asp:Label>
</td>
<td>
<asp:TextBox ID="DRInput" runat="server"></asp:TextBox>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
<asp:Label ID="Label3" runat="server" Text="Date Commision :"></asp:Label>
</td>
<td>
<asp:TextBox ID="DCINput" runat="server"></asp:TextBox>
</td>
<td>
</td>
</tr>
<tr>
<td class="style5">
<asp:Label ID="Label4" runat="server" Text="Sender"></asp:Label>
</td>
<td>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
<asp:ListItem>Angeles</asp:ListItem>
<asp:ListItem>Aurora</asp:ListItem>
<asp:ListItem>Bataan</asp:ListItem>
<asp:ListItem>Bulacan</asp:ListItem>
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:Database1ConnectionString1 %>"
SelectCommand="SELECT [Sender] FROM [Details]"></asp:SqlDataSource>
</td>
<td>
</td>
</tr>
<tr>
<td class="style10">
</td>
<td class="style11">
<asp:Button ID="Button1" runat="server" Text="Button" />
</td>
<td class="style11">
</td>
</tr>
<tr>
<td class="style6">
</td>
<td class="style7">
</td>
<td class="style7">
</td>
</tr>
</table>
</p>
</asp:Content>
And this is the Code behind it:
public partial class Data : System.Web.UI.Page
{
protected void DRInput_DataBinding(object sender, EventArgs e)
{
}
What would be my code to bind the textbox to save details in my table "Details" and when I click the button it will be save on table "Details" . Hoping anyone could help. Thanks in advance.
In you particular case it doesn't look like you're displaying a list of data but instead the details of an item.
The simple approach would be to assign the text property of the textbox as part of the page request eg within page load event of the page.
DRInput.Text = detailsModel.DRInput;
and then when the page is submitted assign the textbox's text value back to your object.
detailsModel.DRInput = DRInput.Text;
Since you're new to ASP.Net; perhaps best to start with tutorial sites for example w3schools.com/aspnet/aspnet_demo_intro.asp or asp.net/web-forms then come back and ask your questions

Not able to select text in textbox

I've got this here wizard step with a couple of text boxes. For some reason I cannot highlight/select the text in the textbox in IE or FF and I have no idea why, not even after spending a couple of hours googling the problem. I could really use another set of eyes on this. Let me know if you need more code to help.
<asp:WizardStep ID="wsPlanInfo" runat="server" Title="" StepType="Step">
<div style="width:100%; height:290px; margin-top:150px ">
<table border="0" style="margin:0 auto;">
<tr>
<td colspan="2" class="title">
Placeholder text here?
</td>
</tr>
<tr>
<td colspan="2"><asp:TextBox runat="server" ID="txtLearningPlanName" Width="300px" CssClass="input-text" /> <asp:RequiredFieldValidator runat="server" ID="rflLearningPlanName" ControlToValidate="txtLearningPlanName" ErrorMessage="*" CssClass="validator" /><br /><br /></td>
</tr>
<tr>
<td colspan="2" class="title">
placeholder text here?
</td>
</tr>
<tr>
<td> </td>
<td>
<table border="0"><tr><td><asp:RadioButton runat="server" ID="rbSpecificDate" GroupName="DeadlinePicker" Checked="true" /></td><td><UC:DatePicker runat="server" ID="ucSpecificDatePicker" RequiredField="false" /></td></tr></table>
</td>
</tr>
<tr>
<td> </td>
<td>
<asp:RadioButton runat="server" ID="rbCustomUserFieldPlusDays" GroupName="DeadlinePicker" /> <asp:DropDownList runat="server" ID="ddlUserCustomFields" CssClass="input-text" /> plus <Telerik:RadNumericTextBox runat="server" SkinID="Normal" ID="rntbUserCustomFieldOffset" ShowSpinButtons="true" DataType="System.Int32" NumberFormat-DecimalDigits="0" Width="60px" Value="365" /> days
</td>
</tr>
<tr>
<td> </td>
<td>
<asp:RadioButton runat="server" ID="rbPlusDays" GroupName="DeadlinePicker" /> <Telerik:RadNumericTextBox runat="server" SkinID="Normal" ID="rntbPlusDays" ShowSpinButtons="true" DataType="System.Int32" NumberFormat-DecimalDigits="0" Width="60px" Value="365" /> days from today
</td>
</tr>
<tr>
<td> </td>
<td>
<asp:RadioButton runat="server" ID="rbNone" GroupName="DeadlinePicker" /> None
</td>
</tr>
</table>
</div>
</asp:WizardStep>
Try:
((TextBox)wsPlanInfo.FindControl("txtLearningPlanName")).Text
It will search the Wizard Step's Control list for a textbox with that ID name. It then casts it as a TextBox and so you can then use the Text property.
Removing disableSelection(document.body) in my javascript solved my problem. Note to self, post entire code when asking a question.

Resources