public inbox for [email protected]  
help / color / mirror / Atom feed
From: Harshal Dhumal <[email protected]>
To: Ashesh Vashi <[email protected]>
Cc: [email protected]
Subject: backgrid select2 cell
Date: Wed, 6 Jan 2016 18:57:02 +0530
Message-ID: <CAFiP3vz44HZy_3GwggVhpTU-tq9H+Es8+c9Rxm4GxnPiK4MKXg@mail.gmail.com> (raw)
List-Unsubscribe:  <mailto:[email protected]?body=unsub%20pgadmin-hackers>

Hi,

Please find patch for backgrid select2 cell

Usage:

schema: [
    {id: 'name', label:'Name', type:'text', cell:
Backgrid.Extension.Select2Cell, editable: true,
    optionValues: [['Allow','allow'], ['Prefer','prefer'],
['Require','require'], ['Disable','disable']],
    select2:{placeholder: "Select an option"}},
.
.



-- 
*Harshal Dhumal*
*Software Engineer *



EenterpriseDB <http://www.enterprisedb.com;


-- 
Sent via pgadmin-hackers mailing list ([email protected])
To make changes to your subscription:
http://www.postgresql.org/mailpref/pgadmin-hackers


Attachments:

  [text/x-patch] select2_backgrid_cell_6_Jan.patch (2.5K, 3-select2_backgrid_cell_6_Jan.patch)
  download | inline diff:
diff --git a/web/pgadmin/static/js/backgrid/backgrid.pgadmin.js b/web/pgadmin/static/js/backgrid/backgrid.pgadmin.js
index b12c089..de73b63 100644
--- a/web/pgadmin/static/js/backgrid/backgrid.pgadmin.js
+++ b/web/pgadmin/static/js/backgrid/backgrid.pgadmin.js
@@ -289,6 +289,78 @@
     }
   });
 
+
+  /*
+   *  Select2Cell for backgrid.
+   */
+  var Select2Cell = Backgrid.Extension.Select2Cell = Backgrid.Cell.extend({
+
+    className: "select2-cell",
+
+    events: {
+      "change": "onSave",
+      "select2:unselect": "onSave"
+    },
+    render: function () {
+      var col = _.defaults(this.column.toJSON(), this.defaults),
+          model = this.model, column = this.column,
+          editable = Backgrid.callByNeed(col.editable, column, model),
+          optionValues = this.column.get('optionValues');
+
+      this.$el.empty();
+
+      if (!_.isArray(optionValues)) throw new TypeError("optionValues must be an array");
+
+      /* Add empty option as Select2 requires any empty '<option><option>' for
+       * some of its functionality to work.
+       */
+      optionValues.unshift([null, null]);
+
+      var optionText = null,
+          optionValue = null,
+          template = _.template('<option value="<%- value %>" <%= selected ? \'selected="selected"\' : "" %>><%- text %></option>', null, {variable: null}),
+          model = this.model,
+          selectedValues = model.get(this.column.get("name"));
+
+      delete this.$select;
+
+      this.$select = $("<select>", {tabIndex: -1}),
+      this.$el.append(this.$select);
+
+      for (var i = 0; i < optionValues.length; i++) {
+        var optionValue = optionValues[i];
+
+        if (_.isArray(optionValue)) {
+          optionText  = optionValue[0];
+          optionValue = optionValue[1];
+
+          this.$select.append(template({
+            text: optionText,
+            value: optionValue,
+            selected: _.indexOf(selectedValues, optionValue) > -1
+          }));
+        } else {
+          throw new TypeError("optionValues elements must be a name-value pair.");
+        }
+      }
+      // Initialize select2 control.
+      this.$select.select2(_.defaults(
+          {'disabled': !editable}, col.select2));
+
+      this.delegateEvents();
+
+      return this;
+    },
+
+    /**
+       Saves the value of the selected option to the model attribute.
+    */
+    onSave: function (e) {
+      var model = this.model;
+      var column = this.column;
+      model.set(column.get("name"), this.$select.val(),{silent:true});
+    }
+  });
   return Backgrid;
 
 }));


reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected], [email protected]
  Subject: Re: backgrid select2 cell
  In-Reply-To: <CAFiP3vz44HZy_3GwggVhpTU-tq9H+Es8+c9Rxm4GxnPiK4MKXg@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox