How to create a movable point in OpenLayers?

Question

I have the following code:

    function mapCreate(lon,lat){
    map = new OpenLayers.Map("map1");
    var osm = new OpenLayers.Layer.OSM();
    vectors = new OpenLayers.Layer.Vector("Vector Layer");
    map.addLayer(osm);
    var center = new OpenLayers.LonLat(lon,lat).transform(
        new OpenLayers.Projection("EPSG:4326"),
        map.getProjectionObject()
    );

    point = new OpenLayers.Geometry.Point(center.lon,center.lat);
    vectors.addFeatures([new OpenLayers.Feature.Vector(point)]);
    drag = new OpenLayers.Control.DragFeature(vectors);
    map.addControl(drag);
    drag.activate();
    map.setCenter(center, 15);
    map.addLayer(vectors);
    point.events.register('moveend',point, function(evt){
        alert('hello');
    });

}

The part that does not work is:

        point.events.register('moveend',point, function(evt){
        alert('hello');
    });

Can anyone help me with creating an event listener for a point in OpenLayers?

Answer 1

You should use onComplete property of OpenLayers.Control.DragFeature, for example:

drag = new OpenLayers.Control.DragFeature(vectors, {
    autoActivate: true,
    onComplete: function() {alert('hello')}
});

Here is my online example: DragFeature.