I'm creating a class schedule viewer that's populating data from the database. I'm using gridview but the way that I've got it is that it just displays each cell in one singlular large column. I want the format of
9 10 11 12 13 14 15 16 17 18
Mon
Tues
Wed
Thurs
Fri
This is how my data is formatted for one cell:
<asp:GridView ID="GridView2" ShowHeader="false" GridLines="None" AutoGenerateColumns="false" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<table style="border: 1px solid #A55129; background-color: #FFF7E7">
<tr>
<td style="width: 200px">
<table>
<tr>
<td>
<b>Class Code:</b>
</td>
<td>
<asp:Label ID="lblcode"
runat="server"
Text='<%#Eval("classCode") %>'>
</asp:Label>
</td>
</tr>
<tr>
<td>
<b>Day:</b>
</td>
<td>
<asp:Label ID="lblday"
runat="server"
Text='<%#Eval("day") %>'>
</asp:Label>
</td>
</tr>
<tr>
<td>
<b>Start Period:</b>
</td>
<td>
<asp:Label ID="lblstart"
runat="server"
Text='<%#Eval("periodStart") %>'>
</asp:Label>
</td>
</tr>
<tr>
<td>
<b>End Period:</b>
</td>
<td>
<asp:Label ID="lblend"
runat="server"
Text='<%#Eval("periodEnd") %>'>
</asp:Label>
</td>
</tr>
<tr>
<td>
<b>Teacher:</b>
</td>
<td>
<asp:Label ID="lblteacher"
runat="server"
Text='<%#Eval("teacherName") %>'>
</asp:Label>
</td>
</tr>
</table>
</td>
</tr>
</table>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
The above code displays one set of data from the database. But I have hundreds of these so you can imagine that the total format is one very long single column.
Can someone suggest how I can get gridview to display my suggested format and with the data in their respective cells e.g. Geography on Monday, starting at 9, ending at 11 will show up along the Monday row, over the 9 and 10 columns?
Honestly, I am not sure if GridView is the best (or a good) candidate for such a task. I would go with Ajax & Jquery oriented solution but not sure how comfortable you are with them. Here are several ASP.NET projects that might give you an idea:
http://code.daypilot.org/65101/timetable-tutorial-asp-net-c-vb-net
http://code.daypilot.org/34377/shift-scheduling-tutorial-asp-net-sql-server-c-vb-net
Related
Here is my asp.net Repeater From within it there is a button. I want to get the value of lblFaulType in a string in code behind when i click Button1, How can I do that?I have tried many approaches but nothing working. Please give me your suggestions.
<asp:Repeater ID="RepterDetails" runat="server">
<HeaderTemplate>
<table style="border:1px solid #0000FF; width:500px" cellpadding="0">
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:#EBEFF0">
<td>
<table style="background-color:#EBEFF0;border-top:1px dotted #df5015; width:500px" >
<tr>
<td >
<strong><asp:Label ID="Label18" runat="server" Text="Fault Category: " Font-Bold="true"/></strong>
<asp:Label ID="lblFaultType" runat="server" Text='<%#Eval("Fault Type") %>' Font-Bold="true"/>
</td>
<td >
<strong><asp:Label ID="Label19" runat="server" Text="Fault Description: " Font-Bold="true"/></strong>
<asp:Label ID="Label8" runat="server" Text='<%#Eval("Fault Description") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td >
<strong><asp:Label ID="Label2" runat="server" Text="Building: " Font-Bold="true"/></strong>
<asp:Label ID="Label9" runat="server" Text='<%#Eval("Name") %>' Font-Bold="true"/>
</td>
<td >
<strong><asp:Label ID="Label3" runat="server" Text="Floor: " Font-Bold="true"/></strong>
<asp:Label ID="Label10" runat="server" Text='<%#Eval("FloorNo") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td>
<strong><asp:Label ID="Label6" runat="server" Text="Room Number: " Font-Bold="true"/></strong>
<asp:Label ID="Label11" runat="server" Text='<%#Eval("RoomNumber") %>' Font-Bold="true"/>
</td>
</tr>
<tr>
<td ><strong><asp:Label ID="Label14" runat="server" Text="Created Time: " Font-Bold="true"/></strong> <asp:Label ID="lblUser" runat="server" Font-Bold="true" Text='<%#Eval("Time") %>'/></td>
<td ><strong><asp:Label ID="Label15" runat="server" Text="Created Date: " Font-Bold="true"/></strong><asp:Label ID="lblDate" runat="server" Font-Bold="true" Text='<%#Eval("Date") %>'/></td>
</tr>
<tr>
<td ><strong><asp:Label ID="Label16" runat="server" Text="Start Status: " Font-Bold="true"/></strong> <asp:Label ID="Label12" runat="server" Font-Bold="true" Text='<%#Eval("StartStatus") %>'/></td>
<td ><strong><asp:Label ID="Label17" runat="server" Text="Assign Status: " Font-Bold="true"/></strong> <asp:Label ID="Label13" runat="server" Font-Bold="true" Text='<%#Eval("AssignStatus") %>'/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td >
<asp:TextBox ID="lblComment" runat="server" style="color:#000000; font-weight: bold;" placeholder="Describe the fault here" Text='<%#Eval("Comment") %>' TextMode="MultiLine" Columns="70" Rows="6" Enabled="false"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" class="text-center"><asp:Button ID="Button1" runat="server" Text="Assing Fault" class="btn btn-success" OnClick="Button1_Click" /> </td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
We may need to see the CodeBehind for this page, and specifically the "Button1_Click" method (click event).
Now though, it appears as though you only have one of the labels with an ID of "lblFaultType" (maybe you misspelled that in your initial description. Each of the other labels all carry sequentially numbered IDs (e.g. ID="Label1", ID="Label2", ID="Label3", etc), and your ClickEvent (the Button1_Click method) will need to iterate through those items to know 'which' label you are attempting to obtain a value from.
Suggestion: It may be better to apply a ClickEvent on each of the particular labels since it will have the ID there with it (a JScript/JQuery solution).
This actually a GREAT question!
(in fact good interview question)
Why?
Because how.net works for a gridview, listview, or a repeater?
They are ALL very similar.
If one has failed to grasp the “most basic” event model in .net, then suggestions to use JavaScript, or all kinds of wild approaches will be suggested (and they would get a failing mark in answering this question).
When using data bound controls that repeat data, then you can set a special command to trigger the Itemcommand event.
The attribute setting is called “CommandName”.
There are built in commands – and the command you use is important. However, "just" setting command name to somthing of your liking is sufficient in most cases.
This will CAUSE the ItemCommand event will fire. And once that occures, then you have "itemIndex" to point to any given row in the repeater (or gridview, or listview, or form view - the list goes on!!!).
So, add this to your button:
<asp:Button ID="Button1" runat="server" Text="Assing Fault"
class="btn btn-success" OnClick="Button1_Click"
CommandName = "Select" CommandArgument = '<%#Eval("Fault Type") %>'/>
Now, the the ItemCommand event, you can do this:
Protected Sub RepterDetails_ItemCommand(source As Object, e As RepeaterCommandEventArgs) Handles Repeater1.ItemCommand
Debug.Print("item command")
Dim MyRow As RepeaterItem = e.Item
Dim h As Label = e.Item.FindControl("lblFaultType")
Debug.Print(h.Text)
End Sub
Of course, since we set the CommandArguemnt to pass the value we want, then of course you can also do this:
debug.print("Value of FaultType = " & e.CommandArgument)
So, be it a classic "data aware" control in .net? Well be it a listview, gridview, repeater, and MANY MORE, then use the built in "gift horse" features that of course expected this common need and solution.
And you can get the selected index into the repeater with this:
Debug.Print(e.Item.ItemIndex)
Thanks guys but i found the answer at https://youtu.be/Oltxy1sGIds
So i did it like this:
RepeaterItem item = (sender as Button).NamingContainer as RepeaterItem; string type = +(item.FindControl("lblFaultType") as Label).Text;
I have a table with some information shown, but I would like to able to edit after I click the checkbox above.
<asp:Button ID="Backbtn" runat="server" Text="Back" Width="84px"
onclick="Backbtn_Click" />
<br /><br />
<asp:CheckBox ID="CheckBox1" runat="server" onclick="check" Text="Check"/>
<table class="T-Table" >
<tr>
<th colspan="6"><em>IT INTERNAL USE</em></th>
</tr>
<tr>
<td width="180px">Doc.No </td>
<td>:</td>
<td width="160px">
<asp:Label ID="DocNo" runat="server" Text="Label"></asp:Label>
</td>
<%-- <td width="180px">Job Complete Date </td>
<td>:</td>
<td width="160px">
</td> --%>
</tr>
<tr>
<td>Received Date :</td>
<td>:</td>
<td>
<asp:Label ID="RDate" runat="server" Text="Label"></asp:Label>
</td>
<td>Response Time (HR) :</td>
<td>:</td>
<td><asp:TextBox ID="Response_T" runat="server" TextMode="DateTimeLocal"></asp:TextBox>
</td>
</tr>
<tr>
<td>Remarks </td>
<td>:</td>
<td colspan="5"><asp:TextBox ID="Remarks" runat="server" Rows="5" TextMode="MultiLine"
Columns="80"></asp:TextBox></td>
</tr>
<tr>
<td>Cost charge to Department </td>
<td>:</td>
<td><asp:TextBox ID="Cost" runat="server" ></asp:TextBox></td>
<td>Status</td>
<td>:</td>
<td> <asp:DropDownList ID="Progress" runat="server">
<asp:ListItem Text="Done" Value="Done"></asp:ListItem>
<asp:ListItem Text="In Progress" Value="In Progress"></asp:ListItem>
<asp:ListItem Text="Pending" Value="Pending"></asp:ListItem>
</asp:DropDownList></td>
</tr>
Here are some html code. I would like to add a function so that all the information can be editable after I click the Checkbox.
Thank you
There is nothing to do with C# or Linq here (as you tagged).
Assuming you are working on an ASP.NET application
Enable the checkbox AutoPostback. ie, Set AutoPostback property of the checkbox to true.
Then on page load or checkbox checked change event, enable the textbox.
eg. name of text editor is txtRemarks and checkbox name to be chkRemarksEditor
on chkRemarksEditor Checked change event :-
txtRemarks.Enabled = chkRemarksEditor.Checked;
I am working on my first Mobile Site using bootstrap. I am trying to create a Listview that is responsive, I made some research and I need to select Layout= Flow but my issue is that this layout flows from top to bottom (one column). I need to be able to display it from left to right up to 4 items, but I can't make it work.
code
<asp:ListView ID="ProductsListView" DataSourceID="SqlDataSource1" runat="server" DataKeyNames="ID">
<LayoutTemplate >
<div ID="itemPlaceholderContainer" runat="server" style="">
<span runat="server" id="itemPlaceholder" />
</div>
<div style="">
</div>
</LayoutTemplate>
<ItemTemplate>
<span style="">ID:
<asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' />
</span>
</ItemTemplate>
</asp:ListView>
It looks like you are having the same problem as this user.
horizontal list view in asp.net
The LayoutTemplate contains a block level element (the div). This means that the ItemTemplate will be wrapped in the div which will take up the full available width.
You should be able to just remove div from the LayoutTemplate, make it a span, or make it a table like in the Selected Answer of the post I linked from #mshsayem
If you just want to show the images in a single row, you can just put
them in the columns of a single row. Try rewriting the listview markup
as follows (move table,tr markups into LayoutTemplate):
<asp:ListView runat="server" ID="PageHorizon">
<LayoutTemplate>
<table>
<tr>
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
</tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<td>
<img src='<%#Eval("ImagePath")%>' alt="Single Image"
width="64px" height="64px" />
</td>
</ItemTemplate>
</asp:ListView>
The script below displays the Listview item with layout = flow horizontally and it is responsive. I hope someone find it useful.
<div style=" text-align: center;">
<!-- start listview-->
<asp:ListView ID="ListView1" runat="server" DataKeyNames="ID" DataSourceID="SqlDataSource1">
<LayoutTemplate >
<div ID="itemPlaceholderContainer" runat="server" >
<span runat="server" id="itemPlaceholder" />
</div>
</LayoutTemplate>
<EmptyDataTemplate>
<span>No data was returned.</span>
</EmptyDataTemplate>
<ItemTemplate>
<table style="display: inline-block;" >
<tr >
<td colspan="3">
<asp:Image ID="Image1" runat="server" Height="200px"
ImageUrl='<%# Eval("Picture") %>' Width="150px" />
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
<span style="background-color: #FFFBD6;color: #333333;">
<asp:Label ID="OrderOfferNameLabel" runat="server"
Text='<%# Eval("WHATEVER") %>'></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
<span style="background-color: #FFFBD6;color: #333333;">
<asp:Label ID="ProductNameLabel" runat="server"
Text='<%# Eval("WHATEVER") %>'></asp:Label>
</span>
</td>
<td>
</td>
</tr>
<tr>
<td colspan="3">
<asp:Button ID="Button1" runat="server" Height="44px"
style="height: 26px; width: 56px" Text="Button" Width="380px" />
</td>
</tr>
</table>
</ItemTemplate>
</asp:ListView>
</div>
I have a Listview and one of the columns is called id_Number.
Is it possible to redirect to another page, if user clicks on one of the rows?
For example if id_Number is 4, than page should be redirected to ~/Page.aspx?id=4.
Code:
<asp:ListView ID="ListView1" runat="server"
DataKeyNames="id_Number" >
<EmptyDataTemplate>
<table id="Table1" runat="server" style="">
<tr>
<td>
No data was returned.</td>
</tr>
</table>
</EmptyDataTemplate>
<ItemTemplate>
<tr style="font-family: Arial; color: #FFFFFF" onMouseOver="this.bgColor='#219DD0';" onMouseOut="this.bgColor='#252526';">
<td>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("id_Number") %>' />
</td>
<td>
<asp:Label ID="TextLabel" runat="server" Text='<%# Eval("Text") %>' />
</td>
<td>
<asp:Label ID="DateLabel" runat="server" Text='<%# Eval("Date") %>' />
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table id="Table2" runat="server">
<tr id="Tr1" runat="server">
<td id="Td1" runat="server">
<table ID="itemPlaceholderContainer" runat="server" border="0" style="">
<tr id="Tr2" runat="server" style="">
<th id="Th1" runat="server">
Name</th>
<th id="Th2" runat="server">
Text</th>
<th id="Th3" runat="server">
Date</th>
</tr>
<tr ID="itemPlaceholder" runat="server">
</tr>
</table>
</td>
</tr>
</table>
</LayoutTemplate>
</asp:ListView>
You can add an HTML link or a JavaScript into the ItemTemplate of your ListView pretty easily:
The "columns" are just HTML columns; in the ItemTemplate, you have access to all of your data, including id_number, so you can use it anywhere in the HTML, not just inside a column.
Since you wan the whole row to be clickable, I'd use a JavaScript function on the onClick event of the HTML table row <TR> element. You already have 2 events (onMouseOver, onMouseOut), with JavaScript in them, so this would just be one more...
A JavaScript redirect utilizes window.location.href which will redirect in the same window, assuming that's what you want (as opposed to a new window, etc.):
<ItemTemplate>
<tr style="font-family: Arial; color: #FFFFFF"
onMouseOver="this.bgColor='#219DD0';"
onMouseOut="this.bgColor='#252526';"
onClick="window.location.href = 'some/path/Page.aspx?id=<%# Eval("id_Number") %>';"
<td>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("id_Number") %>' />
</td>
<td>
<asp:Label ID="TextLabel" runat="server" Text='<%# Eval("Text") %>' />
</td>
<td>
<asp:Label ID="DateLabel" runat="server" Text='<%# Eval("Date") %>' />
</td>
</tr>
</ItemTemplate>
One thing to note is for the path of Page.aspx, you have to use a relative path.
~/page.aspx?id=
Is a .net path that gets compiled into the full relative path to that page.
However, bacause your ItemTemplate contains HTML, you'd need the full (relative) path to Page.aspx in there.
So instead it should be (just an example):
/some/path/page.aspx?id= <-- page.aspx lives on http://www.yoursite.com/some/path/page.aspx
/page.aspx?id= <-- page.aspx lives on root, http://www.yoursite.com/page.aspx
Alternately you can use
onClick="window.location.href = '<% System.Web.VirtualPathUtility.ToAbsolute("~/Page.Aspx?ID=" + Eval("id_number")); %>';"
I have a problem getting an <asp:UpdatePanel..> to work inside a <table>.. <tr> </tr> structure and I don't know why. When the UpdatePanel is commented out everything works fine, but when I un-comment the UpdatePanel the contents of the <tr> </tr> tag doesn't even show up in Visual Studio 2010. This content does display when I run the web page but the UpdatePanel doesn't work. Non of my other web pages in this project have this problem but, then again, I use <div>s instead of <table>s in them.
One other thing. The is in my MasterPage.
Here is my script:
<asp:UpdatePanel ID="W9UpdatePanel" runat="server" UpdateMode="Always">
<ContentTemplate>
<tr>
<td colspan="6">
<div class="branchSetupSectionTitle">W-9 Information:</div>
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="btnDownloadW9Pdf" runat="server"
Text="Download W-9" onclick="btnDownloadW9Pdf_Click" AutoPostBack="True" />
<%--<asp:RegularExpressionValidator ID="RegularExpressionValidator24"
runat="server" ControlToValidate="txtFirstPaymentAmount" Display="Dynamic"
ErrorMessage="The dollar amount you entered is in the wrong format."
ForeColor="Red" ValidationExpression="^\d+(\.\d\d)?$">*</asp:RegularExpressionValidator>--%>
<asp:CheckBox ID="chkW9FormSubmitted" runat="server" AutoPostBack="True"
oncheckedchanged="chkW9FormSubmitted_CheckedChanged"
Text=" I have submitted this W-9 Form" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</ContentTemplate>
</asp:UpdatePanel>
</tr>
The event fires for both the button and the checkbox but the entire page is refreshed.
Thanks for your help.
UpdatePanel needs to render a div or span in order to function correctly. Since neither of these elements can be rendered between table rows, UpdatePanel does not have a placeholder to render the postback response html, and thus it doesn't work.
A workaround in your case may be to see which part of your page does not need to be inside the update panel and leave it outside. You could leave just the contents of <td colspan="2"> inside the UpdatePanel.
<asp:ScriptManager ID="scm" runat="server">
</asp:ScriptManager>
<fieldset>
<legend>Truck Master Entry Form</legend>
<asp:UpdatePanel ID="upd1" runat="server">
<ContentTemplate>
<table cellpadding="2" cellspacing="1">
<tr>
<td align="right">
Truck no :
</td>
<td align="left">
<asp:TextBox ID="truckno" runat="server" Width="120px" Height="20px" />
</td>
</tr>
<tr>
<td align="right">
Size :
</td>
<td align="left">
<asp:DropDownList ID="drptrucksize" runat="server" Width="120px" Height="20px" DataValueField="WEIGHT"
DataTextField="SIZE" OnSelectedIndexChanged="drptrucksize_SelectedIndexChanged"
AutoPostBack="true" />
</td>
</tr>
<tr>
<td align="right">
Type :
</td>
<td align="left">
<asp:TextBox ID="txttrucktype" runat="server" Width="120px" Height="20px" />
</td>
</tr>
<tr>
<td align="right">
Weight :
</td>
<td align="left">
<asp:TextBox ID="txtweight" runat="server" Width="120px" Height="20px" />
</td>
</tr>
<tr>
<td align="right">
</td>
<td align="left">
<asp:Button ID="btnsave" runat="server" Text="Save" Width="100px" Height="50px" />
<asp:Button ID="btncancel" runat="server" Text="Cancel" Width="100px" Height="50px" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
The update panel need to be put outside the table. Look at
Mohammad Shahnawaz's code.