[CLOSED] disabled textfield
Hi
i am trying to make changes to css x-item-disabled class for a disabled textfield control. it works in that I can change to opacity. I am trying to change color of font from gray to some dark color like black so it can be more readable. I am using ie7 for testing but it is not working.
any suggestions
thanks
idriss
Code:
.x-item-disabled
{
filter: alpha(opacity=120) !important;
color: black !important;
font-weight: bolder !important;
opacity: .9 !important;
cursor: inherit !important;
}
RE: [CLOSED] disabled textfield
Hi idriss,
I believe IE does not allow the text color to be changed on disabled input fields. This is "feature" of the IE browser.
I know of no way to change a disabled input fields text color in IE.
RE: [CLOSED] disabled textfield
thanks. I was under the same impression but was hoping when I saw the x-item-disabled class.
idriss
RE: [CLOSED] disabled textfield
Hi,
What about to use ReadOnly and apply own css class when toggle value of ReadOnly property?
RE: [CLOSED] disabled textfield
Hi
ReadOnly is working except in the case of DateField. if I disable datefield, then user can not select date from datepicker. if I use ReadOnly, the user can not type anything in the text box but he is able to choose date from date picker.
idriss
RE: [CLOSED] disabled textfield
Hi,
Well, trigger issue can be solved with the following code.
1. You can set empty function for trigger handle
ReadOnly=true
Code:
DateField1.oldTriggerClick = DateField1.onTriggerClick; DateField1.onTriggerClick = Ext.emptyFn;
ReadOnly=false
Code:
DateField1. onTriggerClick = DateField1.oldTriggerClick;
RE: [CLOSED] disabled textfield
vlad
is it this JS or code behind code. is it possible to do that in code behind. I can not find onTriggerClick.
thanks for your help
idriss
RE: [CLOSED] disabled textfield
Hi,
It is javascript code. For example, you can use the following schema
1. Set ReadOnly="true"
Code:
DataField1.ReadOnly = true;
DataField1.AddScript("{0}.oldTriggerClick = {0}.onTriggerClick; {0}.onTriggerClick = Ext.emptyFn;", DataField1.ClientID);
2. Set ReadOnly="false"
Code:
DataField1.ReadOnly = false;
DataField1.AddScript("{0}.onTriggerClick = {0}.oldTriggerClick;", DataField1.ClientID);
RE: [CLOSED] disabled textfield
Vlad
I have tried your suggestion but I am still able to click on calendar icon and get calendar for date picker. I was able to use jQuery to search for the img tag that follows the input date field and then set attr to disabled in the mean time.
I do like your method better if you can think of something else.
thanks for your help
idriss
RE: [CLOSED] disabled textfield
Hi,
ok, here is an example which should works
Code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void ReadOnlyTrue(object sender, AjaxEventArgs e)
{
DateField1.ReadOnly = true;
DateField1.AddScript("{0}.trigger.un('click', {0}.onTriggerClick, {0});", DateField1.ClientID);
}
protected void ReadOnlyFalse(object sender, AjaxEventArgs e)
{
DateField1.ReadOnly = false;
DateField1.AddScript("{0}.trigger.on('click', {0}.onTriggerClick, {0}, {{preventDefault:true}});", DateField1.ClientID);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" />
<ext:DateField ID="DateField1" runat="server"></ext:DateField>
<ext:Button runat="server" Text="ReadOnly=true">
<AjaxEvents>
<Click OnEvent="ReadOnlyTrue" />
</AjaxEvents>
</ext:Button>
<ext:Button runat="server" Text="ReadOnly=false">
<AjaxEvents>
<Click OnEvent="ReadOnlyFalse" />
</AjaxEvents>
</ext:Button>
</form>
</body>
</html>