How to hide AspxTextBox? - asp.net

On a radio button checked event, I hide the div by
document.getElementById("AltYukleniciDiv").style.visibility = 'hidden';
But, when I use it for an aspxTextBox, it doesn't hide it. Or when I use the ClientInstanceName instead of document.getElementById(" ")
UnvanText.SetVisible(false); this didn't work either. UnvanText is ClientInsanceName.
javascript crashes there. I put an allert after that and it never shows it. I have to do it because I hide a div, including everything in it, but it still shows the textboxes that has validation. I don't know how it is possible. Can you tell me a way to hide them all? It used to hide the div with all of its contents before I make some validation settings.

It sounds like asp.net is being 'helpful' and changing the IDs of your elements.
Give the text box the attribute ClientIdMode="Static", and it might fix it.

you can add a CssClass attribute to that text box then use it to find the element and hide it.
You can consider using jQuery, so you need to write a single line of code:
$(".MyHideClass").hide();
or set attribute style display:none
I can advice using Firebug (FF Extension) for debugging javascript

Related

Unable to click on hidden checkbox (Selenium-Webdriver)

I have an issue I cannot resolve by myself.
There's a web page with a check box on it. See scr1.png attached.
The check box is some sort of a decoration ( I don't know what this technology is). I cannot click on it, and Webdriver doesn't see it. Real check box is hidden. It is hidden in CSS file (see right corner of a scr1.png)
Now when I change it manually in FireBug from visibility: none to visibility: yes, then real check box is shown on the page (see screen shot 2).
ISSUE
I'm trying to click on this check box like this:
#driver.find_element(:id,"MainContent_chkAuthorize").click
But then I'm getting Selenium::WebDriver::Error::ElementNotVisibleError: because element is hidden and cannot be found by Webdriver.
Is there any way to overcome this issue?
How can I change the visibility with Webdriver?
How can I click this element at last?
To make checkbox visible you should change its display property.
input.styled{
display:block; // Or you can remove this
}

Text Highlighting When Dragging From Other Elements

I am still stuck on a highlighting problem in IE 7/8. I have tried applying CSS from this question, changing the onselectstart event to return false, adding the attribute unselectable="on", and anything else I could find here on SO.
Then I came across this response to this question:
Once an element is unselectable, users cannot select from within that
element. However, they are still able to select either the text or the
box of the element by dragging into it from within another element
which is not unselectable.
I have tried to work around this by cancelling various events on
myElement (ondragenter, oncontrolselect, onmouseenter,
onselectionchange...), it didn't work.
This is exactly what I am trying to do. I have a raphael canvas object that the user can drag in order to draw. However, if they leave the canvas I do not want text in "outside" elements to be highlighted. I was wondering if anybody has found a hack for the quoted problem. I'm only having this problem in IE 7/8.
use JQUERY
$('#dragelement').onMouseDown(function(){
//YOUR CODE
});

Stop Invisible Label from taking up space

Is there a way to stop a label control that is not visible from taking up space on a form?
server side:
label.Attributes["style"] = "display:none";
or
label.Visible = false;
or, client-side (css):
#label-id { display: none; }
Set it's visibility to hidden through CSS. Or set it through the code behind to false. From the code behind a false setting should cause it to not be rendered at all.
Optionally, replace the label with a literal control and only emit something to it when you need to.
2 good answers already, so just a couple of notes:
Using Visible=false at the server-side is usually better since that will not output any HTML at all, as opposed to CSS which will output it but just hide it. Unless of course you need it there so you can unhide client-side.
The label itself usually doesn't add any space, it is the white-space before/after it that might, so yet another option (if you work in HTML source view 99% of the time like I do) is to remove any white-space before/after the control. Not as robust as the other options since it could be easy to get that white-space back by mistake (especially if the IDE does it for you while working in design view). Just thought I'd mention it, since this can be good to know if you want the label VISIBLE but don't want the "extra space".

How to increase the size of a select box, in Tinymce?

I just wrote a tinymce plugin, which has a drop down box. I can increase the size of the select box, by manipulating the CSS file of the advanced theme (the theme I am using). Is there any other way to do it, without changing the CSS? Say in the function of the javascript code that actually creates the select box?
Edit:
I did set the max_width property while creating the listbox, in the createListBox function. But it only changes the width of the elements in the dropdown, not the drop down itself :(
You can always change the css using javascript:
document.getElementById("ATTRIBUTE_ID").style.width = "1000px";
See this SOF link for more details: Change an element's class with JavaScript
You should have a closer look at the tinymce configuration option editor_css.
Using this setting you may configure a css file which will overwrite the default css for the toolbar stuff. This way you don't need to change anything of the core css.
tinymce dropdown generates internally and it's hard to do this in right way, but you always can access the needed element by CSS like:
div[id*='mceu_'].mce-container.mce-panel.mce-floatpanel.mce-menu.mce-animate.mce-fixed.mce-menu-align.mce-in div.mce-container-body.mce-stack-layout {
max-height: 200px !important;
}
for me it works for all dropdown select lists inside modal windows like link-plugin - reduce height of select list block.

How can I hide controls (not remove them from the DOM) on the server side?

I have a div with runat="server" set. I have an ASP.NET button control in my page. When this button is clicked, I want to hide the div.
Is there any other option that setting visible="false"?
I can't use that, because when I do, I can't access the element in my JavaScript since it is removed from the browser. I want to show the hidden div with JavaScript at a later point.
Add a display:none CSS style to the control:
myDiv.Style.Add(HtmlTextWriterStyle.Display, "none");
Is there any other option that
changing visibility to false.I cant
use the visibility to false,because
when i change visibility,I cant access
the same in my javascript since it is
removed from the browser.
This doesn't make sense. Setting the CSS visibility to hidden will not remove the element from the DOM.
If that's the only thing your button does, I'd probably do it in javascript first to avoid the postback all together.
If that's not an option, then just add the style attribute to the div server-side with "display:none;" for the value.

Resources