Rose Rose - 10 days ago 5
C# Question

Retrieve JSON data in gridview at UWP

have two pages that retrieve data from two pieces of link json. The Page1 displays the JSON data with links: http://.../mobileapp/GetCategoriesXMLa and the Page2 displays the JSON data with links: http://.../mobileapp/GetPostByCategoryXMLa?term_id=(item_id)

I find it difficult to retrieve the data id of the selected menu on the first page to complete the website link (the data for the second page).
Example JSON Page1:
JSON Page1

Example JSON second page:
JSON page2

XAML Page1:

<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemDetailScrollViewer"
Padding="20,0,0,0"
Margin="30,30,30,30"
SelectionMode="None"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick"
DataContext="{Binding SelectedItem, ElementName=itemListView}"
ScrollViewer.HorizontalScrollMode="Auto" ScrollViewer.VerticalScrollMode="Auto"
ScrollViewer.ZoomMode="Disabled">

<GridView.ItemTemplate>
<DataTemplate>
<Grid Height="200" Width="200" Margin="10,10,0,0" Background="{x:Null}" BorderBrush="#FF7A7A7A" BorderThickness="1">
<Image x:Name="menu" Source="{Binding Menu}" HorizontalAlignment="Center" Stretch="Uniform" AutomationProperties.Name="{Binding Name}" ImageOpened="Image_ImageOpened" Loaded="cover_Loaded" Loading="cover_Loading"/>
<StackPanel x:Name="stackJudul" Margin="0,-25,0,0" Height="25" VerticalAlignment="Bottom" Background="#CC7A7A7A">
<TextBlock x:Name="name" Text="{Binding Name}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="Wrap" Foreground="White" FontSize="15" VerticalAlignment="Center" HorizontalAlignment="Center" FontWeight="SemiBold"/>
</StackPanel>
<TextBlock x:Name="ID" Text="{Binding ID}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="Wrap" Foreground="White" FontSize="17" VerticalAlignment="Center" HorizontalAlignment="Center" FontWeight="SemiBold" Visibility="Collapsed"/>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>


Page1 Code:

private async void Store()
{
try
{
var httpClient = new HttpClient(new HttpClientHandler());
string urlPath = "http://..../mobileapp/GetCategoriesXMLa";

var values = new List<KeyValuePair<string, string>>
{

};

HttpResponseMessage response = await httpClient.PostAsync(urlPath, new FormUrlEncodedContent(values));
response.EnsureSuccessStatusCode();

if (!response.IsSuccessStatusCode)
{
loading.IsActive = false;
RequestException();
}

string jsonText = await response.Content.ReadAsStringAsync();
JsonArray jsonData1 = JsonArray.Parse(jsonText);

foreach (JsonValue groupValue in jsonData1)
{

JsonObject groupObject = groupValue.GetObject();

string menuId = groupObject["id"].GetString();
string title = groupObject["name"].GetString();
string button = groupObject["thumbnail-200x200"].GetString();

FurnitureHome file = new FurnitureHome();
file.ID = menuId;
file.Menu = button;
file.Name = title;

datasource.Add(file);
}

if (jsonData1.Count > 0)
{
itemGridView.ItemsSource = datasource;
}
else
{
loading.IsActive = false;
statusKosong.Visibility = Visibility.Visible;
}
}
catch (HttpRequestException ex)
{
loading.IsActive = false;
RequestException();
}
}
}
private void ItemView_ItemClick(object sender, ItemClickEventArgs e)
{
FurnitureHome item = e.ClickedItem as FurnitureHome;
Furniture itemDetail = new Furniture();
DetailId.Text = item.ID;
itemDetail.ID = DetailId.Text;
this.Frame.Navigate(typeof(FurnitureCategory), itemDetail.ID);
}


Example display page1:
Page1

XAML Page2:

<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemDetailScrollViewer"
Padding="20,0,0,0"
Margin="30,30,30,30"
SelectionMode="None"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick"
DataContext="{Binding SelectedItem, ElementName=itemListView}"
ScrollViewer.HorizontalScrollMode="Auto" ScrollViewer.VerticalScrollMode="Auto"
ScrollViewer.ZoomMode="Disabled">

