Miscellaneous

Text

You can display the user defined text for Button. Using text property, you can easily set text content for button. This text property overwrites the text that is provided on input button element.

The following steps explains you the details about rendering the button with specified text.

In the HTML page, add the following button elements to configure Button widget.

  • html
  • <button id="button_text">button</button>
  • javascript
  • /// <reference path="tsfiles/jquery.d.ts" />
    /// <reference path="tsfiles/ej.web.all.d.ts" />
    
    module ButtonComponent {
        $(function () {
            var basicButton = new ej.Button($("#button_text"), {
                size: "mini",
                //used to set the text content for button
                text: "Enter"
            });
        });
    }

    In the above code, the content of button “button” is replaced by the text value “Enter” that is given using text property.

    Execute the above code to render the following output.

    Show Rounded Corner

    Specifies the corner of button in round shape. By default button doesn’t have rounded corner. To set rounded corner, you can enable showRoundedCorner property.

    The following steps explains you the details about rendering the button with rounded corner.

    In the HTML page, add the following button elements to configure Button widget.

  • html
  • <button id="button_roundedCorner">button</button>
  • javascript
  • /// <reference path="tsfiles/jquery.d.ts" />
    /// <reference path="tsfiles/ej.web.all.d.ts" />
    
    module ButtonComponent {
        $(function () {
            var basicButton = new ej.Button($("#button_roundedCorner"), {
                size: "mini",
                //Enable or disable the rounded corner for button
                showRoundedCorner: true
            });
        });
    }

    Execute the above code to render the following output.