This patch is working for make dropDown button a jquery
widget.
We can create a dropdown button simply with:
$('#buttonId').dropdownButton();

And in html:

<div id="buttonId">
    <span class="text">$_("Button label")</span><span class="arrow"></span>
    <div>
       <button><span class="text">$_("dropdownbutton1")</span></button>
       <button><span class="text">$_("dropdownbutton2")</span></button>
    </div>
</div>

If we need some other style, you can add it to html, and bind action in js.
Not a perfect widget, but a beginning.
Signed-off-by: zhoumeina <zhoumein@linux.vnet.ibm.com>
---
 ui/js/widgets/button-dropDown.js |   42 ++++++++++++++++++++++++++++++++++++++
 1 files changed, 42 insertions(+), 0 deletions(-)
 create mode 100644 ui/js/widgets/button-dropDown.js

diff --git a/ui/js/widgets/button-dropDown.js b/ui/js/widgets/button-dropDown.js
new file mode 100644
index 0000000..49259e3
--- /dev/null
+++ b/ui/js/widgets/button-dropDown.js
@@ -0,0 +1,42 @@
+/*
+ * Project Kimchi
+ *
+ * Copyright IBM, Corp. 2013
+ *
+ * Authors:
+ *  zhoumeina <zhoumein@linux.vnet.ibm.com>
+ *
+ * Licensed under the Apache License, Version 2.0 (the 'License');
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an 'AS IS' BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+(function($) {
+    $.widget('kimchi.dropdownButton', {
+        options: {
+               key: 0,
+               value: 0
+              },

+
+        _create : function() {
+            this.actionDiv = this.element;
+            this.actionDiv.addClass('btn dropdown popable');
+            this.actionDiv.find('div').addClass('popover');
+            this.actionDiv.find('button').addClass('button-big');
+        },
+
+        _setOption : function(key,value) {},

+
+        destroy : function() {
+            // call the base destroy function
+            $.Widget.prototype.destroy.call(this);
+        }

+    });
+}(jQuery));
\ No newline at end of file