add image to the content of a column in Infragistics XamGrid, Silverlight - silverlight-4.0

I am using Silveright 4. I have created a xaml page which has an Infragistics XamGrid. The grid has a column called "status" which has 3 values as: completes, started and ongoing. I want to add an image beside the content in the status column from code behind.
I have done something like this:
XamGrid1.columns[2].key
but this returs me the column name but not the content. how can i access the content the the column.. please suggest
Yes.. I want to put a if else condition on the content of the column. suppose the value is "start" then it shoud have a red flag beside it. and if it has a value as "completed" then it should have a green flag.. something like this i want to do.

To have an image in the grid cell you will need to either use a Template Columns or a create your own custom column.
If you use a Template Column, you would add the image to the template and you should then be able to use a binding to the value with a converter to get the correct image in the cell. Refer to Create a Template Column in the help for how to create a Template Column.
If you wish to create a custom column, then you would follow the approach that Devin Rader blogged about in his post titled Creating Custom Columns for the xamGrid.

Here is the a sample of the Template Column and the link to the xamGrid doc. In the Converter is where it chooses the image. the converter will return an image if true and if null or false it will return null.
http://help.infragistics.com/NetAdvantage/Silverlight/Current/CLR4.0/?page=xamGrid_Create_a_Template_Column.html
<ig:TemplateColumn Key="ISFAVORITE"
Width="auto"
HeaderText="Favorite">
<ig:TemplateColumn.ItemTemplate>
<DataTemplate>
<Image HorizontalAlignment="Center" Source="{Binding ISFAVORITE, Converter={StaticResource selectFavImageConverter}}" />
</DataTemplate>
</ig:TemplateColumn.ItemTemplate>
</ig:TemplateColumn>

Related

Telerik for UWP RadDataGrid. Getting single cell value from row selection

I am trying to get the value of a single cell when selecting a row or multiple rows so i can run a query to fill another grid for edit. My DataGrid is bound from a dataset returned by a sql query from wcf service. i have tried accessing grid.selecteditems and have been through the documentation on the datagrid. Any help would be appreciated. if you need any more information just ask!
Reply
i can go into the drop down and see all of my columns in "Class1" (my data model used), but im not sure how to access the specific columns value i need.
If in this case, it seems like the SelectionUnit property for the RadDataGrid is Row which is the default value. If you want to the unit to select is a cell within a grid row, and get the value, you need to set the SelectionUnit to Cell as follows:
<telerikGrid:RadDataGrid
x:Name="grid"
IncrementalLoadingMode="Explicit"
ItemsSource="{Binding}"
SelectionMode="Multiple"
SelectionUnit="Cell"
SelectionChanged="grid_SelectionChanged" />
And to define a Cell when using a selection you can use the DataGridCellInfo class, that holds all the information about it. Code behind for getting the values using DataGridCellInfo class for example:
private void grid_SelectionChanged(object sender, Telerik.UI.Xaml.Controls.Grid.DataGridSelectionChangedEventArgs e)
{
var cells = grid.SelectedItems;
foreach (DataGridCellInfo cell in cells)
{
System.Diagnostics.Debug.WriteLine(cell.Value);
}
}
More details please reference this document.

How to make button as one of the column inside table component in CDE Pentaho?

I am trying to make the table component with the button inside the table column in CDE Pentaho. How can it be achieved?
I guess it will need some work.
In the Draw function of your table, you may put some javascript to manipulate the DOM and add your button : as far as I remember, the draw function receives a parameter that is a structure with the column and row index of the current cell.
Try first this code in the draw function :
function(paramdraw) {
console.log(paramdraw);
}
and look for the content of paramdraw iin the console.
Maybe there is a better way to do it...
What we do here usually is something like editing the query on the datasource with a column that output the HTML code for a button.
SELECT
ID,
NAME,
concat('<input type="button" onclick="alert(',ID,')">click me</input>') as button
FROM
foo
WHERE
bar='bar';
That should display a button. If you are not using a query as datasource, but a transformation the idea is the same. Just make the output contains a string that when interpreted by the browser is a button.
Hope it helps. =)

Visibility converter based on another element width

I have a Silverlight application and I use MVVM.
I would like to display or hide a TextBlock, based on another element current width (or window width at least...). The problem is that I currently have 2 texts on each other if I reduce the width of my window so I need want to hide the second textblock in that case...
I'm a beginner and I know how to use a VisibilityConverter with a boolean from my ViewModel, but not like this...
To bind to a property of another element, you would do something like this:
Visibility="{Binding ActualWidth,
ElementName=TheThingWhoseWidthYouAreBindingTo,
Converter={StaticResource WidthToVisibilityConverter}}"
And then create yourself a WidthToVisibilityConverter that takes the width value and returns a Visibility value.

