Skip to main content

using jMaki yahoo map with visual jsf in NetBeans

1 reply [Last post]
ellie2905
Offline
Joined: 2007-12-08
Points: 0

Hi, I am now learning the jMaki technology and I find it very interesting.I want to make a visual jsf project in NetBeans 6.I have included successfully the jMaki components and I have inserted a yahoo map in my page.What I want to do now is to have a checkboxlist from the jsf project which will be bound with data from my database.Now, I want according to the selected checkboxes to take data from my database and display it on the yahoo map.But since jMaki doesn't support checkboxlists, I don't know if it's possible for the yahoo map to "listen" to the selected checkboxes.Is there any other way I could do something like this?The jMaki components don't have some widget that supports multiple selection?

Reply viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.
gmurray71
Offline
Joined: 2003-07-31
Points: 0

Check out this blog by Chris :

http://blogs.sun.com/divas/entry/using_jmaki_9_3_with

and

http://blogs.sun.com/divas/entry/using_the_spry_accordion_in

jMaki can support checkbox lists. Here is the start of a widget that I created for a single checkbox:

here is the component.js

jmaki.namespace("jmaki.widgets.jmaki.form.checkbox");

jmaki.widgets.jmaki.form.checkbox.Widget = function(wargs) {
var _widget = this;
var publish = "/jmaki/form/combobox";
if (wargs.publish) publish = wargs.publish;
var container = document.getElementById(wargs.uuid);
this.selected = true;
var targetId = 'default';
if (wargs.value && wargs.value.selected) selected = wargs.value.selected;
if (wargs.value && wargs.value.id) targetId = wargs.value.id;

function processActions(_t, _pid, _type, _value) {
if (_t) {
var _topic = publish;
var _m = {widgetId : wargs.uuid, type : _type, targetId : _pid};
if (typeof _value != "undefined") _m.value = _value;
var action = _t.action;
if (!action) _topic = _topic + "/" + _type;
if (action && action instanceof Array) {
for (var _a=0; _a < action.length; _a++) {
var payload = clone(_m);
if (action[_a].topic) payload.topic = action[_a].topic;
else payload.topic = publish;
if (action[_a].message) payload.message = action[_a].message;
jmaki.publish(payload.topic,payload);
}
} else {
if (action && action.topic) {
_topic = _m.topic = action.topic;
}
if (action && action.message) _m.message = action.message;
jmaki.publish(_topic,_m);
}
}
}

container.onclick = function() {
_widget.selected = container.checked;
processActions(wargs.value, targetId, "onSelect", _widget.selected);
}

this.setSelected = function(selected) {
this.selected = selected;
container.checked = selected;
};

this.getSelected = function() {
return this.selected;
};

}

Here is the component.htm

<input id="${uuid}" type="checkbox">
</input>

Basically you just need to put this in a directory under your resources/jmaki/form/checkbox

When you check the box you will get a jMaki event.

Based on the events from the checkboxes you could add or remove markers from a yahoo map.

You can find out more about how to interact with maps in Aruns blog at:

http://blogs.sun.com/arungupta/entry/sun_tech_days_event_map

The listener code can be found in the system-glue.js in a jMaki app if you want to see what is happening with plotting markers. It's pretty easy to modify.

Hopefully this should get you started. As you need more hep please let us know.

-Greg