Develop Reference

Hyperlink C1Flexgrid Column Data in silverlight

I am using Component one FlexGrid in my silverlight Application and it is autogenerating columns in the grid. I want to make one of the column's data behave as a clickable hyperlink. Any help on this problem would be greatly appreciated.

I have figured out a way to add hyperlink cell in C1FlexGrid.
One should extend CellFactory Class and inside the class
override method CreateCellContent(C1FlexGrid grid, Border bdr, CellRange range)
and write something like this:
public override void CreateCellContent(C1FlexGrid grid, Border bdr, CellRange range)
{
//Ofcourse One should figure out first the col in which they want to
//add the cell
var width = GetWidthForHyperlinkControl((string)grid[range.Row, range.Column]);
var cell = new HyperlinkControl
{
HorizontalAlignment = HorizontalAlignment.Left,
VerticalAlignment = VerticalAlignment.Center,
Width = width,
Height = 16,
NavigateUri = null,
IsTabStop = false,
Content = (string)grid[range.Row, range.Column]
};
}

The sample projects for ComponentOne FlexGrid include a Hyperlink sample. Should be part of your installed items.
If not, you can also access it via the ComponentOne website.
Essentially, you set up a style for the hyperlink cells/columns and apply it. You can use OwnerDrawCell events to do it, as the example shows.

asp.net programatically created table and css priority

I have a table which I create programatically in my code behind file and set the colours of alternate row to gray for easier visibility like so:
<New cells and rows created here>
tblResults.GridLines = GridLines.Both;
tblResults.BorderStyle = BorderStyle.Solid;
tblResults.HorizontalAlign = HorizontalAlign.Center;
if (rowNumber % 2 == 1)
{
tblRow.BackColor = System.Drawing.Color.LightGray;
}
tblResults.Rows.Add(tblRow);
tblResults.CssClass = "myclass" ;
pnlContent.Controls.Add(tblResults);
I also want to have the rows highlighted when a user hovers over them like so:
.myclass tr:hover
{
background: #FCF;
}
Now the hover only seems to work for the rows which are not highlighted gray from the c# code which I assumes takes precedence over the css.
How can I also make those gray rows work with the css hover?

Try this hope it helps, I think some where the Style inside the page is overwriting your light Grey Background. Try this it will be ease to find the solution
if (rowNumber % 2 == 1)
{
tblRow.Attributes.Add("Class","ClassName_grey");
}
else{
tblRow.Attributes.Add("Class","ClassName_nothing")
}
.myclass tr:hover
{
background: #FCF;
}
.ClassName_grey {
background: #eeeeee;
}

You might try
.myclass tr:hover
{
background-color: #FCF;
}
Or adding the !important qualifier. The former is basically setting the same style as the server-side code should be, whereas your code was setting the less specific background (all aspects of it, not just colour).
Otherwise try viewing the source or using developer tools to see what style attribute you need to overwrite.

get height of div from masterpage

How can I get the height of a div which is placed inside a masterpage?
I'm able to set the height as follow:
((HtmlControl)this.Master.FindControl("sidebar")).Style.Add("height", "600px");
Now I'm trying to get the height from my div called mainPage, how can I do this?

MasterPage.Master:
<div id="_test" style="height: 100px" runat="server"></div>
MasterPage.Master.cs:
public HtmlGenericControl test
{
get { return this._test; }
}
any other cs-file:
string width = ((MasterPage)this.Master).test.style["height"];
Edit: If you want to get any style information created dynamically you will need to store this information into a hidden field, because you won't be able to retrieve the data by calling style["x"] in the postback.
Edit2: Adjusted masterpage-name.

You will have to get the div's height on the client side as it may be rendered differently for each client...
Using jQuery, you can do
$("#sidebar").height();
but for this you will have to wait that the document is ready. So you can put this line in the ready function of the document:
$(document).ready(function(){});
EDIT
Another solution is adding runat="server" to your div
<div ID="sidebar" runat="server">...</div>
Then from your code you can do something like
HtmlGenericControl sb = this.form1.FindControl("sidebar") as HtmlGenericControl;
int sidebarHeight = sb.Height;

How to keep the back color of the cell after passing the highlight at the top of that cell?

