locked
Best approach for achieving the below mentioned senario RRS feed

  • Question

  • Hi,

    I have two pages. In page1 I will be displaying list of Items which are constructed with the date that is stored permanently in JSON format. When user clicks on a particular list I want to fetch the data from JSON object and populate in another XAML page.

    There will be an option to the user to update the form fields and submit(That particular object should be updated). I have following elements in the form. 

    ToggleSwitch, ListPicker, TextBox and checkBox.

    I have one approach i.e pass the value from one page to another in NavigationService set the values in the other page.

    I am a beginner. I want to learn with best practices. If anyone worked on same lines and have a sample code for achieving this please share. 

    I got struck up after passing values to the next page.

    Monday, April 7, 2014 10:46 AM

Answers

  • In your updateexpenses.xaml.cs you are loading the data from your storage file in OnNavigatedTo method.  At the end of that method you can set the data context for the page to the correct ExpenceData object:

                if(data != null)
                    this.DataContext = data.Expences[Convert.ToInt32(selectedIndex)];

    Then bind your controls to the properties on the ExpenceData object.


    Bret Bentzinger (MSFT) @awehellyeah

    Thursday, April 10, 2014 3:42 PM

All replies

  • It sounds like your static data source is data stored somewhere in JSON Format.   You basically need the following logic flow:

    1) Get data for selected item

    2) Update Data

    3) Save data

    4) Refresh main view

    There are numerous ways you can do this.  You probably want a data class that derives from INotifyPropertyChanged that you can two-way bind your controls too. in the form.  This way when the data in the form is changed the data in your class is changed.  Then when the user clicks the Submit button in your form, you can do the update to the database.  In the OnNavigatedTo() for the Page 1 make sure you refresh data from the database.


    Bret Bentzinger (MSFT) @awehellyeah

    Monday, April 7, 2014 11:55 PM
  • @Bret Bentzinger :

     Thanks for your response and suggestions. I have gone through the INotifyPropertyChanged Interface examples given online. I got jammed when I tried to implement it.

    I have 3 viewmodel classes, ExpensesModel, ExpensesGroup and ExpensesData. When user open the Expenses page he will see list of expeses. They are categorized into two pivot items Given and Taken.

    I am passing index of clicked item and expenses type(given or taken) as parameters to next page. I saved the data in serializable data Storage. I am able to retrieve the data but not able to show it there. 

    And also how should I update the targeted item(Given Item or Taken Item) object clicked by user and how should I bind view, view model accordingly?

    I have attached the working code in the below mentioned link. Could you please tell me where I did wrong and how to proceed on updating the Model and view using INotifyPropertyChanged.

    https://onedrive.live.com/redir?resid=83F2A501543779D4%211222

    Wednesday, April 9, 2014 2:26 PM
  • The reason you do not see any data in the updateExpences.xaml view is because you haven't bound the data to the controls.  I also noticed you were not using databinding in the AddExpence.xaml either, instead you are programatically adding the values.  I suggest looking at the DataBinding sample here:

    http://code.msdn.microsoft.com/wpapps/Data-Binding-7b1d67b5

    What you are doing to pass data to the page is fine, and the data is loaded if you look at your "data" object you see the records in their.   There just isn't any code that populates the controls with the values from the object.  And I suggest you use data binding for that.


    Bret Bentzinger (MSFT) @awehellyeah

    Wednesday, April 9, 2014 11:18 PM
  • @Bret Bentzinger

    I have cleared all the new changes and shared working code. So I removed all those bindings. Could you help me for achieving this. i.e for populating the data in updateExpences.xaml when an user clicks on particular listItem( using the data binding).

    Thursday, April 10, 2014 9:45 AM
  • In your updateexpenses.xaml.cs you are loading the data from your storage file in OnNavigatedTo method.  At the end of that method you can set the data context for the page to the correct ExpenceData object:

                if(data != null)
                    this.DataContext = data.Expences[Convert.ToInt32(selectedIndex)];

    Then bind your controls to the properties on the ExpenceData object.


    Bret Bentzinger (MSFT) @awehellyeah

    Thursday, April 10, 2014 3:42 PM
  • @Bret Bentzinger

    Thank you so much Bret. It is working. I am working on updating the data. In my sample project, suggest me how to proceed.

    Friday, April 11, 2014 10:50 AM
  • You can do the same thing you are doing in your AddExpence page, handle the update button and save back to the file.  The only thing I can see becoming a problem is using the index into the array of json objects.  You may want to add a unique ID to yoru data structure, and use that to find the objects, instead of the index



    Bret Bentzinger (MSFT) @awehellyeah

    Friday, April 11, 2014 4:49 PM
  • @Bret Bentzinger (MSFT)

    On clicking update button

           private void update_Expense(object sender, System.Windows.Input.GestureEventArgs e)
            {
                thisExpence.Amount = amount.Text;
                MessageBox.Show(thisExpence.Amount.ToString());
                thisExpence.ExpenseTitle = ExpenseName.Text;
                ListPickerItem PaidThroughListPicker = (ListPickerItem)paidThrough.SelectedItem;
                thisExpence.PaidThrough = (String)PaidThroughListPicker.Content;
                thisExpence.expenceStatus = (bool)PaymentStatus.IsChecked;
                ListPickerItem listPickerItem = (ListPickerItem)TypeofTransaction.SelectedItem;
                thisExpence.TypeofTransaction = (String)listPickerItem.Content;
                if (thisExpence.TypeofTransaction == ExpencesModel.ExpencesGivenKey)
                {
                    var data = JsonConvert.SerializeObject(App.ViewModel.Given);
                    IsolatedStorageSettings.ApplicationSettings[ExpencesModel.ExpencesGivenKey] = data;
                }
                else
                {
                    var data = JsonConvert.SerializeObject(App.ViewModel.Taken);
                    IsolatedStorageSettings.ApplicationSettings[ExpencesModel.ExpencesTakenKey]. = data;
                }
                IsolatedStorageSettings.ApplicationSettings.Save();
                NavigationService.Navigate(new Uri("/ExpencesPage.xaml", UriKind.RelativeOrAbsolute));
            }

    On navigating to the page 

                                        

     protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
            {
                base.OnNavigatedTo(e);
                String dataFromAppSettings;
                ExpencesGroup data;

                NavigationContext.QueryString.TryGetValue("selectedExpenceObject", out selectedIndex);
                NavigationContext.QueryString.TryGetValue("TypeofTransaction", out TransactionType);
                if (TransactionType == ExpencesModel.ExpencesGivenKey)
                {
                    if (IsolatedStorageSettings.ApplicationSettings.TryGetValue(ExpencesModel.ExpencesGivenKey, out dataFromAppSettings))
                    {
                        data = JsonConvert.DeserializeObject<ExpencesGroup>(dataFromAppSettings);

                        if (data != null) {
                            thisExpence = data.Expences[Convert.ToInt32(selectedIndex)];
                            this.DataContext = thisExpence;
                            SwitchBetweenListItems(thisExpence.TypeofTransaction);
                            SwitchBetweenListItems(thisExpence.PaidThrough);
                        }
                    }
                }


                else
                {
                    if (IsolatedStorageSettings.ApplicationSettings.TryGetValue(ExpencesModel.ExpencesTakenKey, out dataFromAppSettings))
                    {
                        data = JsonConvert.DeserializeObject<ExpencesGroup>(dataFromAppSettings);
                        if (data != null) {
                            thisExpence = data.Expences[Convert.ToInt32(selectedIndex)];
                            this.DataContext = thisExpence;
                            SwitchBetweenListItems(thisExpence.TypeofTransaction);
                            SwitchBetweenListItems(thisExpence.PaidThrough);

                        }
                    }
                }



            }

            private void SwitchBetweenListItems(string p)
            {
                switch(p)
                {
                    case "Given":
                        TypeofTransaction.SelectedItem = Option11;
                        break;
                    case "Taken":
                        TypeofTransaction.SelectedItem = Option12;
                        break;
                    case "Cash":
                        paidThrough.SelectedItem = Option1;
                        break;
                    case "Online":
                        paidThrough.SelectedItem = Option2;
                        break;
                    case "Credit Card":
                        paidThrough.SelectedItem = Option2;
                        break;
                    case "Debit Card":
                        paidThrough.SelectedItem = Option2;
                        break;
                }
            }  

    I tried update selected object in the above mentioned way. I did not find any method to set or update. It did not work out. Can you tell me where I am going wrong. 

    Monday, April 14, 2014 9:14 AM
  • I have updated the code in the below mentioned link. Can you please look into it.

    https://onedrive.live.com/redir?resid=83F2A501543779D4%211229

    Monday, April 14, 2014 9:19 AM
  • On clicking the update button, I am getting all the form elements. thiseExpence refers to the item that an user clicked. It is initialized after the navigating this particular(updateExpense.xaml) page. I serialized the date and gave IsolatedStorageSettings.ApplicationSettings.Save() to save the data object. The updated values are not being saved.

    var data = JsonConvert.SerializeObject(App.ViewModel.Given);

    "Given" refers to the whole object. I have set current object with updated values, searilizing whole object and saving the whole object again. If this is the cause for problem, How should I save current object permanently to isolated store? 

    Wednesday, April 16, 2014 6:03 AM