allow for editing of alternative names

demos/listmap2/js/listmap.js

@@ -180,8 +180,8 @@ Ox.load('Geo', function() {
             })
             .bindEvent({
                 geocode: function(event, data) {
-                    Ox.print(event)
+                    //Ox.print(data);
-                    Ox.print(JSON.stringify(data))
+                    Ox.print(JSON.stringify(data.results))
                 }
             })
             .appendTo(Ox.UI.$body);

source/Ox.UI/js/Core/Ox.Element.js

@@ -337,7 +337,10 @@ Ox.Element = function() {
                 ].indexOf(event) == -1) {
                     Ox.print(that.id, self.options.id, 'trigger', event, data);
                 }
-                self.$eventHandler.trigger('ox_' + event, data);
+                // it is necessary to check if self.$eventHandler exists,
+                // since, for example, when removing the element on click,
+                // singleclick will fire after the removal of the event handler
+                self.$eventHandler && self.$eventHandler.trigger('ox_' + event, data);
             });
             return that;
         };

source/Ox.UI/js/Form/Ox.ArrayInput.js

@@ -5,7 +5,7 @@ Ox.ArrayInput = function(options, self) {
         .defaults({
             label: '',
             max: 0,
-            sort: false,
+            sort: false, // fixme: this should probably be removed
             value: [],
             width: 256
         })
@@ -50,6 +50,7 @@ Ox.ArrayInput = function(options, self) {
             .bindEvent({
                 change: function(data) {
                     self.options.sort && data.value !== '' && sortInputs();
+                    that.triggerEvent('change', {value: that.value()});
                 }
             })
             .appendTo(self.$element[i]));
@@ -62,7 +63,12 @@ Ox.ArrayInput = function(options, self) {
             .css({float: 'left', marginLeft: '8px'})
             .bind({
                 click: function() {
-                    removeInput($(this).parent().data('index'));
+                    var index = $(this).parent().data('index');
+                    if (self.$input[index].value() !== '') {
+                        self.$input[index].options({value: ''});
+                        that.triggerEvent('change', {value: that.value()});
+                    }
+                    removeInput(index);
                 }
             })
             .appendTo(self.$element[i]));
@@ -132,12 +138,13 @@ Ox.ArrayInput = function(options, self) {
 
     self.setOption = function(key, value) {
         if (key == 'value') {
+            Ox.print('--value--', value, self.$input)
             if (self.options.value.length == 0) {
                 self.options.value = [''];
             }
-            self.$input && self.$input.forEach(function($input, i) {
+            while (self.$input.length) {
-                removeInput(i);
+                removeInput(0);
-            });
+            }
             self.options.value.forEach(function(value, i) {
                 addInput(i, value);
             });

source/Ox.UI/js/Map/Ox.ListMap.js

@@ -362,22 +362,27 @@ Ox.ListMap = function(options, self) {
                     country = Ox.getCountryByGeoname(geoname),
                     countryCode = country ? country.code : '',
                     isResult = self.selectedPlace[0] == '_';
-                if (!isResult) {
-                    self.$list.value(self.selectedPlace, 'geoname', geoname);
-                    self.$list.value(self.selectedPlace, 'countryCode', countryCode);
-                }
                 //self.$map.value(self.selectedPlace, 'geoname', geoname);
                 self.$placeTitleFlag.attr({
                     src: Ox.getImageByGeoname('icon', 16, geoname)
                 });
                 self.$placeTitleName.options({title: geoname});
+                self.$placeForm.values({countryCode: countryCode});
                 if (!self.isAsync) {
-                    
+                    if (!isResult) {
-                } else {
+                        self.$list.value(self.selectedPlace, 'geoname', geoname);
-                    editPlace(['geoname']);
+                        self.$list.value(self.selectedPlace, 'countryCode', countryCode);
                     }
+                } else {
+                    editPlace(['countryCode', 'geoname']);
+                }
+                self.$map.value(self.selectedPlace, 'countryCode', countryCode);
+                self.$map.value(self.selectedPlace, 'geoname', geoname);
             }
         }),
+        Ox.Input({
+            id: 'countryCode'
+        }).hide(),
         Ox.ArrayInput({
             id: 'alternativeNames',
             label: 'Alternative Names',
@@ -387,7 +392,12 @@ Ox.ListMap = function(options, self) {
             width: 240
         }).bindEvent({
             change: function(data) {
-                Ox.print('CHANGE........', data)
+                if (!self.isAsync) {
+                    
+                } else {
+                    editPlace(['alternativeNames'])
+                }
+                self.$map.value(self.selectedPlace, 'alternativeNames', data.value);
             }
         }),
     ], ['South', 'West', 'North', 'East', 'Latitude', 'Longitude'].map(function(v) {
@@ -397,7 +407,7 @@ Ox.ListMap = function(options, self) {
             max = ['Latitude', 'South', 'North'].indexOf(v) > -1 ? Ox.MAX_LATITUDE : 180;
         return Ox.Input({
             decimals: 8,
-            disabled: ['Latitude', 'Longitude'].indexOf(v) > -1,
+            disabled: true, // ['Latitude', 'Longitude'].indexOf(v) > -1,
             id: id,
             label: v,
             labelWidth: 80,
@@ -648,9 +658,7 @@ Ox.ListMap = function(options, self) {
             });
             self.$placeTitleName.options({title: place.geoname || ''});
             self.$placeTitle.show();
-            self.$placeForm.values(Ox.map(place, function(val, key) {
+            self.$placeForm.values(place).show();
-                return key == 'size' ? Ox.formatArea(val) : val;
-            })).show();
             self.$placeButton.options({title: isResult ? 'Add Place' : 'Remove Place'});
             self.$revertButton.options({disabled: true}).show();
         } else {