I have a Silverlight 4 application that uses multiple tabs. On Tab 1 I allow the user to select items from a grid, right click and select a context menu item that sends the items to a different grid on Tab 2. However, if the user has not clicked on Tab 2 yet, the grid I am trying to add items to does not exist yet.
What is the most elegant way to make sure that all objects on the second grid are instantiated even if the user has not selected the tab yet?
Thanks,
-Scott
Assuming you are adding items to data grid of some sort then the way to go is to add your items to an ObservableCollection and then data bind the grid to the collection.
That way you don't have to worry about whether the grid is actually visible or not and it will update itself when it does become visible.
Instead of trying to prepopulate the grid on tab2 with data that does not yet exist, you could use the MVVM pattern.
Tab1 could be view1 of viewModel1. Tab2 could be view2 for viewModel2. When view1 updates viewModel1, ViewModel1 updates ViewModel2, which, in turn, updates view2. Then, you only need to set bindings for the visibility, isEnabled, and ItemsSource properties.
Related
I have a Region in the top left of the WPF application which I want to be my global button bar where the user chooses which screen they want to view, and the appropriate content will then be displayed in the main region. THere will also be a sub navigation region in the top right with sub-menu options within that screen, eg if the user clicked "Maintenance" from the main menu, the sub menu would show options for New, Update, Delete, Edit etc.
What I want to have is a way to create a custom menu bar by simply specifying a list of Text button names, and ICommand/Parameter pairs for the action to invoke on button click. The natural way to do this would be have a MenuButtonViewModel class with dependency properties Title, Command and CommandParameter. One more would also be needed, IsSelected, so there is some visual way for the user to see which screen you are currently on, so it needs to behave like a toggle button, but where only one button in the group can be selected at a time. I can then have a UserControl where the content of the bar binds to an ObservableCollection and uses data templates to render the button bar.
I have tried a few ways of doing this so far but cannot figure out a way that gives me the visual behaviour I want. These are my requirements
1) Button to change background to a different Brush OnMouseOver
2) When button is selected, a different Brush is displayed as the background until a new button in the group is selected, like a togglebutton IsSelected behaviour
3) Only one button in the group can be selected at a time
The ways I have tried to do this so far are
1) Extending RadioButton with my own class, adding dependency properties for command and commandparameter. Setting all controls to have the same group Id. Data template to override display of radio button to make it look like a visual button with triggers for mouseover and isselected.
This works fine, except for one thing. Once you select a radio button in a group, there is no way to deselect all options in the radio button group. So if you navigate to "maintenance" and then click the sub menu for "Countries" for example, then you are displayed the country maintenance screen. If you then go to a different area of the app and select "Deal Entry" from the main menu, you are taken to the deal entry screen. If you then click "Maintenance", it displays the generic "maintenance" content and brings back the sub menu control for maintenance, where "Country" is selected in the radio button group, but this is undesirable. When you navigate back to Maintenance, it should deselect all sub menu options, display the generic maintenance landing page content and let you select a sub menu option before displaying that screens content. The first time you load Maintenance, nothing is selected, but once you have chosen an option, then there is no way to have nothing selected again when you reload the maintenance screen.
2) I then tried extending a ListBox, styling it with a horizontal stackpanel for the content, each listboxitem is a menubuttonViewModel. This allows me to only select a single option at a time and to clear the selection when you navigate away from the page. It also lets me change the background when you mouse over each listboxitem.
The bit I can't get working with the listbox is to have the background different on the IsSelected trigger. There seems to be some trigger on the default ListBoxItem template that overrides anything you specify in CSS so no matter what trigger I put on the listboxitem or menubuttonviewmodel style, the background simply does not change. I think I need to redefine the data and content template for listboxitem, but only have it apply for this listbox, so it can't be a global template change to all listboxitems - as I want to be able to use listboxes elsewhere in the app without inheriting this behaviour.
Can anyone give their thoughts on these two approaches and how to perhaps solve the issues I'm having to make one of them work in the way I want, particularly if you can advise how I can override the content/data template for the listboxitems in my style so they do not use the default triggers, and I can get the IsSelected trigger working for me?
If I understood correctly, you would want to clear the selection on the RadioButtons from the Sub-Menu each time you navigate back from another Main Menu option.
In order to solve this, you could have every Radio Button "unchecked" by manually setting the RadioButton´s IsChecked property value to false. A possible solution could be the following:
If you want to clear any checked option from the Sub-Menu everytime you navigate to a different section of the Main Menu, you could first notify to the Sub-Menu´s ViewModel by publishing an event using the EventAggregator after selecting and clicking a different MainMenu button, from the SelectionChangedEventHandler method of the Main Menu´s ViewModel.
Therefore, the Sub-Menu EventHandler of the published event would update each RadioButton´s IsChecked property value to false, which it could be accomplished by using a "Two-Way" Binding between each IsChecked property defined on the View, and each boolean "RadioButton1IsChecked" property implemented on the ViewModel.
I hope this helped you.
I am designing an extjs application where I have couple of panels. and one of them of has a grid. I know I can either do selectionChange on the grid listener or itemClick.
Which one should I use? Or moreover which one is better. I obviously load data on the right panel once the grid item is clicked
The first one get fired only when the selection changes (as you might has guessed) and give you a array of selected record (which might be just one) while the second one get called for each click and give you only the one record you clicked on.
For your case I would tend to use the second event and save the last last clicked record internally. I would then only load the second grid if it was not already loaded for this record.
your grid is displayed as table on page at runtime so you can add onClick() event on grid or table cell during onrowdatabount event of grid.
I have a tabcontrol which i put inside a dataform that is bound to a collection. if I am on page 1 of the dataform and i select tab 2 of the tabcontrol, when i navigate to page 2 of the dataform the tabcontrol default the selected tab to the first tab. I am using MVVM. So, my question is how do i keep whatever tab was selected to stay selected when I am paging thru the dataform records. Thanks.
Its unclear to what exactly is your tabcontrol selected tab bound.
if its bound to a some value on object from collection that you are paging through its quite obvious it wont be saved, because it would mean whenever you change tab index you should update entire collection to same index, so when you tab to next item it has same tabindex as previous item had.
You can do this exactly I guess. or post more code so we can find a better solution.
I have two panes in my page (category and items). The category pane is basically a n-level tree view which controls what items are to be shown on the items pane on the right. So if I choose a category, the items panel on the right hand side will show all items in that particular category (in a datagrid). I am fetching the items from a WCF service in the SelectedItemChanged event.
Now the items grid in the right pane is an editable datagrid. So when a user has some unsaved changes in the grid and tries to change the category, I need to give him a warning message (message box with Ok/Cancel) and on cancel click, I need to suppress this category selection change.
Now, I have tried the the MouseLeftButtonDown event to suppress this, but it somehow doesn't seem to work.
I have refereed this link for the possible solutions.
Can anyone please suggest something?
At the end of your selectedItemChanged event, call [yourTreeView].ClearSelection()
This will give the appearance of the treeview not performing a selection, yet will react as a click.
I'm wondering if I can make fake sections in the popup menu:
The rule would be, if the 5th character of the displayed item is different from the 5th char of the previous item in the menu, it has to be highlighted
What do you think?
Thanks!
To achieve this would be a hack.
Normally the items that appear in the popup part of a combo box will be an instantiated data template, and each gets its own data item and has no clue or knowledge of the other items in the list, so you couldn't use a converter or anything else to achieve this behavior.
What you could do though is inject (attach) your own control into the popup part of the combo box, and take over the rendering of the data items. How you do this will depend upon which combo box you are using (i.e. MS or some other vendor's) and would be a whole new question.
Would that be easier if I were to create my own combobox as follow:
a TextBox associated with a Button that when pushed would popup a datagrid in which I could implement this conditional formatting?