JS - Optional function parameters

Sometimes you want to call the same JavaScript function with a different number of parameters, to replicate the overloading we use in, for instance, .NET. This is how to do it:

function setMenu(param1, param2){
  if(param2 === undefined){
    param2 = -1;
  }
  //Code
}

You can call this function in multiple ways:

setMenu(0, 5);
setMenu(0); //Param2 will be set to '-1' by the function

And both will work.

SL Toolkit chart - clickable legend items

The Silverlight Toolkit chart allows for click-though by setting IsSelectionEnabled to true on the series, and attaching the SelectionChanged event. Now you can click on bars or pie slices, and interact on that.

But what if you want to also make the legend beside the chart clickable. That's not supported out of the box. You do this by changing the Legend Items template.

The template

Define a template like the following for the legend items. I've put this as a resource in the Grid that contains my Chart.

<Grid.Resources>
 <Style x:Key="CategoryLegendItem" TargetType="toolkit:LegendItem">
  <Setter Property="Template">
   <Setter.Value>
    <ControlTemplate TargetType="toolkit:LegendItem">
     <StackPanel Orientation="Horizontal">
      <Rectangle Width="8" Height="8" Fill="{Binding Background}" Stroke="{Binding BorderBrush}" StrokeThickness="1" Margin="0,0,3,0" />
      <HyperlinkButton Content="{TemplateBinding Content}" Click="HyperlinkButton_Click" />
     </StackPanel>
    </ControlTemplate>
   </Setter.Value>
  </Setter>
 </Style>
</Grid.Resources>

Notice how I replaced the default Title element that displays the legend item text by a HyperlinkButton. That way it actually looks like something that can be clicked. This button also triggers the click event.

The code

First, the series LegendItemStyle must be set to the custom template. Since my chart is created in code I've put:

series.LegendItemStyle = (Style)LayoutRoot.Resources["CategoryLegendItem"]

Finally there's the HyperlinkButtons click handler.

private void HyperlinkButton_Click(object sender, RoutedEventArgs e) {
  RowPrestation row = (RowPrestation)((sender as HyperlinkButton)
                      .DataContext as PieDataPoint).DataContext;
  PieSeries series = (PieSeries)(Chart.Child as Chart).Series[0];
  series.SelectedItem = row;
}

Notice that the DataContext of the HyperlinkButton contains the PieDataPoint — in case of a pie chart — that goes with the legend item in question. And if you cast it, that points DataContext contains the bound object that was used as ItemsSource. Mine was a List<RowPrestation>.

MVC/JavaScript - Serialize an object on the server to use in JavaScript using JSON

While coding a project in MVC, I wanted to serialize an object in C#, put it in the ViewBag and on the client have JQuery parse it back into an object for JavaScript to use. It can be done like this:

Server side

In the controller action, simply serialize the object this way:

ViewBag.DataFilter = new JavaScriptSerializer().Serialize(filter);

Where filter is the object.

Client side

On the client, you can parse it back like this:

//Parse
parser = document.createElement('div');
parser.innerHTML = '@(ViewBag.DataFilter)';
var DataFilter = $.parseJSON(parser.innerHTML);
//Test
alert(DataFilter.Fields[0].FieldName);

And that's all there's to it.

C# - Calling a web service with GET or POST

For a dashboard I needed to connect to a Google web service and retrieve data from it. I was working in Silverlight, but Silverlights security model did not allow me to call Googles web service, so I called from an ASP.NET web service as follows:

[WebMethod]
public WebServiceResponse CallService(string name,
                                      string url,
                                      string method,
                                      string contentType,
                                      string postData) {
  WebServiceResponse result = new WebServiceResponse();
  try{
    //Convert the post data into a byte array
    //The post data is a string like "username=EGS&password=305"
    byte[] data = null;
    if (!string.IsNullOrEmpty(postData))
      data = Encoding.UTF8.GetBytes(postData);

    //Create the request and write the post data to it if any
    WebRequest request = WebRequest.Create(url);
    if (!string.IsNullOrEmpty(method))
      request.Method = method;
    if (!string.IsNullOrEmpty(contentType))
      request.ContentType = contentType;
    if (data != null) {
      request.ContentLength = (long)data.Length;
      using (Stream stream = request.GetRequestStream())
        stream.Write(data, 0, data.Length);
    }
    else
      request.ContentLength = 0L;

    //Get the response from the web service
    using (WebResponse response = request.GetResponse())
    using (StreamReader reader =
           new StreamReader(response.GetResponseStream())) {
      result.StatusCode =
             (int)(response as HttpWebResponse).StatusCode;
      result.StatusDescription =
             (response as HttpWebResponse).StatusDescription;
      result.Content = reader.ReadToEnd();
    }
  }
  catch (Exception ex) {
    result.Error = "Error: [DashboardService.CallService] " + ex.Message;
  }
  return result;
}

WebServiceResponse is a custom class with the properties StatusCode, StatusDescription, Content and Error.

LINQ - On DataTable

You can transform a DataTable into a List of objects in a single statement using LINQ:

List<Customer> list = (from r in dataTable.AsEnumerable()
                       select new Customer {
                         Id      = r.Field<int>("Id"),
                         Name    = r.Field<string>("Name"),
                         Created = r.Field<datetime>("Created")
                       }).ToList();

To use AsEnumerable, you need to reference the assembly System.Data.DataSetExtensions (.NET 3.5) or include System.Data (.NET 4.5).

LINQ - List DataTable columns

How can you get a List of DataTable columns using LINQ?
The dataTable.Columns property cannot be queried with LINQ because it's a DataColumnCollection. Such a collection implements IEnumerable, but it's not a IEnumerable<DataColumn>, and therefore must be cast as such:

List<string> columnNames = (from c in dataTable.Columns.Cast<datacolumn>()
                            select c.ColumnName).ToList();

Silverlight - Bindable DataGridColumn headers

When using a DataGrid in Silverlight, you might want to bind it's column headers. For localization purposes for instance. You can't bind the DataGridColumns Header property though, because it's not a dependency property. There is a work-around though, using a behaviour:

Interactivity

To use behaviour, you'll need System.Windows.Interactivity.dll. This one comes with Expression Blend. If you don't have that, you'll find it somewhere on the web.

The behaviour

The behaviour is in this class:

public class BindableColumnHeader : Behavior {
  public object Header {
    get { return GetValue(HeaderProperty); }
    set { SetValue(HeaderProperty, value); }
  }
  public static readonly DependencyProperty HeaderProperty = 
         DependencyProperty.Register("Header",
           typeof(object),
           typeof(BindableColumnHeader),
           new PropertyMetadata(
             new PropertyChangedCallback(HeaderBindingChangedHandler)));

  private static void HeaderBindingChangedHandler(
                      DependencyObject o,
                      DependencyPropertyChangedEventArgs e) {
    var behave = o as BindableColumnHeader;
    if (behave != null && behave.AssociatedObject != null)
      behave.AssociatedObject.Header = e.NewValue;
  }

  protected override void OnAttached() {
    if (this.AssociatedObject != null)
      this.AssociatedObject.Header = this.Header;
    base.OnAttached();
  }
}

It needs that .dll from before.

The DataGrid

To use the behaviour in the grid, you'll need both the interactivity dll (i:). and the behaviour class (synbus:). Then define a column like so:

<data:datagridtextcolumn binding="{Binding Customer}">
  <i:interaction.behaviors>
    <synbus:bindablecolumnheader header="{Binding Whatever}" />
  </i:interaction.behaviors>
</data:datagridtextcolumn>