I am dynamically creating a CheckBox and setting the disabled property like this:
chk.Disabled = false.
This renders the following HTML:
<input type="checkbox" disabled="disabled" .../>
On the click of the checkbox, I have a JS function that tries to enable it by doing a:
//get reference to the checkbox
chk.disabled = false;
This does not work. Any help?
If your checkbox is disabled, your onclick wont be called
What you're trying to do is a bit odd. You're trying to enable a checkbox by clicking on the checkbox, which is disabled to start with. So, the onclick will not be registered until the checkbox is actually enabled.
Try the below to see what I mean.
<html>
<body>
<input id="cb" type="checkbox" disabled="disabled" onclick="this.disabled=!this.disabled;" />
<label for="cb">Click me</label>
<input type="button" value="Click me instead!" onclick="cb.disabled=!cb.disabled;" />
</body>
</html>
Hope that helps you out.
How are you dynamically creating the check box?
Keep in mind that ASP.NET will change the name of the check box you give it, especially if you add it on the code behind.
What you need to do is send to your JS function the clientId, which is the id the HTML item will get when render.
Related
I know this has been working for me in the past, but my attempt to set the value of my radiobutton is ignored and the value is set to the ID of my radio button.
ASP.Net
<asp:RadioButton ID="rb" runat="server" />
Code behind
//Test 1
rb.InputAttributes.Add("value", "foo");
//Test 2
rb.InputAttributes["value"] = "foo";
HTML output
<input id="rb" type="radio" name="rb" value="rb" />
What am I missing here?
Setting the value in ASP.Net markup is working, but I rather do this from codebehind.
You can simple do:
rb.Attributes.Add("value", "foo");
HTML output:
<input id="ContentPlaceHolder1_rb" type="radio" name="ctl00$ContentPlaceHolder1$rb" value="foo">
Code behind :
rb.Attributes.Add("value", "RadioButton");
Output
<input id="rb" type="radio" name="rb" value="RadioButton" />
Reference:
Set HTML Attributes for Controls in ASP.NET Web Pages
I am trying to implement a toggle switch-toggle between textarea and ckeditor in my web form.
As of now I am able to toggle between the 2 editors.But I am not able to have the same contents in both the editors. Its treating it like 2 separate textarea, I want them to have the same contents when I toggle from textarea to ckeditor.Can anybody help me and lemme know what I am missing?
Thanks in advance
Code:
Updated code
<textarea id="editor1" name="editor1" class="ckeditor" rows="20" cols="75"></textarea>
<input type="button" value="CKEditor" onclick="CKEDITOR.replace('editor1');" />
<input type="button" value="Text editor" onclick="CKEDITOR.instances.editor1.destroy('editor1');" />
<input type="submit" value="Submit" />
</form>
Use CKEDITOR.instances.editor1.destroy() to restore it to a textarea and call CKEDITOR.replace('editor1') again when you want a CKEditor.
Remove the whole <div id="textarea"> because otherwise you will get unexpected results, you're using two textareas with the same id and name.
For example in my datalist if Eval("OptionJ").Tostring = Null I would like the function GetVisible to set visibility of the radio button to false like so:
<input name="Q<%#Eval("ID")%>" type="radio" value="J" visible="<%# GetVisible(Eval("OptionJ").ToString()) %>">
<%#Server.HtmlEncode(Eval("OptionJ").ToString())%>
</option><br />
I then have a codebehind function like so:
Protected Function GetVisible(ByVal Evalresult As String) As String
If Evalresult = Nothing Then
Return "False"
Else
Return "True"
End If
End Function
I have also tried checking EvalResult = String.empty
In the outputted html the visible status is being set to false...
<input name="Q3" type="radio" value="J" visible="False">
But it is still displayed on the page!
Please can you let me know how to get this working? Thanks in advance for your time reading and any answers posted.
Try this one:
<input name="Q3" type="radio" value="J" visible="false" runat="server">
Visible property works only for ASP.NET Server control but here you are using Html Input Control.
So one approach is that add runat="server" attribute in this control to if you want to continue with visible property and second one is that add style="visibility:hidden" attribute for HTML input control as given below:
<input name="Q3" type="radio" value="J" style="visibility:hidden">
I am developing my app in asp.net web forms. The textbox is set like this
<asp:TextBox ID="txt1" runat="server" Enabled="false" ></asp:TextBox>
and this is the corresponding HTML markup
<input name="txt1" type="text" value="1.0" id="txt1" disabled="disabled" />
It is not editable upto this point.
I enable Caret browsing in IE8 (press F7) and then this field becomes editable, though the text is grayed out and consequently gives a wrong feeling to the user that the field is editable. This does not happen if I mark the textbox as readonly, but I do not want to mark it as a readonly field. Any suggestions on how to have the textbox in disabled mode when in Caret Browsing.
Edit1: I am not looking for a solution which would change IE settings/registry, am looking for a programmatic solution as my site is a public facing website
Edit2: View states are enabled for the page and for the controls
I can get you started quickly with this script:
<script> document.onkeyup = KeyCheck;
function KeyCheck() { alert(document.getElementById("txt1").value); } </script> </script>
Put this all the way on top of the html.
Now you get hold of the keypress.
When in caret mode, IE seems to ignore the text's javascript events
Alright. I gave you a Hint to build up on. (Thanks for the -1)
Here is the HTML code that you are looking for. Make sure to populate the initialVal using ASP code.
<script>
document.onkeyup = KeyCheck;
var initialVal="1.0"
function KeyCheck()
{
if(document.getElementById("txt1").value != initialVal) {
document.getElementById("txt1").value = initialVal;
return false;
}
}
</script>
<input name="txt1" type="text" value="1.0" id="txt1" disabled="disabled" />
Is there any way to set a CSS class on an input item in a radio button list? I'd like to reference these form values by class in jQuery.
Given an ASP.NET RadioButtonList with classes set on the ListItems:
<asp:RadioButtonList ID="RadioButtonList" runat="server">
<asp:ListItem class="myClass" Text="Yes" Value="1" />
<asp:ListItem class="myClass" Text="No" Value="0" />
</asp:RadioButtonList>
Will render as:
<span id="RadioButtonList" class="radioButtonListField myClass">
<span class="myClass">
<input id="RadioButtonList_0" type="radio" value="1"
name="RadioButtonList"/>
<label for="RadioButtonList_0">Yes</label>
</span>
<span class="myClass">
<input id="RadioButtonList_1" type="radio" value="0"
name="RadioButtonList"/>
<label for="RadioButtonList_1">No</label>
</span>
</span>
Unfortunately, the "myClass" class is added to the <span> that contains the radio button item, not the <input> itself. How could I get it to look like this instead:
<span id="RadioButtonList" class="radioButtonListField myClass">
<span>
<input id="RadioButtonList_0" class="myClass" type="radio" value="1"
name="RadioButtonList"/>
<label for="RadioButtonList_0">Yes</label>
</span>
<span>
<input id="RadioButtonList_1" class="myClass" type="radio" value="0"
name="RadioButtonList"/>
<label for="RadioButtonList_1">No</label>
</span>
</span>
(This does not even get into the issue of adding the classes to dynamically bound RadioButtonLists.)
Yes, RadioButtonList renders horrible HTML.
Anyway, it's still easy to get them from jQuery.
Try
$('span.myclass input:radio')
Above will get all the radio buttons inside the span with class 'myclass'.
An alternative you may want to try to do is change your CSS class to accomindate the Server Control Rendering.
So in your CSS instead of the following:
.myClass { ... }
You Use this:
.myClass input { ... }
I don't know if you can set the class attribute (via class or CSSClass) in a declarative manner; however, the above should give you a work around.
untested
$('.myclass input:radio').each(function() {
this.css({'style-name':'style-value'})
)};
once the list is rendered, you can possibly manipulate the css client side using the above statement.
Using .NET you could create an event handler to the RowBinding event. This would allow you to access the individual controls within each item in the list. Once you pull the RadioButton control, you could programaticaly set it's CssClass to apply your class on the RadioButton level.
You could also use jquery to find the radio button controls that have myClass applied, and then apply another class to that.
Third, you could just change the definition of MyClass to also specify that it's only applied to input elements under elements that have MyClass applied.
the desigeek response is pretty good..
To get this to work for radiobuttons I had to do this on document.ready()
$('#<%=radRisksMarginTrading.ClientID %>_0').addClass("validate[required]");
$('#<%=radRisksMarginTrading.ClientID %>_1').addClass("validate[required]");
I'm sure there is a much better way to do it by looping but I need a quick fix for 5 radiobutton lists..