I have a GridView that give some cells specific back color which is Green. Now, I am using a JQuery for fixing the Header and the Columns. This JQuery has a highlighter. The problem now is when the highlighter goes on the top of those cells that have green back color, the green back color will be disappeared and the cell will has no color after the highlighter leave this cell.
The following image shows you the problem:
<script type="text/javascript">
$(document).ready(function () {
sh_highlightDocument();
$(".tableDiv").each(function () {
var Id = $(this).get(0).id;
var maintbheight = 555;
var maintbwidth = 900;
$("#" + Id + " .FixedTables").fixedTable({
width: maintbwidth,
height: maintbheight,
fixedColumns: 4,
classHeader: "fixedHead",
classFooter: "fixedFoot",
classColumn: "fixedColumn",
fixedColumnWidth: 500,
outerId: Id,
Contentbackcolor: "#FFFFFF",
Contenthovercolor: "#99CCFF",
fixedColumnbackcolor: "#187BAF",
fixedColumnhovercolor: "#99CCFF"
});
});
});
</script>
I am using this JQuery FixedTable

You need to store the existing property of the cell in a variable before you change it.
I am not 100% with JQuery syntax, but if you can do something like:
(onHover)
var oldColor = cell.Style["background-color"];
cell.Style["background-color"] = Green;
(onMouseOut)
cell.Style["background-color"] = oldColor;
That should give you the required functionality

C# Auto Resize Form to DataGridView's size

I have a Form and a DataGridView. I populate the DataGridView at runtime, so I want to know how do I resize the Form dynamically according to the size of the DataGridView? Is there any sort of property or method? Or do I have to determine the size myself and update accordingly?

You can find the actual width by count Columns width.
Don't forget that your form may be more complex and your should count other controls.
public class YourForm : Form
{
public YourForm()
{
DataGridView _dgv = new DataGridView() { Dock = DockStyle.Fill};
Controls.Add(_dgv);
}
public void CorrectWindowSize()
{
int width = WinObjFunctions.CountGridWidth(_dgv);
ClientSize = new Size(width, ClientSize.Height);
}
DataGridView _dgv;
}
public static class WinObjFunctions
{
public static int CountGridWidth(DataGridView dgv)
{
int width = 0;
foreach (DataGridViewColumn column in dgv.Columns)
if (column.Visible == true)
width += column.Width;
return width += 20;
}
}

int dgv_width = dataGridView1.Columns.GetColumnsWidth(DataGridViewElementStates.Visible);
int dgv_height = dataGridView1.Rows.GetRowsHeight(DataGridViewElementStates.Visible);
this.Width = dgv_width;
this.Height = dgv_height;
this.Width resizes this Form width.
Of course you've to add fixed values (for example margin, Form title heigth, ecc.).
With tests i've reached the values working for me (don't ask why...):
this.Width = dgv_width + 147;
this.Height = dgv_height + 47;

Normally controls adapt their sizes to the size of the containing form. To adjust the size of your form to the size of your DataGridView, you do have to determine the size yourself and then set the form's size to match, remembering to take into account the extra size required by the form's menu strip and/or toolbars, status bars or other controls.
In your case, it would probably be best not to resize the form to match the grid view control. Most likely, you will have many more rows in your grid view than could fit on your Windows screen, and you don't want to have a form that extends below the viewable desktop area. Generally speaking, this type of situation is exactly why you want to have a scrollable grid view - for viewing more data than can fit on the screen at one time.

I would go the other direction and size the grid to the form. (some users may have low res)
Set 'WindowState' property of the form => maximized. (optional)
Set 'anchor' property of the DGV => 'Top, Bottom, Left, Right'.

You may be able to make use of the PreferredSize property (MSDN PreferredSize entry). For DataGridView controls, I found that the preferred width and height were about 20 units bigger than I expected. I guess that the control might be calculating its preferred size taking scroll bars into account.
Another caveat I discovered is that the PreferredSize calculation will not be accurate immediately after adding or changing items in the table. To get around this I made a handler for the RowHeadersWidthChanged event.
Here is what worked for me:
class GridToy {
private DataGridView grid;
public GridToy(DataGridView dgv) {
grid = dgv;
grid.RowHeadersWidthChanged += AdjustWidth; // Event handler.
Layout();
}
public void Layout() {
// Just do some arbitrary manipulation of the grid.
grid.TopLeftHeaderCell.Value = "Some Arbitrary Title";
}
public void AdjustWidth() {
Control horizontal = grid.Controls[0]; // Horizontal scroll bar.
Control vertical = grid.Controls[1]; // Vertical scroll bar.
grid.Width = grid.PreferredSize.Width - vertical.Width + 1;
grid.Height = grid.PreferredSize.Height - horizontal.Height + 1;
}
}

You could set the Property " Height " to Auto in the form after classifying or using an ID and this should do it ,,
I just tried it .. and It worked
#form1{
background-color:white;
height:auto;
width:1500px;
border-top:medium solid #3399FF;
margin-top:100px;
margin-left:30px;
display: inline-block;
text-align: center;
float: none;
}
I'm just putting exactly what I did in case you got lost .. Don't worry about the other properties there for my design.

Set AutoSizeColumnsMode :Fill in Grid Properties