I've been doing searches trying to find help on this, but so far all I have found is how to set options for popping up a SharePoint modal dialog box from custom code.
However, I haven't created any custom web parts to display modal dialogs. What's happening, is if someone clicks the upload document button in a library, the upload document modal dialog comes up, but the ok and cancel buttons are half off of the bottom of the box. Users can click on them, but it just doesn't look very good.
I started playing with the CSS to make the modal dialog box bigger to reveal the buttons, and that works for the most part, but the real problem is the grant user permission dialog box.
When that is clicked, it doesn't show the ok and cancel buttons, and maximizing the dialog box doesn't reveal them. The user has to hit tab about 5-10 times before the focus moves to the ok button and is then clickable.
I would post an image, but I don't have enough reputation to do so.
Has anyone come across this? It seems very strange that the out of the box setting would have this problem.
The CSS that I use to adjust the height and width of the modal dialog is:
.ms-dlgFrame, .ms-dlgContent, .ms-dlgBorder, .ms-dlgFrameContainer
I'm just trying to set the height/min-height values, but I haven't had much luck.
We're using Internet Explorer 11 to view the pages.
Stevangelista actually pointed me in the right direction, I wish I could mark comments as answers, and since I'm new I can't upvote the comment, but here's the solution:
I am using a customized master page, and that comment had me take a look at the elements in the page.
Since the master page is being used in the dialog boxes as well, I used the s4-notdlg class to remove parts that weren't needed in the dialogs. Those parts were pushing the buttons below the bottom of the screen.
I'm not a css expert, so there may be ways of keeping those parts and still have the buttons accessible, but the particular issue I was trying to fix was resolved by using the s4-notdlg class to objects in my custom master page.
Related
Let's say there's two buttons on a homepage that both link to the same page. Is there a way to exclusively show a certain part of the page if you click on one button and show a different part if you click the other button?
If this is not an option, would it be possible to store the information of which button is clicked to get to the page?
I'm really quite in the dark on this and barely know how to formulate the questions i am asking, so finding an answer on google is quite difficult. Thanks in advance for any help.
Yes,sure. Just add different parameter to the link on the buttons e.g. page.html?type=1, page.html?type=2. On the target page read the value of the parameter and modify the page accordingly.
I am using the extlib Dialog component to display some data. I want the user to only close the dialog via a button I have in it.
I can't see any option to disable the close icon in the title bar. Can someone point me to the documentation on doing this? So far I've checked the wiki + extlib book (maybe I missed it?).
css rules, again! As far as I can see there's no "native" way to get rid of that close button (and to be honest, I don't think it's a really good idea to do so; see below). But using some css you of course can hide anything you want on your page.
Just give your dialog some custom styleClass; at runtime this custom class is then added to the dialog's outer div-container.
The close button itself is an link inside a span; the has tow style classes, one being "lotusClose".
Finally adding this piece of code to your style sheet will hide the button:
div.yourCustomClass a.lotusClose {display:none;}
Caveat:
The "close" button is there on purpose. And instead of hiding it I would rather add some kind of validation code to your dialog's close event. There are numerous examples, but maybe you just want to refer to dojotoolkit.org's reference for
dijit.Dialog
(section "Forms and Functionality in Dialogs).
Btw: since the dialog is based on dijit.Dialog you may also want to browse stackoverflow's dojo section.
I can't post images yet so if you look here you can see my menu and the shadow from the content on the right is mostly alpha channel that is covering my menu items. This is catching all the interaction that I want to go to the menu buttons. How can I fix this while still having the shadow?
I have already tried these different functions of the View class:
.setAlpha(0);
.setEnabled(false);
.setClickable(false);
.setEnabled(false);
.setFocusable(false);
All to no avail. With .setVisibility(GONE) the buttons work, but there is no shadow. So I need a way to keep the shadow and allow clicks through.
I have created a webpage using Backbone.js and Marionette.js that mostly consists of a bootstrap accordion view that displays a list of items when the accordion header is clicked. Each item can also be clicked, which will show a hidden div of detailed information that pertains to that particular item.
I would like to make this site accessible to people who might not be using a mouse (Maybe they're visually impaired and using a screen reader? Maybe they just don't like clicking things? Either way.) I'm thinking that this would mean being able to press the Tab key to get to the accordion, pressing Space or Enter to open the accordion, Tabbing down (or down arrow key?) through the list items, and then using Space or Enter to show the selected item's hidden div.
I'm finding it difficult to find information on how to add a feature like this, since searches like "How to make an accessible website that can be used without a mouse" mostly turns up blogs on what a developer should do to add accessibility to a page, and not much on how to do it.
Currently, the page doesn't really respond to any keyboard buttons. Any tips or resources you could share would be extremely appreciated. I've been fiddling with ARIA role tags, but I'm either not doing it right or it's not the answer here.
You have to use tabindex
https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.tabIndex
Screen readers automatically read whatever element is the activeElement
I have the ext js drop down menu as shown in the image.
is there any watir method to click on this button?
its respective HTML code is in the image.
thanks,
Naveen Kandakur
See my answer to How to click a strange link looks like button in watir which appears to the the exact same code, and thus gets the same answer.
for which btw I have code that works on the sample site that appears to be the same control, and is why we constantly ask people if there is a site we can access that has the control on it, because nothing works as well as a real example when you are trying to figure out what makes these custom controls tick.