JQuery and invisible select - JQuery - c#

I have a select checkbox that has invisible set to false. ASPX looks like this:
<input name="selGR" id="selGR" type="checkbox" checked="checked" visible="false" runat="server" fieldname="GR"/>
The select box is not even rendered in the HTML which explains why JQuery is not finding it. Is there a way around this?
EDIT:
Setting style works! Thanks. I am curious to know if there are any rules the .NET framework follows when rendering controls with visible="false"? For all controls irrespective of whether they are server, custom or html controls, it follows this rule?
Also, any side effects of setting the style instead of setting the property of visible?

you can always set the display property to none. jQuery will be able to find it at that point.
<input type="checkbox" id="selGr" style="display:none" />
For future reference as well. $("#selGr").hide() & $("#selGr").show() basically uses the display property of the element.
I do not believe an 'visible' is an attribute of an element. There is visibility and display that can be set within the style attribute though. For a better understand of the difference between visibility and hidden check this out: http://www.devx.com/tips/Tip/13638

Visible is a asp.net attribute,by setting it to false is to ask sever not to render the control. That is why your check box is not in the html source code.
Chaning html display style property to none is telling the explorer not to display the checkbox, however, it is stilled included in the source code.

Use "style='display: none'" instead of "visible='false'". That way it will still be in the rendered HTML for JQuery to do something with.

it is the option that u can use "Display:None",
but if u use this one,
than ur control will render every time in page and if u see it in Firebug,
u will find ur control there and that thing will not occurs in Visible=false

Related

How to not render a Panel Control as a <div>

I use Asp.net 4 and C#.
I have a common web control <asp:Panel>. It is my understanding that if the Panel is visible it renders in the Browser as a <div></div> tag.
I would like to know if is possible to change this behavior and display the content of the Panel without rendering its <div>.
Any idea how to do it?
Can I use another control instead of Panel?
An example of code would be appreciated thanks!
Simple :
use PlaceHolder or Literal
it renders only what it has - nothing more nothing less.
If you use an ASP.NET PlaceHolder control then you will not get the div tags.
Of course if you use a PlaceHolder you will not get a HTML element for this (i.e. a DIV tag) so you cannot set properties such as BackImageUrl or Wrap, etc. on the control.

.Net form controls drop by one "line" after selection

Yes, I realize that's a bit of a vague title but I'm having a hard time stating the problem. I have a .Net .aspx page that has a Master page, some Ajax, and an updatepanel. My problem occurs on 2 different pages but in both cases I'm either selecting a radio button or a checkbox when the behavior occurs. Immediately after selection the entire page moves down. It does not scroll but instead it is like an extra tag was inserted into the source. I have done HTML source comparisons before and after this change and nothing is different. I can only assume it is related to the updatepanel but I cannot determine where this may be happening.
I'd be happy to provide more information if you can direct me towards a solution.
Thanks!
I am not entirely sure if this will do it and there is not enough detail here to be sure, but have you tried setting RenderMode to inline on the UpdatePanel? Maybe that will do the trick. Otherwise go take a look at Fiddler and see what is coming back from the server. Alternate recommendation (if none of the above work) is to just get your result in Json and change the markup yourself with jQuery or something like it.
Incredible. This was exactly the problem. I've modified my code as follows and form stays in place after selection. This was a simple case of selecting a radio button and having it auto-populate a dropdownlist.
[asp:UpdatePanel ID="panelValidation" runat="server" ChildrenAsTriggers="true" UpdateMode="Always" RenderMode="Inline"]
[ContentTemplate]
[asp:ValidationSummary ID="ValidationSummary1" runat="server"]
[ContentTemplate]
[asp:UpdatePanel]
Thanks!

How to get at specific HTML elements of a document using C# and Hide them/Show them etc