Datbinding element in list to an item outside of the list

I'm using XAML for a windows phone apps, and I'm binding a collection to graph control within the listbox Itemtemplate. Everything shows correctly except that the Horizontal axis is scaled per the data in the grid and I want them all scaled the same.
I've worked out the Maximum value - which need to establish the data binding - as its in a listbox itemtemplate I can't simply set the value in code. And for the data binding I only seem to see the elements in the collection but the value I have is not an element of the collection.
Is it possible to bind to a property/field of the page - that way I can set the value and all the grids can just bind to this property/fields.
One possible way to bind element inside ListBox item template to property of the page is by using ElementName binding. Simply name the page, then you can set binding source by page name, for example :
<phone:PhoneApplicationPage
..........
..........
x:Name="myPage">
<Grid x:Name="LayoutRoot" Background="Transparent">
<TextBlock Text="{Binding ElementName=myPage, Path=Name}" />
</Grid>
</phone:PhoneApplicationPage>
Above sample will display text "myPage" in the TextBlock. That way of binding also works for elements inside DataTemplate for ListBox item.

How to show a grid view inside a grid view?

I am developing a windows 8 app. And I want to display a GridView inside of another GridView item template. And I have added a visibility binding to the inner GridView, but the binding doesn't work when wrapping the GridViewItems in the outer GridView. It works when i use a simple ListView or GridView without any wrapping.
This is the main GridView with wrapping
<GridView
Name="feedGridView"
Background="Transparent"
SelectionMode="None"
ItemTemplate="{StaticResource MyFeedGridView}">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid Height="600" Orientation="Vertical" />
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
The style for "MyFeedGridView" which contains another GridView
<DataTemplate x:Key="MyFeedGridView">
<Grid HorizontalAlignment="Left" Width="500">
<StackPanel x:Name="gridViewStackPanel" Orientation="Horizontal" >
<GridView
HorizontalAlignment="Right"
x:Name="myFeedGridViewInListView"
ItemTemplate="{StaticResource MyFeedGridViewInListView}"
ItemsSource="{Binding listContent}"
Height="100"
Visibility="{Binding listContent,Converter={StaticResource FeedListToVisibilityConverter}}"
SelectionMode="None"
Width="400" />
</StackPanel>
</Grid>
</DataTemplate>
I am using a converter to hide or show the inner GridView. The below is the converter that i am using
public object Convert(object value, Type targetType, object parameter, string language)
{
List<ContentList> contents = value as List<ContentList>;
return (contents != null && contents.Count > 0) ? Visibility.Visible : Visibility.Collapsed;
}
My problem is that the inner GridView gets hidden for all the items or gets visible for all the items irrespective of the listcontent that I have bound.
I have noticed is that this is happening only when I set the ItemsPanel. If I remove the VariableSizedWrapGrid property then it's working as expected. But I need to wrap the items after each column so I can't do away with it.
Please let me know if you have any clue why this is happening.
Thanks
EDIT:
Attaching image of how the grid view items should be arranged. If you see the first item of the grid view, it has another grid view inside the grid view item representing songs. So this inner grid view will be empty for some items and populated for some. So I had written a visibility converter to show and hide the inner grid view. And when am using the converter,if the first grid view item has inner grid view items(songs then it will show inner grid view for all the items and if the first grid view item doesnt have any inner grid view items(songs) then it hides inner grid view for all the main grid view items.
Let me know if its not clear.
The problem with a GridView is that it uses the same size for all its GridViewItems by default. You can use a VariableSizedWrapGrid as its ItemsPanel, but that will disable virtualization and so you won't be able to use your GridView with a large number of items (more than a few dozen) without incurring performance cost.
For your scenario you could use a GridView with a non-uniform ItemsSource - one where some items represent the main list item and some that represent lists of songs and use the ItemTemplateSelector to specify which template to use for which type of item. It's not ideal of course, but this is what your easiest option is. One problem is that some of these song lists might end up orphaned in a different column than the item they are associated with, so for the ugly workaround you might need to figure out the number of items per column and in the list also include empty items or rearrange the items so that the empty-end-of-column items are filled with items that don't have any song lists associated with them.
A better option might be to use a VariableSizedWrapGrid as ItemsSource or simply use a manually populated Grid and add a more... item at the end that opens a ListView, since vertical lists IMHO are easier to scroll than horizontal GridViews. You would still need to use a non-uniform ItemsSource and ItemTemplateSelector to get the desired layout and keep virtualization of the list, but that's what you get.