0

How to create custom component

asked 2011-05-24 00:02:22 +0800

vivekkumar20005 gravatar image vivekkumar20005
66 1

Hi,

How to create a custom input box component in zkoss. I want to set component type such as for string value type="text", for integer type="int" dynamically.

Thanks
Vivek

delete flag offensive retag edit

7 Replies

Sort by ยป oldest newest

answered 2011-05-24 19:52:07 +0800

samchuang gravatar image samchuang
4084 4

Hi

if you need customize component, you can refer to ZK Component Development Essentials

but, maybe you don't need do it. Just replace textbox to intbox dynamically could solve your issue ?

link publish delete flag offensive edit

answered 2011-05-25 02:32:05 +0800

vivekkumar20005 gravatar image vivekkumar20005
66 1

Hi,

Thanks for reply. But replacement of textbox to intbox dynamically can not solve my problem because in input box data can by any type
such as string, int, double etc...

So, I want to validate this input box according to datatype of data.

How do this?

Thanks
Vivek

link publish delete flag offensive edit

answered 2011-05-25 03:18:06 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

... can not solve my problem because in input box data can by any type

if the input can be any type, HOW you would make a decision in what type (text/int) the input box should work ?

link publish delete flag offensive edit

answered 2011-05-25 05:33:11 +0800

samchuang gravatar image samchuang
4084 4

updated 2011-05-25 05:33:25 +0800

if it can be any type, you can consider use textbox and use Textbox.setConstraint

link publish delete flag offensive edit

answered 2011-05-25 05:59:47 +0800

vivekkumar20005 gravatar image vivekkumar20005
66 1

Hi,

This is my problem. Actually i want to create a Search component similar in jquery search in grid.I need to validate textfield based on searchBy value type.
for example

<combobox id="searchStringId">
<comboitem id="companyNameId" label="Company Name" value="companyName"/>// string type
<comboitem id="vendorNrId" label="Vendor Nr" value="vendorNr"/> /// integer type
<comboitem id="statuId" label="Status" value="status"/>
</combobox>

<combobox id="searchOpratorId">
<comboitem label="Not Equal" value="ne"/>
<comboitem label="Contains" value="cn"/>
<comboitem label="Equals" value="eq"/>
</combobox>

<inputfield="searchValueFieldId"/>

I want to validate this input field(searchValueFieldId) based on selected comboitem value type(ex. company name == string type, vendor no == integer type) combobox(searchStringId).

How create such type of Search component

Thanks
Vivek

link publish delete flag offensive edit

answered 2011-05-25 08:15:50 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

updated 2011-05-25 08:20:56 +0800

1. Like Peter said, you can use a custom constraint.
2. It's possible to overhand a parameter to a custom constraints constructor.

So in your case you can overhand a param which indicates what kind (companyName, vendorID, or statusID ) is overhanded.
In the customConstraint you can with a simple if/else check which kind of param is overhanded and
use the 'right' constraint checks for it.

A custom Constraint skeleton with a overhanded param is:

/**
 * Constraint for comparing the value from a textbox with a string.<br>
 * Throws an error message if not equals or is empty. Used in the userDialog for
 * checking that the reTyped password is same as first written password.<br>
 * 
 * <pre>
 * call from java: 
 * usrPassword.setConstraint("NO EMPTY");
 * usrPasswordRetype.setConstraint(new NoEmptyAndEqualStringsConstraint(txtbox_usrPassword));
 * </pre>
 * 
 * <pre>
 * declaration in zuml: 
 * < zscript >	
 * NoEmptyAndEqualStringsConstraint cc = new NoEmptyAndEqualStringsConstraint(  txtb_User_Password  ); <==
 * < / zscript >
 * </pre>
 * 
 * @author Stephan Gerth
 */
public class NoEmptyAndEqualStringsConstraint implements Constraint, java.io.Serializable {

	private static final long serialVersionUID = 4052163775381888061L;
	private final Component compareComponent;

	public NoEmptyAndEqualStringsConstraint(Component compareComponent) {
		super();
		this.compareComponent = compareComponent;
	}

	@Override
	public void validate(Component comp, Object value) throws WrongValueException {

		if (comp instanceof Textbox) {

			final String enteredValue = (String) value;

			// Skip, if disabled
			if (((Textbox) comp).isDisabled()) {
				return;
			}

			if (compareComponent instanceof Textbox) {

				if (StringUtils.isEmpty(enteredValue)) {
					throw new WrongValueException(comp, Labels.getLabel("message.Error.CannotBeEmpty"));
				}

				final String comparedValue = ((Textbox) compareComponent).getValue();
				if (!enteredValue.equals(comparedValue)) {
					throw new WrongValueException(comp, Labels.getLabel("message.Error.RetypedPasswordMustBeSame"));
				}
			}
		}
	}
}


A custom Constraint skeleton with EL check is:

/**
 * Constraint for comparing the value from a <b>textbox</b>.<br>
 * Throws an error message if NOT empty or NOT only numbers ( 0-9 ). Used in the
 * PayConditions Searchbox for checking that the SearchToken is only integers or
 * empty</br> </br>
 * 
 * <pre>
 * Java call:</br>
 * 	Textbox searchField = new Textbox();
 * 	searchField.setConstraint(new OnlyEmptyAndIntegerConstraint());
 * </pre>
 * 
 * @author Stephan Gerth
 */
public class OnlyEmptyAndIntegerConstraint implements Constraint, java.io.Serializable {

	private static final long serialVersionUID = 4052163775381888061L;

	public OnlyEmptyAndIntegerConstraint() {
		super();
	}

	@Override
	public void validate(Component comp, Object value) throws WrongValueException {

		if (comp instanceof Textbox) {

			// no need for checking ?
			if (((Textbox) comp).isDisabled()) {
				return;
			}

			// cast the value to String and trim it.
			final String enteredValue = ((String) value).trim();

			// check if not empty
			if (!enteredValue.isEmpty()) {
				// check if not allowed signs
				if (!enteredValue.matches("(([0-9]+)?)+")) {
					throw new WrongValueException(comp, Labels.getLabel("message.error.OnlyNumbersOrEmptyAllowed"));
				}
			}

		}
	}
}

best
Stephan

link publish delete flag offensive edit

answered 2011-05-25 11:56:48 +0800

vivekkumar20005 gravatar image vivekkumar20005
66 1

Hi,

plz provide a example with using my case.


Thanks
Vivek

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2011-05-24 00:02:22 +0800

Seen: 1,345 times

Last updated: May 25 '11

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More