Dialog in a Dynamic Content Control - modal-dialog

I have a custom control that contains a dynamic content control. The dynamic content displays one of several custom controls. This control is then added to the middle facet (callback1). A Navigator then controls which panel in the dynamic control displays. To this point everything works as it should.
One of the pages that is displayed in the dynamic content has a button that calls a dialog. When the button is clicked it looks like it it is trying to display the dialog but it does not (no errors reported).
If I put the dynamic content control in a simple XPage and load this XPage and have the panel with the control that contains the button to display the dialog open by default it works fine.
So it would appear that the Extension Library Application Layout is blocking the dialog from displaying. I'm at a loss I have the whole application working but not in the ext Library application layout. Wasting an awful lot of time, and not using the ext library app layout is not a good option either.

Found the problem. On the Application Layout custom Control I had some code in the onClientLoad with a try{}catch. If this code failed it 'blocked' the dialog box from displaying properly but the other functions of the window seems to work OK. So I'm not sure what exactly was going wrong in the inner workings of the Application Layout but I moved the code to the BeforePageLoad event and everything now works fine.
This is the code that I moved from onClientLoad to beforePageLoad :
if (!sessionScope.containsKey("ssHelpRepID")){
try{
sessionScope.put("WFSRulesRepID",database.getProfileDocument("frmConfigProfile","").getItemValue("WFSRulesRepID")[0]);
sessionScope.put("WFSRulesRepID_formula",database.getProfileDocument("frmConfigProfile","").getItemValue("WFSRulesRepID_formula")[0]);
sessionScope.put("WFSHelpRepID",database.getProfileDocument("frmConfigProfile","").getItemValue("WFSHelpRepID")[0]);
sessionScope.put("WFSHelpRepID_formula",database.getProfileDocument("frmConfigProfile","").getItemValue("WFSHelpRepID_formula")[0]);
}catch(e){
sessionScope.put("ssError","Error in setting Rep IDs");
}
}
Once I did that the original Application Layout started allowing the dialog to be displayed. Very strange, wish I could bill the time to someone :-)

Related

How to open a popup on click of button placed in menu page in master detail page in xamarin forms?

I am working on xamarin.forms. I am using Master detail page. In menupage of MasterDetailPage I have some menu items that are listed. At the bottom of the Menu list I placed a button on menu page. Now I need to open a popup on click of that button. I am trying with PopupLayout but not able to get any success.
Please tell me how I can open a custom popup box at the click of the button that is placed in menu page?
Regards,
Anand Dubey
Without going into separate, native projects for all platforms you are targeting (such as Android, iOS, UWP...), you cannot pop out custom UI content over existing pages in Xamarin.Forms out of the box. You would need to bring in additional references or get creative with the AbsoluteLayout control.
Here are a few options you have:
Simple popup with message and or option selection
If all you need is a simple popup message or a list of buttons, you should look into the native DisplayAlert and DisplayActionSheet methods. They are built into Xamarin.Forms and work really well for these simple cases.
More complex popup dialogs
For anything more complex than that, there is the excellent UserDialogs project: ACR UserDialogs github page
It will give you support for various loading dialogs, date, time pickers, action sheet, success/info/error toasts and more.
Fully custom UI markup with AbsoluteLayout
There is a technique where by you prepare the underlying page with a root absoltue layout, which enables you to dynamically add new UI on top of all other controls on your page. This is fiddly and can ruin your performance if you are not careful. This is also the approach that the PopupLayout control that you mentioned uses. If done properly, this can be a good solution, but I don't recommend it as it involves additional complexity on each page that hosts the popup content.
Fully custom UI popup on native projects
Your most flexible option, as always, is to fall back to the native projects. This would involve coding up the popup logic on each separate platform that you are targeting, then using DependencyService (or one of the other techniques) to call into it from the shared project. For this you should look at samples and tutorials for popups on separate native platforms as it gets pretty broad and goes way outside the topic of this question.

Web-site with two Composite per page. Due to bad design?

