Listing fixes

- fixed bulk actions
- fixed paging behavior
- fixed filtering issues

assets/js/src/form/fields/selection.jsx

@@ -14,11 +14,29 @@ function(
       }
     },
     componentWillMount: function() {
-      this.loadCachedItems();
+
     },
     componentDidMount: function() {
-      jQuery('#'+this.props.field.id).select2()
-        .on('change', this.handleChange);
+      this.loadCachedItems();
+    },
+    setupSelect2: function() {
+      if(this.props.field.select2 && Object.keys(this.props.item).length > 0) {
+        console.log('do it!');
+        jQuery('#'+this.props.field.id).select2({
+          width: this.props.field.width
+        }).select2(
+          'val',
+          this.props.item[this.props.field.name]
+        ).on('change', this.handleChange);
+
+        // set values
+        /*jQuery('#'+this.props.field.id).select2(
+          'val',
+          this.props.item[this.props.field.name]
+        );*/
+
+        console.log(this.props.item[this.props.field.name]);
+      }
     },
     loadCachedItems: function() {
       if(typeof(window['mailpoet_'+this.props.field.endpoint]) !== 'undefined') {
@@ -29,35 +47,49 @@ function(
       }
     },
     handleChange: function() {
-      return this.props.onValueChange({
-        target: {
-          value: jQuery('#'+this.props.field.id).select2('val'),
-          name: this.props.field.name
-        }
-      });
+      if(this.props.onValueChange !== undefined) {
+        this.props.onValueChange({
+         target: {
+            value: jQuery('#'+this.props.field.id).select2('val'),
+            name: this.props.field.name
+          }
+        });
+      }
+      return true;
     },
     render: function() {
-      var options = this.state.items.map(function(item, index) {
-        return (
-          <option
-            key={ item.id }
-            value={ item.id }
-          >
-            { item.name }
-          </option>
-        );
-      });
+      if(this.state.items.length === 0) {
+        return false;
+      } else {
+        var options = this.state.items.map(function(item, index) {
+          return (
+            <option
+              key={ item.id }
+              value={ item.id }
+            >
+              { item.name }
+            </option>
+          );
+        });
 
-      return (
-        <select
-          ref="selection"
-          id={ this.props.field.id }
-          placeholder={ this.props.field.placeholder }
-          multiple={ this.props.field.multiple }
-          onChange={ this.handleChange }
-          defaultValue={ this.props.item[this.props.field.name] }
-        >{ options }</select>
-      );
+        var default_value = (
+          (this.props.item !== undefined && this.props.field.name !== undefined)
+          ? this.props.item[this.props.field.name]
+          : null
+        );
+
+        this.setupSelect2();
+
+        return (
+          <select
+            id={ this.props.field.id }
+            placeholder={ this.props.field.placeholder }
+            multiple={ this.props.field.multiple }
+            onChange={ this.handleChange }
+            defaultValue={ default_value }
+          >{ options }</select>
+        );
+      }
     }
   });