i have to fix the header in a gridview and i use this in style Class
<style type="text/css">
.gridFixedHeader
{
background-color:white;
position:relative;
top:expression(GridView1.offsetParent.scrollTop-2);
}
</style>
but i get an error that expression(GridView1.offsetParent.scrollTop-2);is not valid...
what all do i need to do to make this work.....
any suggestions
Main aim... to fix the headers so they dont move when the gridview is scrolled up or down...
any help will be appreciated...
here is my gridview code
<asp:Panel ID="Panel1" runat="server" Height="100px" ScrollBars="Vertical">
<asp:GridView ID="GridView1" runat="server" AllowSorting="True"
AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC"
BorderStyle="None" BorderWidth="1px" CellPadding="3"
DataKeyNames="MachineGroupID" DataSourceID="SqlDataSource1">
<RowStyle ForeColor="#000066" />
<HeaderStyle CssClass="gridFixedHeader" />
<Columns>
<asp:BoundField DataField="MachineGroupID" HeaderText="MachineGroupID"
InsertVisible="False" ReadOnly="True" SortExpression="MachineGroupID" />
<asp:BoundField DataField="MachineGroupName" HeaderText="MachineGroupName"
SortExpression="MachineGroupName" />
</Columns>
<FooterStyle BackColor="White" ForeColor="#000066" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>
</asp:Panel>
so here i have a gridview where when i scroll the header row moves too.. i dont want that to happen..
It is not valid in W3C. It is an IE only thing. To do what you are looking for in a valid way would require you to run some JavaScript and fix your headers.
If you explain your desired outcome I am sure someone can help. I have made GridView headers look exactly like I want many times.
UPDATE: Here is a good article: http://www.dotnetcurry.com/ShowArticle.aspx?ID=255
When the gridview is rendered to html, the GridView1 ID is probably being rewritten.
you probably want something like:
top:expression(<%= GridView1.ClientID %>.offsetParent.scrollTop-2);
although this may get you what you want it's probably not the best form.
You are heavily advised against using CSS expressions, as they get executed on every event of the browser - including mouseMove. They also don't work on anything but IE.
I can't answer your question further due to lack of details of what you're trying to achieve.
If you're trying to fix it to the top of the viewport try:
.gridFixedHeader
{
background-color:white;
position:fixed;
top:20px; //optional
}
in the elements CSS
edit: just realised you look like you're styling a GridViews header so this will probably not work, try posting some of the Gridview generated HTML and what yo want done with it please
Related
I've been utilizing what I call, "drag, drop and configure" programming for years to create very simple ASP.net forms to collect data for my organization. Basically, I'll drag a datasource into my design view, configure it, and then I'll drag a gridview into the design view and then configure it, etc., etc.
Yesterday, I encountered a behavior I have never seen. My gridview is set to allow row selection. Everything seemed to be working normally until I happened to click on a row that didn't "select" (didn't highlight itself, etc.). And, then I started clicking on other rows and found more that couldn't be selected. Again -- it's not all the rows...just some. i.e. some can be selected and others can't.
After a lot of troubleshooting, the only thing I've been able to determine is that above a certain datakey value -- rows won't select. In this case, its datakeys with values around and > 40,000. Anything below that, and the rows select and the other parts of the form load just fine. The fact that it works for all records with datakeys below a certain value is really stumping me as to what rock to look under next -- hence, actually creating a stackoverflow account and posing the question.
Code for the gridview is below. It does live within an update panel if that matters. Also provided the code behind, though it's not really doing anything of consequence.
Note:
The datakey that seems to be controlling the behavior is a unique identifier for an application within a set of applications. It's not an incremental identity. --- if that helps.
The form is hooked into a database for the select statement and is pulling records from a view to populate the grid.
I'm tempted to show all of my code including the database side and stored procs -- thinking maybe I'm making rookie mistakes with data typing, etc. --- BUT --- I'm pausing there because the gridview selection IS WORKING -- just not above datakeys around and above 40,000
Lastly, when you attempt to select an item with a key > 40,000 the grid will no longer sort by columns or allow you to click a different page. Similarly, if you sort the grid FIRST by applicationID (the datakey) -- all the pages with datakeys > 40,000 are not clickable i.e. pagination for those pages do not work
EDIT --- DANG IT!!! I posted the wrong code behind. I replaced it with the right one. UPDATE: It looks like it's related to the panels. When I comment them out --- it works. When they are included -- the rows in question (keys > 40000) aren't selectable. All this code does is control visibility of panels. How could visibility properties make this kind of impact....weird
Pic of Issue:
<ContentTemplate>
<strong>
<asp:ScriptManager ID="ScriptManager2" runat="server">
</asp:ScriptManager>
Select AIT by using search box below or by sorting and paging through AIT table.<br />
<br />
Search: </strong> <asp:TextBox ID="TxtAITSearch" runat="server"></asp:TextBox>
<asp:Button ID="btn_Search" runat="server" OnClick="btn_Search_Click" Text="Search" />
<em>
<br />
*wildcard searches for AIT number, AIT Name or AIT Manager may be used</em><asp:HiddenField ID="hdnApl_ID" runat="server" />
<asp:HiddenField ID="hdn_StandardID" runat="server" />
<asp:HiddenField ID="Hdn_AlignmentID" runat="server" />
<asp:HiddenField ID="hdn_Attribute" runat="server" />
<br />
<asp:GridView ID="gvAITSelect" runat="server" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" CellPadding="3" DataKeyNames="applicationID" DataSourceID="DSGetSearchView" GridLines="Vertical" OnSelectedIndexChanged="gvAITSelect_SelectedIndexChanged" BackColor="White" BorderColor="#999999" BorderStyle="None" BorderWidth="1px">
<AlternatingRowStyle BackColor="#DCDCDC" />
<Columns>
<asp:CommandField ShowSelectButton="True" />
<asp:BoundField DataField="applicationID" HeaderText="App ID" SortExpression="applicationID" />
<asp:BoundField DataField="fullName" HeaderText="Application" SortExpression="fullName" />
<asp:BoundField DataField="Alignment" HeaderText="Alignment" SortExpression="Alignment" />
<asp:BoundField DataField="AlignmentID" HeaderText="AlignmentID" SortExpression="AlignmentID" Visible="False" />
<asp:BoundField DataField="status" HeaderText="Status" SortExpression="status" />
<asp:BoundField DataField="relatedAssociates_2_displayName" HeaderText="App Mgr" SortExpression="relatedAssociates_2_displayName" />
<asp:BoundField DataField="relatedAssociates_3_displayName" HeaderText="Tech Exec" SortExpression="relatedAssociates_3_displayName" />
</Columns>
<FooterStyle BackColor="#CCCCCC" ForeColor="Black" />
<HeaderStyle BackColor="#000084" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />
<RowStyle BackColor="#EEEEEE" ForeColor="Black" />
<SelectedRowStyle BackColor="#008A8C" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#0000A9" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#000065" />
</asp:GridView>
protected void gvAITSelect_SelectedIndexChanged(object sender, EventArgs e)
{
lbl_Alignment.Text = gvAITSelect.SelectedRow.Cells[3].Text;
Hdn_AlignmentID.Value = gvAITSelect.SelectedRow.Cells[4].Text;
string strAITvalue = gvAITSelect.SelectedRow.Cells[1].Text;
hdnApl_ID.Value = strAITvalue.ToString();
//panel_RoleDetails.Visible = true;
//panel_AITAlignment.Visible = true;
//panel_NoteDetails.Visible = true;
}
Ok -- I figured it out. And, the answer is, I'm a big dummy. Further, the fact that the grid stopped working around in and around 40000 should have been a big flashlight to me pointing the way. Pic of the issues
If you look at the pic I uploaded -- in the course of troubleshooting an earlier and unrelated issue -- I set the DbType (highlighted row) to Int16. In the available selections I don't see an unsigned Int16 -- so, this appears to be signed---Annnnnnnnnnnnnnnnd, of course, good developers know Int16s hold values up to 32,767. Guess what happened when I changed it back to the default "Object"? Yup. It worked. So the problem not at all weird or strange. Instead, very much a rookie mistake.
All this said -- good learning experience. Additionally, #Albert D. Kallal and #fnostro you both gave me some good understanding on some things for the future. I appreciate both of you trying to help me. And, now I also, have a stackoverflow account :)
Thanks again.
I have a gridview on my web page.
I am able to populate the Grid using C# in the behind code.
Here is a sample screen of 2 columns and 2 rows:
What I don't understand is why there Gridlines are not showing on the rows of data when I have it set on the gridview properties to show "both".
<asp:GridView id="gvappts"
runat="server"
AllowPaging="True"
AllowSorting="True"
AutoGenerateColumns="False"
BorderColor="#EFE6F7"
ForeColor="#003399"
Width="100%"
Font-Size="Small"
GridLines="Both"
BorderStyle="Solid"
BorderWidth="1px"
CellPadding="3">
<Columns>
<asp:BoundField DataField="apptid" HeaderText="Appt #" />
<asp:BoundField DataField="name" HeaderText="Name" />
</Columns>
</asp:GridView>
What am I missing?
Please try the below code to your row border..
<RowStyle HorizontalAlign="Center" BackColor="White" BorderColor="#0000CC"
BorderStyle="Solid" BorderWidth="2px"/>
And also try the same to columns.
All of the comments on this post are correct to some extent which is, you mention that the issue must rely in the styles, after going line by line in my style sheets I found the culprit style and was able to get the grid-lines to show.
The output is like this:
MyNameIsJohnSmithAnd
Imaperson
What I want is to display it in only one line
MyNameIsJohnSmithAndImaperson
My Aspx gridview code is:
<asp:GridView ID="GridView1" runat="server" BackColor="LightGoldenrodYellow"
BorderColor="Tan" BorderWidth="1px" CellPadding="5" Font-Names="Calibri"
Font-Size="Medium" Font-Underline="False" ForeColor="Black">
<RowStyle Wrap="False"/>
<EmptyDataRowStyle Wrap="False"/>
<FooterStyle BackColor="Tan" BorderColor="Black" BorderStyle="Solid" Wrap="False"/>
<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue"
HorizontalAlign="Center" Wrap="False" />
<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" Wrap="False"/>
<HeaderStyle BackColor="Tan" BorderStyle="Solid" Font-Bold="True" Wrap="False"/>
<EditRowStyle Wrap="False"/>
<AlternatingRowStyle BackColor="PaleGoldenrod" Wrap="False"/>
</asp:GridView>
I disabled all the wrap property to false in gridview. but the text still wraps.
You have to set the gridview's individual column's word wrap to False as well.
<asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" >
<ItemStyle Wrap="False" />
</asp:BoundField>
Try adding this event to your gridview.
protected void GridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
for (int i = 0; i < e.Row.Cells.Count; i++)
{
e.Row.Cells[i].Attributes.Add("style", "white-space: nowrap;");
}
}
Here is the reference.
Very simple in .Net Select your grid view (as in Design mode) in property window and follow this
RowStyle -->Font -->>Wrap=False
Thats done
You can do this by css.
#GridView1
{
white-space:nowrap;
}
My column header text was wrapping so I ended up needing a slightly different solution but similar to what user3578419 suggested.
In design view, I edited the 'ColumnHeadersDefaultCellStyle' property and changed the 'WrapMode' value to 'False'.
I have an issue working with the telerik radgrid control. I am trying to use javascript to access a textbox when the grid is in edit mode.
My code looks like the following:
<telerik:RadGrid ID="RadGrid1" GridLines="None" runat="server" AllowAutomaticDeletes="True"
AllowSorting="False" AllowAutomaticInserts="True" PageSize="10" AllowAutomaticUpdates="True"
OnItemDataBound="RadGrid1_ItemDataBound" AllowMultiRowEdit="False" AllowPaging="False"
DataSourceID="DataSource1" OnItemUpdated="RadGrid1_ItemUpdated" AllowFilteringByColumn="False"
OnItemDeleted="RadGrid1_ItemDeleted" OnItemInserted="RadGrid1_ItemInserted" AutoGenerateColumns="false"
OnDataBound="RadGrid1_DataBound">
<PagerStyle Mode="NextPrevAndNumeric" />
<MasterTableView Width="100%" CommandItemDisplay="TopAndBottom" DataKeyNames="Id"
DataSourceID="DataSource1" HorizontalAlign="NotSet" EditMode="EditForms">
<Columns>
<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
<ItemStyle CssClass="MyImageButton" />
</telerik:GridEditCommandColumn>
<telerik:GridButtonColumn ConfirmText="Delete this product?" ConfirmDialogType="RadWindow"
ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"
UniqueName="DeleteColumn">
<ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
</telerik:GridButtonColumn>
<telerik:GridBoundColumn DataField="Id" HeaderText="Id" Display="false" ReadOnly="true" />
<telerik:GridBoundColumn DataField="Manufacturer" HeaderText="Manufacturer" />
<telerik:GridBoundColumn DataField="Description" HeaderText="Description" />
<telerik:GridBoundColumn DataField="Configuration" HeaderText="Configuration" />
<telerik:GridDropDownColumn DataField="TypeId" HeaderText="Type" UniqueName="PartsType"
DataSourceID="PartsTypeDataSource" ListTextField="Name" ListValueField="Id" />
What I am after is that, during edit mode, when the user selects a certain value from the dropdown list 'PartsType', one of the other fields - eg 'Manufacturer' will be shown/hide.
I could get the dropdown value (in javascript) by attaching a javascript function to the dropdownlist:
function PartsTypeIndexChanged(sender, args) {
var selectedValue = args.get_item()._text;
}
I just dont know which method to use to get the 'Manufacturer' field, so I can show/hide it.
Could anyone please help?
Many thanks.
A possible approach could be to use RadControls client-side static API
$telerik.findElement(gridDOMElement, "Manufacturer");
This will help you access the column editor - I suppose it is ASP.NET TextBox rendered as input. For numeric or date columns the editor will probably be Telerik client component so you have to use findControl instead of findElement.
More info here:
http://www.telerik.com/help/aspnet-ajax/telerik-static-client-library.html
Good luck
Please check below link.
http://www.telerik.com/community/forums/aspnet-ajax/grid/set-controls-attribute-like-enable-disable-on-insert-edit-mode-using-jquery.aspx
I have a C# web app where I have a gridview that takes a List<> that takes an interface. There are three object types that implement the interface that are within the list.
I set the gridviews datasource to the list and call databind. When I run the app I get the following error:
{"Property accessor 'Name' on object 'Bailey.Objects.Company' threw the following exception:'Object does not match target type.'"}
I changed the object order around in the list and found that the first object type works just fine but when it finds the first instance of another object it throws this error.
List<IBaileyObject> listToDisplay = listofItems;
GridViewItemList.DataSource = listToDisplay;
GridViewItemList.DataBind();
What I wanted was for the datasource and binding to stay on the interface rather then cast down to the object as it would seem to be happening.
Is this because the List<> is returning the object as it self rather than the Interface or is it something in the gridview that is casting it down?
Or am I going down the wrong track?
I hope someone has a way to fix this please.
Thanks
Jon Hawkins
EDIT
<asp:TemplateField HeaderText="Selected">
<ItemTemplate>
<asp:CheckBox runat="server" ID="chkbox" Width="10%" Enabled="true" AutoPostBack="false" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ID" HeaderText="ID" Visible="False" />
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="TypeName" HeaderText="Type" />
</Columns>
<FooterStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#E3EAEB" />
<PagerStyle BackColor="#666666" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#C5BBAF" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#7C6F57" />
<AlternatingRowStyle BackColor="#F8F8F8" />
The interface exposes Name, ID and TypeName.
" HeaderText="ID" Visible="False" />
gives can not apply indexer.
I really like this solution : http://iridescence.no/post/FixingBoundFieldSupportforCompositeObjects.aspx
It uses a custom BoundField class that uses the Eval to return the values. A little nicer than using the Evals in the ASPX page...
Can you post some of your GridView code (specifically where you reference your IBaileyObject properties)?
Not knowing what syntax you're using makes things hard, but have you tried doing something like this:
<%# (((IBaileyObject)Container.DataItem)["PropertyX"]) %>
Hope this helps
Edit after code posted
I think it's because you're using "BoundField"s - they're not clever enough to work out where the member you're referring to comes from. My advice is to convert your BoundFields to databinding syntax:
Either: <%# Eval("Id") %>
or, <%# (((IBaileyObject)Container.DataItem)["Id"]) %>
Failing that, follow the advice in this blog post and create a custom bound field control.
GridViewItemList.DataSource = listToDisplay.Select(x => new
{
Id = x.Id,
Name = x.Name
})
.ToList();
GridViewItemList.DataBind();