Today, we are pleased to release ZK 5.0.2 which introduces a new feature jQuery selector to make working with ZK seamless.

Demo

For an interactive demo please click here.

ZK’s jQuery selector example

As demonstrated, we use the @ sign to locate widgets with a matching name and use the $ sign to seek the widget with matching IDs, for example:

1. jq(‘@window > $abc’) will return the two div(id=abc) elements.
2. jq(‘@window[class~=”abc”] @div’) will only return the div where is inside the window with “abc” CSS class name.
3. jq(‘div$win1 > $abc’) will return the div element where is inside the win1 window.
4. jq(‘$abc’) will return all the elements that match from the given id.
5. jq(‘@div’) will return all the elements that match from the given tag name.
6. jq(‘@window:first’) will return id=”win1″
7. jq(‘@window[border=”normal]”‘) will return id=”win1″.

Note that you can use CSS and ZK selectors together. For example, jq(“@window > div”) will return the Div element which is under the window widget.

Summary

The ZK selector is excellent for optimizing applications at the client. The concept of ZK selector was introduced to enable automatic testing without needed a UUID as we can use ZK selectors to identify ZK components. This was implemented by our testing technology ZTL. Most applications change their code in the future, but they don’t want to re-code test each time the software changes. That is why we enhanced the selector to work with ZK, because the selector is more relative than UUID in testing code.