O'Reilly logo

Ext JS 4 Web Application Development Cookbook by Stuart Ashworth, Andrew Duncan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a split button

Split buttons are a great way of offering the user multiple actions while keeping the most common default action at the top level, and minimizing the number of buttons cluttering up the viewport.

This recipe will explain how to create a simple split button offering the user a choice of which format they would like to save their document.

How to do it...

  1. We start with a blank HTML document with the Ext JS framework included and an onReady function ready to have our code added.
  2. Now we have our structure, we create a new Ext.button.Split instance with some simple configuration. We start by giving it a text value, a tooltip, and a handler function:
    var splitButton = Ext.create('Ext.button.Split', { text: 'Save...', tooltip: 'Click ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required