How can you change the style of DataSourceTextField (any Fields under data package)

[yongjiang]

I would like to change the default style of DataSourceTextField when an event is triggered (for example key down) for that element. However, this widget does not provide a API such as setTextBoxStyle or setCellStyle to do this.
Thanks.

[Isomorphic]

Do you mean when editing is enabled (canEdit:true) or just in general on a mouseDown?

If you mean when editing, setShowFocused() allows you to use a different series of styles when a control has focus (which happens on mousedown).

If you mean something else, can you describe what the visual difference means to the user and how long it's supposed to last (when would it go away?).

[yongjiang]

I would like to change the look and feel when an item is changed. So that I can highlight the required fields to different border color. This piece of code does not work. Thanks.

form.addItemChangedHandler(new ItemChangedHandler () {
public void onItemChanged(ItemChangedEvent event) {

DataSource dataSource1 = form.getDataSource();
DataSourceField fd = dataSource1.getField("intField");
int len = fd.getLength();
if (len > 0) {//required met
fd.setRequired(false);
fd.setAttribute("STYLE", "border:0px;");
}
else {
fd.setRequired(true);
fd.setAttribute("STYLE", "border:1px solid #dd7870;");
}

}

[Isomorphic]

Hi Yong,

You didn't answer this question - this is critical in order to be able to help you.

... can you describe what the visual difference means to the user and how long it's supposed to last (when would it go away?).

You mentioned something about required fields and something about when an item is changed, but it wasn't clear.

[yongjiang]

Ok. I mean when users fire a keyup or onlur event, we would like to change the look and feel of these widgets based on if certainly condition is met, for example, we would like to mark the fields with a red border(see my sample code). Basically, I would like to do field level validation -- not form level validation. If I use the widdets under form then I can do it like this:
TextItem item = new TextItem();
item.setTitle("Text Field");

item.addBlurHandler(new BlurHandler()
{
public void onBlur(BlurEvent event)
{
FormItem myTextItem = event.getItem();
String s = (String)myTextItem.getValue();
if (s !=null) {
myTextItem.setRequired(false);
myTextItem.setTextBoxStyle("textItem"); //set default
}
else {
myTextItem.setRequired(true);
myTextItem.setTextBoxStyle("required-field");
}
}
});
}
However, similar function is not available for DataSourceTextField. I just want to know 1) Are there any ways I can use to achieve the same thing as what I did for TextItem 2) What is the primary purpose on SmartGWT to have two sets of similar widgets under different package and with different functions 3) Under which conditions I should use which widgets (for example, TextItem vs DataSourceTextFields). Thank you very much.
Yong

[Isomorphic]

It looks like what you want is already covered by the RequiredIf Validator, take a look at that. If not, please explain in detail what you want - not just that you want to re-style a field, but what the styling means to the user and how long it is supposed to last. This affects the best approach - and may mean the functionality is already built-in.

Your general questions are covered by the SmartClient documentation that works for SmartGWT. In particular, this property.

[yongjiang]

Validator is doing validation on form level which means when a form is submitted or when we call form.validate(). This is not what we want. I think that I have stated what I would like to achieve clearly in my previous reply. Let me repeat it here: when user enters data into DataSourceField (assume that this field is required a field), I attach a keyup event to the DataSourceField and check if they the length of the DataSourceField value is longer than 0. If the length is not longer than 0, that means the required field is no data then I would like to set the border of the field to red color. Next time, when user types in any data into DataSourceField again, keyup event will be fired if the length of the value of the DataSourceField is longer than 0, which means the required field is met so I set the default style of DataSourceField back (which is "textItem"). Let me put all this into a single question, How can I attach an event to DataSourceField and change the style of DataSourceField at run time (DataSourceField does not have APIs like setTextBoxStyle)? I also appreciate it very much if you can answer any questions in my previous reply. Thanks.
Yong

[Isomorphic]

Hello Yong,

Thanks, that description is finally complete enough. The reason we ask for descriptions like that is because your question seemed to imply that you were using low-level APIs to try to reinvent features that already exist in SmartClient, which would waste your times and ours (in supporting you). What you want to do seems to be covered by RequiredIf validator and formItem.setValidateOnChange() - let us know if that doesn't completely solve the problem.

You haven't read the docs we recommended and so you continue to be confused about DataSourceFields vs ListGridFields and FormItems. We highly recommend you read those docs so that you understand the distinction. You are expecting to find APIs related to dynamically changing appearance on objects that do not have a visual appearance at all. Please read the docs to understand the distinction.

Note that we offer training and other services, which could be extremely useful to your team to avoid going down the wrong path.