Having many GWT DialogBox'es, the first one always stays at the bottom and new ones are created on top.
What I am trying to obtain is a way to bring one of such dialogs on top when it is clicked.
I haven't found the GWT approach to handle depth (something related to a CSS label z-index but it lacks some documentation).
I think, you can use something like this:
DialogBox d=new DialogBox();
d.getElement().getStyle().setZIndex(intValue);
You can also define a CSS rule for all DialogBoxes in the system:
#external gwt-PopupPanel;
#external gwt-DialogBox;
#external gwt-PopupPanelGlass;
.gwt-PopupPanel, .gwt-DialogBox, .gwt-PopupPanelGlass {
z-index: 1000;
}
(Remove the #external references if you are not using CssResource).
That way all your popups, dialogboxes and popup glasses will be over other items in the page. Make sure no other item has z-index above the value you choose (in my example, 1000).
Related
In Wicket, I have created a form containing one drop down and palette of same data type. If I want to move items from available section to selected based on the value selected in the drop down. How to do that?
2 ways to do this: either client-side with javascript or server side with ajax.
If you were to do it with Ajax, you could use an AjaxEventBehavior to detect that there was a change in the dropdown. Then change the model of the palette's selection to whichever items you'd like to be selected. Then re-render the palette by adding it to the AjaxRequestTarget given to you by the AjaxEventBehavior#onEvent. This would have a slight latency compared to the javascript solution, but it would be cleaner, as it would use Palette the way it was meant to be used (in a sense). I feel like it could make your life easier down the line.
If you were to do this via javascript, you could bind an onchange event listener to your dropdown, which would move the options from one side to another. The palette works by using two <select> components for the display and a single <input type="hidden"/> for passing the selection back to wicket. In order to do what you ask via javascript you would have to move the <option> components from one <select> representing unselected components to the other, and then modifying the value of the hidden input to contain/no longer contain the ID value of the selection.
This solution is a bit more dirty in my opinion, but it would probably reap you the best performance.
I'm new to coding JavaFX and I'm trying to create two checkboxes that will allow a user to remember his username/ password when logging in/out. Coding this isn't the problem; I'm having a hard time graying out the checkboxes (I want the password box to be grayed when the username box isn't checked). Here is a little snippit of code:
CheckBox rememberUsername = new CheckBox("Remember username?");
CheckBox rememberPassword = new CheckBox("Remember password?");
rememberPassword.setStyle("-fx-opacity: 1");
I read an online guide on getting CSS to work, and it said to extract:
/jdk1.8.x/jre/lib/ext/jfxrt.jar in C:\Program Files\Java, which I did. I'm using Eclipse, and when I load my program, it's as if there's no CSS at all.
Thanks in advance!!
When you disable a control, it will set the opacity to 0.5 (by default) and make it so that the control is not responsive. Opacity of 0.5 will look similar to a grayed out control.
rememberPassword.disableProperty().bind(
rememberUsername.selectedProperty().not()
);
This is probably what you really want to do, rather than just modifying the CSS style to gray the control out.
In the unlikely event that you don't want to disable the control when you gray it out, you can do:
rememberPassword.opacityProperty().bind(
Bindings.when(
rememberUsername.selectedProperty()
).then(1).otherwise(0.5)
);
And, in the equally unlikely event that you want to gray it out without disabling it and you want to use inline CSS for this, you can do:
rememberPassword.styleProperty().bind(
Bindings.when(
rememberUsername.selectedProperty()
).then("fx-opacity: 1;").otherwise("-fx-opacity: 0.5;")
);
I'm having a problem where zk 3.6.3 is rendering a second <tbody> tag for a Listbox. Actually the first rendered <tbody> tag is the one that is making me problems. It has it's css style set to visibility:hidden;height:0px and Opera 12 and IE 11 are rendering a large white empty space for it. So in the browser I see the table header, this empty space and then the actual rows of the listbox.
The problematic code for zkoss rendering is contained in org.zkoss.zkmax.zul.render.ListboxDefault in lines 53-63.
How can I prevent zkoss or browsers from rendering this empty space?
Well, there is always a solution and maybe the "hacking" solution is the best here :
Class overriding of that class.
Create that package and create that class (exactly the same package and classname).
Copy the code from your link to your class.
Change the code, I'll suggest try to remove the complete if. => See what result it gives (test al your listboxes!)
When you ever think of upgrading ZK version : Don't forget to remove or update the class !!!
If removing doesn't help, try to change the style,...
On the other hand, if updating ZK version is possible, you should try that.
The version you use is old, and doesn't support newer browsers.
The first tbody contains the list header (no, I don't know why they don't use thead for this). If you don't add one to the list, the CSS visibility:hidden;height:0px should make it invisible on the screen and that works for me.
My guess is that somewhere in the app, you have CSS rules which override this style. So the next step is to fire up the web developer tools and check which CSS styles are actually applied.
Alternatively, you can give the list box a custom class setSclass("hiddenheader") and then use CSS like this:
table.hiddenheader tbody:first-child { display: none; }
(note: I didn't test this; ZK might add some prefix to the styles so you might have to adjust the code but the example should get you started).
In the most bizarre of circumstances, the label for my checkbox do not show up in my Struts2 JSP. I have a series of checkboxes, all following the same format, but none of the labels appear. Here is a sample declaration:
<s:checkbox name="chronCheck1" label="New Sales"/>
This is among the most basic of tasks, but something is obviously missing. I am running Struts2 version 2.2.1 via Weblogic 10. Not really sure what else is necessary to help troubleshoot.
You are probably using simple theme in your JSP. With simple theme you must create labels for inputs by yourself.
About simple theme from documentation:
For example, the textfield tag renders the HTML tag without a label, validation, error reporting, or any other formatting or functionality.
See http://struts.apache.org/2.x/docs/themes-and-templates.html.
It is not very clear from the official documentation for the s:checkbox, but in my experiment, if you don't specify the theme, the default theme does not support label. When I change the theme to either xhtml or css_xhtml it successfully showed the label. However these themes also add additional markup and css classes, so you probably need extra css styling and specifying labelposition (top, left, right or bottom) to achieve your desired look and feel. Another option is to create your own theme and apply it. Please refer to this documentation:
https://struts.apache.org/docs/struts-2-themes.html
I want to implement some functionality--there are multiple rows with a checkbox at the starting in a jsp file in struts2.1 framework. If the checkbox is checked then at the same instant the color of that row should change, like it is selected. How should I implement this?
I recommend the jQuery plugin – tableRowCheckboxToggle (demo)
I agree with lschin; use a canned solution.
That said, you could also do it "manually" using jQuery or similar. Attach an onclick handler to each checkbox that sets a CSS style on its containing row.
Simplistically, use the checkbox's onclick attribute to provide a click handler and an ID that can be used to find the containing row.
Less obtrusively (and arguably better all around), find the row containing the checkbox by walking up the DOM (in jQuery, something like inside the attached click handler: $(this).parents("tr")[0]) and don't worry about throwing around a lot of IDs.