CODEWITHSUNDEEP
c#xamlwindows-phone-8
Tobias Hagenbeek
Tobias Hagenbeek

Reputation: 1213

Use Response from Webservice to create xaml list

I am trying to use a response i receive (successfully) from a webservice, and use that to "create" or "populate" a list on the xaml side...

Here's the json 

{  
   "success":true,
   "code":200,
   "rows":[  
      {  
         "Purchase":{  
            "id":"1"
         },
         "Who":{  
            "id":"1",
            "value":"NA"
         },
         "What":{  
            "id":"1",
            "value":"what-text"
         }
      },
      {  
         "Purchase":{  
            "id":"2"
         },
         "Who":{  
            "id":"2",
            "value":"ME"
         },
         "What":{  
            "id":"1",
            "value":"what-text"
         }
      }
   ]
}

And i get the Webservice from my CS like this..

HttpWebRequest hwr = rez.AsyncState as HttpWebRequest;
HttpWebResponse response = hwr.EndGetResponse(rez) as HttpWebResponse;
string jsonResponseString = (new StreamReader(response.GetResponseStream(), Encoding.UTF8)).ReadToEnd();

Dispatcher.BeginInvoke(() =>
{
    var responseObject =
        Newtonsoft.Json.JsonConvert.DeserializeObject(jsonResponseString);
});

Which works. "jsonResponseString" comes back with the json shown above.

Now i would like to show these results on my xaml page. Here i already have the question what is best to use.. a LongListSelector? or should a table work?

In my CS i have also setup:

public class Purchase
{
    public List<string> Who { get; set; }
    public List<string> What { get; set; }
}

public class RootObject
{
    public List<Purchase> purchase { get; set; }
    public int success { get; set; }
    public string message { get; set; }
}

I found somewhere i could use those, but that might not be needed.

Well anyway so i would love to figure out what is best to use in my xaml view and how i use the json returned string or object to populate the data into that view?

Thanks!

Upvotes: 1

Views: 139

Answers (1)

McGarnagle
McGarnagle

Reputation: 102793

Your classes should be set up like this to match the JSON structure:

public class Item
{ 
    public int id { get; set; }
    public string value { get; set; }
}

public class Row
{
    public Item Purchase { get; set; }
    public Item Who { get; set; }
    public Item What { get; set; }
}

public class RootObject
{
    public List<Row> rows { get; set; }
    public bool success { get; set; }
    public int code { get; set; }
}

Then you can deserialize to your typed "RootObject":

RootObject responseObject = Newtonsoft.Json.JsonConvert.DeserializeObject<RootObject>(jsonResponseString);

As for the presentation, you could use any number of controls:

  • ListBox allows user selection
  • LongListSelector is like ListBox but is good for large-ish collections
  • ItemsControl is useful if you want to just display the collection

Let's say you go with ListBox -- then it's just a matter of setting its ItemsSource equal to "responseObject.rows", specifying an ItemTemplate. For example, this will display "Who" and "What" as columns:

<ListBox>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding Who.value}" />
                <TextBlock Grid.Column="1" Text="{Binding What.value}" />
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalAlignment" Value="Stretch" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

Upvotes: 3

Related Questions