Basically I want to load a HTML document and using controls such as multiple check boxes which will be programmed to hide, delete or show HTML elements with certain ID's. So I am thinking I would have to set an inline CSS property for visibility to: false on the ones I want to hide or delete them altogether when necessary.
I need this so I don't have to edit my Ebay HTML templates in dreamweaver all the time, where I usually have to scroll around messy code and manually delete or add tags and their respective content. Whereas I just want to create one master template in dreamweaver which has all the variations that my products have, since they are all of the same genre with slight changes here and there and I just need to enable and disable the visibility of these variants as required and copy + paste the final html.
I haven's used Windows Forms before, but tried doing this in WebForms which I do know a bit. I am able to get the result that I want by wrapping any HTML elements in a <asp:PlaceHolder></asp:PlaceHolder> and just setting that place holders visibility to false after the associated checkbox is checked and a postback occurs, finally I add a checkbox/button control that removes all the checkboxes, including itself etc for final html. But this method seems just like too much pain in the ass as I have to add the placeholder tags around everything that I need control over as ordinary html elements do not run at server, also webforms injects a bunch of Javascript and ViewState data so I don't have clean HTML which I can just copy after viewing the page source.
Any tips/code that you can suggest to achieve the desired effect with the least changes required to existing HTML documents? Ideally I would want to load the HTML document in, have a live design preview of it and underneath have a bunch of well labelled checkboxes programmed to hide, delete or show elements with certain ID's.
Thanks...
<table runat="server" id="tblMain">
<tr runat="server" id="tr1">
<td runat="server" id="tdName">
dummy name
</td>
<td runat="server" id="tdSurname">
dummy surname
</td>
...
you can use tdSurname.visible = "false"; or tdSurname.Style["Visibility"] = "Hidden";
Take a look at the library Html Agility pack
i think this will work for you :
HtmlControl ctl = new HtmlGenericControl( "div" );
ctl.visible = false;
Have you considered using JQuery? If the elements you want to show/hide have fixed IDs then this might be a quick and dirty solution.

How to modify style for an asp:textbox in codebehind?

I am trying to set the style of an asp:TextBox in codebehind, the textbox is style is set initially to
style="display:none"
when I set the dispaly to block in codebehind the textbox appears for a moment and then it's gone. I don't know what this problem is, when it's done in javascript it works fine
Here is the code:
asp.net code:
<asp:TextBox ID="txtError" style="display:none" runat="server" ReadOnly="True" Width="95%"></asp:TextBox>
codebehind:
txtError.Style["display"] = "block";
Am I doing anything wrong? Thanks in advance.
If you use
txtError.Visible = false;
You can not access the text box using JavaScript.
If you want to just change visibility you can use
txtError.Style.Add("display", "none");
Any .NET control has Visible property - you should use it in case you don't need control to be shown later (if Visible is set to false control won't be rendered at all).
Regarding your issue - I think there is some client (javascript) code that changes style of textbox back to display:none;
What about setting the Visible property?
txtError.Visible = false;
If this also doesn't work then somewhere else you will be re setting the value to none. Also check whether any of the parent elements of the textbox is not hidden.
Also no need to set the display of a textbox to block(if not intended so), use inline instead.

How to create a function that resizes text on a page without javascript?

Does anyone have any ideas how to create a function that resizes text on a page dynamically without the use of JavaScript? I'm using CMS based on C#?
Is it possible with CSS only? if it's not possible then i want to do with javascript like this page http://demo.joomla.org/1.5/?template=beez and as a fallback want to user server side solution which this page hasn't http://demo.joomla.org/1.5/?template=beez
Without javascript? Well, guess you will have to perform a postback onchange, then perform resize in your codebeind. Not very user friendly though.
I doubt CSS can do that.
You could create 3 links:
A A A
Then on postback, use the value of the 'size' query string attribute as a CSS font-size value. something like (pseudocode)
// aspx
<div style="font-size:<%= getsize(); %>"> ...
// code behind
getsize(){
return Request.QueryString["size"];
}
If you are getting size from database then you can do one thing:
Create a panel and put all controls in it and set size dynamically.
See following for more details:
http://asp-net-example.blogspot.com/2009/04/how-to-set-change-panel-font-size.html
I think you are misunderstanding something, you want a C# function for something that is fundamentally client side? Do you want to do it after the page has loaded or before? You can resize text on a page with CSS easily.
body{ font-size:60%; }
If you are looking for say 3 sizes (standard, large, huge) then the way I've done this is to create the visual elements as ImageButtons or CSS'ed Buttons to style them to fit the design.
You can then hold the body{font-size:1em;} outside of the CSS includes (but before it in the head section) within a Literal to honor the browser defaults by default. When the postback occurs you can adjust the literal accordingly - e.g. large would be adjusted to body{font-size:1.5em}.
litFontSize.Text = "body{font-size:1.5em;}"
You do need to check that the body font-size is being inhereted throughout though, cross browser - form text for one will need independent definiton in my experience.
What do you want to trigger the dynamic-resizing? The window being resized? Or the user pressing a button?
If you want to resize text when a user resizes the window, then no - you won't be able to do that with CSS alone, since CSS doesn't have any way of setting font sizes based on the window size. Every site I've seen that does this does it via javascript.
If you want the trigger to be a button press, then this is pretty simple - the button sends a postback to the server, you pick up their desired size from a dropdown or from the specific button that was pressed, and then you can add some CSS into the page or add a link to a different stylesheet.

Categories