What should be the best UX for a situation where one set of record cannot exist without another.
Take a scenario in an application where a child can be connected to zero or more parents.
If a user of our application finds himself filling a form to create a child but the parent for the child does not exist yet, what is the best approach to creating the parent and then attaching that parent to the child.
Should the child be created without the parent, but updates can be done to add parent to child, note that this also has its own issues as the page where the addition will occur might also need to create the parent.
Have a link on the child page that says "create parent", and route back the user back to the child page after creating the parent.
Have a button bring up a modal that has the parent form and allow the user to create the parent before returning.
I don't like any one of these three options and I am hoping there are better approach out there.
Sorry for any typos or ambiguity, in bit of a rush, also not sure if this is the right place to ask the question.
Since the records are depending on each other I would make sure the user submits these together but make it look like 2 different elements on the same page.
You could use a tab-menu to switch between the child and parent but both should be filled in before submitting. Some inspiration even though you don't need to fill in multiple tabs here. Just make sure it's easy for the user to see that he needs to fill in both tabs.
Another option could be to have the child form collapse when finished/closed like a drop-down menu with an expand arrow button incase you want to edit it again. And the same with a parent box below it. Something that looks a little like this.
They could both be closed at the loading of the page so the user sees both boxes.
Related
I have multiple buttons and form inputs in one page. All these buttons and form inputs need to be disabled or enabled depending on a condition.
I know that it is possible to use the disabled keyword inside a tag to disable a specific input or button. Also, I can just add the code
:disabled="true"
to disable the inputs depending of the boolean value of a variable.
However, this solution is not acceptable for me, since I will have to add this line of code to every inputs on my page (I may create new pages in the future, containing as many inputs).
I would like to know if there's a way that allows me to simply disable the parent container of all the inputs so that the children item (the inputs) are disabled.
If you inspect the Vue instance itself of the VM when running your code you can have something like this when you console.log(this),
It will give you output similar to this if you use the correct scope:
{
$attrs
$options
.......
$el
}
Inside $el there's object properties for accessing firsElementChild, previousElementChild, previousElementSibling, etc. There's a lot of HTML related properties, however, accessing HTML element this way can get messy pretty fast. I think that your best solution is the one you already mentioned or changing the CSS class dynamically.
If you use v-if to conditional render on a parent you can achieve pretty similar functionality too.
See: Conditional rendering
On the selection of one drop-down multiple drop-down generated automatically as per selected value of first drop down.
The value of first drop down is between 1 to 7.
If I select 4 in parent then 4 child drop-down generate.
How to handle this problem by using geb page object and utilize it in test spec.
Sample UI of mentioned problem
How are the child drop-downs generated? Is there some JavaScript involved or are the children already on the page and just not displayed?
For the first option, I suggest you execute the JS script via Geb how to deal with dynamic content.
You can pass parameters to the script (so you can pass what you select in the drop down).
In the page object that describes your page you can do something like:
parent{$("select", id: "parent")}
children {}
and add child dropdowns to children after. (I don't have enough details to give you a precise answer here.)
If the children are just not displayed until you select an option in the parent dropdown you can define them from the beginning in your page object. Even if you don't see them, they exist in the document your browser will interpret.
i am new to GWT and GWTP and the question sounds stupid.. Can I make an abstract PresenterWidget or similiar?
Like in normal Java extending the "class" and reuse / extend the logic. But not only the class, the whole thing of View and Presenter. I try to explain my initial situation and maybe you have another idea.
The image hopefully helps to explain it. The "Main-Tab" and every other tab consists of a collection of views which have the same base structure and the same logic.
the base structure consists of
border around EVERYTHING
an image (the wwitch)
a title
a textarea
a PresenterWidget which is added to a contentSlot of the parent (the menu left)
and below the base are view specific components like buttons, text or any other widget. So a main part of the view with logic is repeading. If the switch is "toggled" the view is hidden (the textarea and any childs / view specific components) like the lowest view in the picture. Furthermore the PresenterWidget left changes the color.
The logic is working, but now I am searching a proper way to solve this without repeading code and the possibility to add child elements which are hidden as well by toggling the switch. Can I add to a PresenterWidget child widgets and define where there should be added? like: Even if this is possible, it feels a bit inconvenient.
Thanks in advance.
I just want to post the solution:
I have now a simple Composite (KPICommonView) for the switch, title and the description. It got another FlowPanel below the description, where the specific components will be added later. For this the Composite implements "HasWidgets" and overrides the "add(Widget w)"-method which is called by UiBinder if the Widget is added and has child elements.
<own:KPICommonView title="First Header" description="I am a happy description :)" anchorToken="{nameAnchors.getFirst}">
<g:Label>child component</g:Label>
</own:KPICommonView>
I am not sure if I do a PresenterWidget for every segment and every PresenterWidget has one of the KPICommonView added, or if I do one normal Presenter which adds more than one of the CommonViews.
The CommonView furhter creates the PresenterWidget for the menu item on the side. It gets the attributes from the constructor (anchorToken, title) and adds it to the slot (which happens ugly, because the View has hard coded the parent saved to call "addInSlot()". The repeading code for the switch is handled by the KPICommonView.
I have a question regarding coded ui UIMap.
Every time I record an action on the same application, coded ui generates a new object for the same window in the application.
It looks like:
UIAdminWindow
UIAdminWindow1
UIAdminWindow2
and so on...
every window class holds different buttons, even though it's the same window.
Thus it's very hard to keep code maintenance.
What i would like is that every time i perform actions and records on a window, even if not at the same time, the already generated class for this window, will be updated with the new controls.
any suggestions to why it happens?
Thanks a lot!
You can clean up your UIMaps by doing two things:
Use the UIMap Toolbox (from codeplex) to move controls within the UIMap so they are all under one control tree.
When you have duplicate UI controls, go to the properties for the action that references the duplicate control and change the UI Control property to point to the original control in the UIMap.
The duplicate trees should now be unreferenced and you can delete it from your map, keeping things clean.
And yes, it's a pain to do, but it's worth it for maintainability.
In UIMap.uitest you can change the action name and the control name for better maintenance.
For example: you can set UIAdminWindow as FirstAcessWindow or other name that will express comfortably the control or the action.
What I can guess is that there is some randomly generated content or element identification data such as class or title that may be causing it. This may be caused by different username for example. Also you can update the element from UI map element tree.
First I apologize for the length but I want to ensure I get enough information out. I have an interesting problem that really shouldn't be difficult. I know that if you want to have the NSOutlineView scroll to and want display a specific row you simply use this pattern:
NSInteger row = [self.myOutlineView rowForItem:myItem];
[self.myOutlineView scrollRowToVisible:row];
I am not using a NSTreeController in favor of using delegation.
I am using an adapter pattern class to act as my data. The adapter wraps a number of different types. It is a simple structure:
[adapter children] ----- *[adapter parent]
So the adapter takes care of dealing with child count, can add, can remove, can expand, etc. and also acts like a data transport object.
So with that all out of the way here is the crux of the problem. When I add a new item to the NSOutlineView I start by adding a new child adapter to the adapter that is selected in the outline view. Then I reload the item with the children using:
[self.myOutlineView reloadItem:selectedAdapter reloadChildren:YES];
I then display the view for this object and attempt to synchronize the NSOutlineView so the selected row relates to the newly displayed view. So in a simple way the steps are:
Initially load the NSOutlineView with data utilizing the NSOutlineDataSource protocol
User selects an item (adapter) that can add child items
User clicks "Add" button
A new empty represented object is created
The new represented object is wrapped in an adapter
The newly created adapter is added to the children of the selected adapter
A new view is created using the new represented object and displayed
The selected (parent) node and its children is reloaded in the NSOutlineView
The newly created row in the NSOutlineView is scrolled to view which synchronizes the view and the selection of the NSOutlineView
So here is the problem. The NSOutlineView will not find the newly added item if you use the rowForItem method. Yet after I reload I can expand the parent node and select the newly added item and everything works fine. In an attempt to fix the problem I have programmatically expanded the parent node (exposing the new item) then attempt to scroll to the new item and it still cannot find the row. The rowForItem returns -1.
Have I missed something when adding a new item that I am not updating something in the NSOutlineView? I've tried many different things without success and any help will be greatly appreciated.
Thanks in advance,
Rob
Solved my own problem...finally.
Since I was adding my first child to that node and it was changing from non-expandable to expandable it needed to be expanded first, then scroll to view, then select the item. No more problem.