<GridView.ItemTemplate>
<DataTemplate>
<Grid Height="140" Width="200" Margin="10,10,0,0" Background="{x:Null}" BorderBrush="#FF7A7A7A" BorderThickness="1">
<Image x:Name="menu" Source="{Binding Gambar}" HorizontalAlignment="Center" Stretch="Uniform" AutomationProperties.Name="{Binding Title}" ImageOpened="Image_ImageOpened" Loaded="cover_Loaded" Loading="cover_Loading"/>
<StackPanel x:Name="stackJudul" Margin="0,-25,0,0" Height="25" VerticalAlignment="Bottom" Background="#CC7A7A7A">
<TextBlock x:Name="name" Text="{Binding Title}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="Wrap" Foreground="White" FontSize="15" VerticalAlignment="Center" HorizontalAlignment="Center" FontWeight="SemiBold"/>
</StackPanel>
<TextBlock x:Name="ID" Text="{Binding ID}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="Wrap" Foreground="White" FontSize="17" VerticalAlignment="Center" HorizontalAlignment="Center" FontWeight="SemiBold" Visibility="Collapsed"/>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>


Page2 Code:

protected override void OnNavigatedTo(NavigationEventArgs e)
{
Furniture detail = e.Parameter as Furniture;
StoreDetail();
}
private async void StoreDetail()
{
try
{
Furniture detail = new Furniture();

var httpClient = new HttpClient(new HttpClientHandler());
string urlPath = "http://indonesia-furniture.com/mobileapp/GetPostByCategoryXMLa?term_id=378";

var values = new List<KeyValuePair<string, string>>
{

};

HttpResponseMessage response = await httpClient.PostAsync(urlPath, new FormUrlEncodedContent(values));
response.EnsureSuccessStatusCode();

if (!response.IsSuccessStatusCode)
{
loading.IsActive = false;
RequestException();
}

string jsonText = await response.Content.ReadAsStringAsync();
JsonObject jsonObject = JsonObject.Parse(jsonText);
JsonArray jsonData1 = jsonObject["posts"].GetArray();

foreach (JsonValue groupValue in jsonData1)
{

JsonObject groupObject = groupValue.GetObject();

double menuId = groupObject["post_id"].GetNumber();
string title = groupObject["post_title"].GetString();
string image = groupObject["featured_image"].GetString();

Furniture file = new Furniture();
file.ID = menuId.ToString();
file.Title = title;
file.Gambar = image;

datasource.Add(file);
}

if (jsonData1.Count > 0)
{
itemGridView.ItemsSource = datasource;
}
else
{
loading.IsActive = false;
statusKosong.Visibility = Visibility.Visible;
}
}
catch (HttpRequestException ex)
{
loading.IsActive = false;
RequestException();
}
}
}


Example display Page2:
Page2

Furniture class:

class Furniture
{
public string ID { get; set; }

public string Title { get; set; }

public string Gambar { get; set; }

public string Deskripsi { get; set; }
}


FurnitureHome class:

class FurnitureHome
{
public string ID { get; set; }

public string Name { get; set; }

public string Menu { get; set; }
}


Thus, the user can select items on Page1 to be able to see the detail of the item. For example a user selects "" on Page1, it will display the menus of the item on page2.
How do I retrieve the id of the items on page1 so as to complement the website address for Page2?
Note: item_id used to complete the link on the link to page2 is the "id" on page1 JSON.
Example for completed link page2: http://..../mobileapp/GetPostByCategoryXMLa?term_id=378
378 is the "id" item is selected by the user on Page1

Answer

in second page you are expect Furniture but in 1st page you set FurnitureCategory change ItemView_ItemClick in 1st page as below

private void ItemView_ItemClick(object sender, ItemClickEventArgs e)
{
    FurnitureHome item = e.ClickedItem as FurnitureHome;
    Furniture itemDetail = new Furniture();
    DetailId.Text = item.ID;
    itemDetail.ID = DetailId.Text;
    this.Frame.Navigate(typeof(Furniture), itemDetail);
}

in second page

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    Furniture detail = e.Parameter as Furniture;
    StoreDetail(detail.ID);//send id
}
private async void StoreDetail(int id) // method change to accept id 
{
    try
    {
        Furniture detail = new Furniture();

        var httpClient = new HttpClient(new HttpClientHandler());
        //build url with given id
        string urlPath = "http://indonesia-furniture.com/mobileapp/GetPostByCategoryXMLa?term_id="+id;