I'm creating a web-site using GWT for the first time. The aplication has two Composite class, one of them is a menu and the other one is where I show de info about the specific menu that has been clicked. I'm using MVP, the class History and the interface ChangeValueHandler to switch among different pages.
I have one pair presenter-view for each Composite. The app begins well creating the menu and the section info. When you click in the menu it works fine showing the information and the token browser is changed. The thing is that if you load a page(eg: myapp.com#register) without loading the home page, it doesn't show you the menu. It loads the Composite section info, but not the Composite menu (the Composite menu is load with myapp.com#home).
I think it's because of a bad design of the application, but I don't know how to do that in other way. If the app only had one Composite it wouldn't be a problem, but when there are 2 or more Composite per page I don't know how to manage the whole thing to work properly.
It's difficult to tell what exactly is wrong, because of the lack of code. So I'm guessing. You should design to act on the PlaceChangeEvent instead of the ValueChangeEvent. That means a menu click should fire the place change and then the application will handle this event. That way you unbind the menu actions from your content pages. And think more of each page as a separate entity. Also take a look at the GWT Activity mechanism and how it helps having a main page that is always the same and on that main page a content area that changes depending on the page actually shown.
You should include your menu in each page instead of creating it once in the home page and then keeping it on screen. I assume you create the menu and add it to the DOM via
RootPanel.get().add(myMenuWidget);
If you are using UIBinder it should be pretty straightforward to include the menu in each page, just a matter of adding the corresponding tag in each .ui.xml file of your pages.

From modal to off canvas?

I've just started on a new project of my own.
What I would like to do is, on large screens, having a button activating a modal window BUT, on smaller screen (mobiles), I would like that modal window to become an off canvas section and when the button is clicked, the off canvas slides in from the side. Within that modal/off canvas part, there will be a form to fill out. (there will actually be multiple buttons that will need to activate the feature. Think something like multiple thumbnails with each a button to let viewers add comments)
I'm using Bootstrap 3 as my base framework. I would like to minimise the javascript (jQuery) functionalities but I understand I can't completely.
Questions I have,
do I have to create two HTML sections, one for the modal and one for the off canvas and then programatically hide/show according screen size?
Would it be best to create the form and then thru javascript, add the proper HTML around it according screen size? (though I think this option would be a tough to implement as my javascript skills are "advance beginner" at best)
How would I make the same button switch activation of the modal window or the off canvas form?
It seems to me that I need to detect screen size, no matter how I do the above, what would be the best way to detect the screen size, the safest and surest way?
Thanks for any insights you guys might have on this.
You will have to show code in your questions here, so i also vote to close your question.
I'm using Bootstrap 3 as my base framework. I would like to minimise
the javascript (jQuery) functionalities but I understand I can't
completely.
Angular JS decouples Twitter's Bootstrap from javascript. See: http://angular-ui.github.io/bootstrap/
Questions I have, do I have to create two HTML sections, one for the
modal and one for the off canvas and then programatically hide/show
according screen size?
Take a look to the Responsive Utilities: http://getbootstrap.com/css/#responsive-utilities
The screen detection of Twitter's Bootstrap is based on CSS media queries.
How would I make the same button switch activation of the modal window or the off canvas >form?
To give the same button different function based on sceensize you will need javascript / jQuery. See: Get the size of the screen, current web page and browser window you also could consider to use something like enquire.js, see also http://bassjobsen.weblogs.fm/responsive-banner-ads-2/
Or create two buttons and hide / show them with the the Responsive Utilities.

Windows Forms Error Provider does not display in custom tab control

I'm trying to build a Wizard framework in Windows Forms. I've managed to glean a lot of useful tips from this and other sites which have gotten me very close to success. However, I'm having a problem with displaying an ErrorProvider on any tab page other than the first page of the wizard.
My Wizard control is a UserControl. It contains a custom tab control that I've derived from TabControl so that I can hide tabs and ignore attempts to navigate between tabs using keypresses, along with the usual collection of Back/Next/Finish/Cancel buttons at the bottom of the control.
I've used reflection to allow me to raise the validation events on a particular TabPage that belongs to the Wizard Control when I hit the Next button. (I don't want to validate the whole TabControl, only the currently active page.) When I do this, I see in the debugger that my Validating routine for the controls on the current tab page is correctly called and I see that I've called the ErrorProvider that I've attached to the particular control (a TextBox in this case) with a valid error message. I set Cancel to true for the CancelEventArgs in the validating routine and that's picked up by the code that uses the reflection mechanism so that I see that I've failed and don't change tabs. And I set the focus successfully to the control that failed validation.
So all that appears to be working just fine.
Unfortunately, I don't see the ErrorProvider's cheery blinking icon unless I'm on the first tab page. For all of the other tab pages, there's no message visible at all.
I'm baffled. Any thoughts? I can provide code snippets, if helpful.
Thanks!
I assume that in your case the button that moves to the next step of the wizard is placed outside (below) the TabControl
I noticed that the icon is displayed correctly if I pressed the button without releasing the mouse button. It seems that the button outside the container gets focused event though a validation error has occurred (normally you would not be able to leave the active control).
I worked around this issue by registering an event handler for the buttons MouseUp event to "refocus" the TabControl:
private void cmdOK_MouseUp(object sender, MouseEventArgs e)
{
tabControl1.Focus();
}
Note: you also need to set your forms ActiveControl property the one of the controls that failed validation.

Wicket: Form in a modal window

I have written an panel which supports file / image uploads. So the panel is a simple plain form. The panel works in a normal Wicket page.
What I would like to do now:
I would like to use the panel in a modal window. The panel is displayed correctly. However, when I submit it / upload a new file, my browser prompts whether or not I would like to leave the page. The page which contains the DIV of the modal window is a form itself.
My research didn't turn up any interesting information about forms in a modal window expect it has to be self contained (nested form). I think this prerequisit is met.
Is there any information available, what I have done wrong? Any tutorials?
You need to use an AjaxSubmitButton (or AjaxSubmitLink) to submit your form. The problem is that the modal window requires Ajax communication. If you use the window to just reprocess a whole page and don't care about the Ajax'ness, then you can override the ModalWindow#getCloseJavaScript() method.
As Martijn pointed out, the modal window relies on AJAX communication. So use AjaxSubmitButton or equivalents. When components in the main window need to be updated after the submit of the modal window, this can be done by adding them to the AjaxRequestTarget.
However when it comes to multi part forms (file uploads) this does not work quite. Apparently multi part doesn't play nicely with AJAX. One has to do an IFrame trick as pointed out e.g. here: http://www.dooriented.com/blog/2008/04/23/wicket-ajax-like-file-upload-on-a-modal-window/