Button customization

21 Feb 20172 minutes to read

Left button caption

The LeftButtonCaption property is used to specify the text of the Left Button. The default value is cancel.

HTML

<div style="text-align: center;">
        <input data-role="ejmbutton" type="button" data-ej-text="Open Dialog" data-ej-touchend="openAlertDialog" />
    </div>
    <div id="alertdialog" data-role="ejmdialog" data-ej-leftbuttoncaption="OK" data-ej-mode="confirm">
        <div>
            10% of battery remaining
        </div>
    </div>

JS

function openAlertDialog(args) {
            $("#alertdialog").ejmDialog("open");
        }

Right button caption

The RightButtonCaption property specifies the text of the Right Button. The default value is continue.

HTML

<div style="text-align: center;">
        <input data-role="ejmbutton" type="button" data-ej-text="Open Dialog" data-ej-touchend="openAlertDialog" />
    </div>
    <div id="alertdialog" data-role="ejmdialog" data-ej-rightbuttoncaption="OK" data-ej-mode="confirm">
        <div>
            10% of battery remaining
        </div>
    </div>

JS

function openAlertDialog(args) {
            $("#alertdialog").ejmDialog("open");
        }

Show buttons

The ShowButtons property is used to show the buttons in the Dialog box. The default value is true.

HTML

<div style="text-align: center;">
        <input data-role="ejmbutton" type="button" data-ej-text="Open Dialog" data-ej-touchend="openAlertDialog" />
    </div>
    <div id="alertdialog" data-role="ejmdialog" data-ej-showbuttons="false" data-ej-mode="confirm">
        <div>
            10% of battery remaining
        </div>
    </div>

JS

function openAlertDialog(args) {
            $("#alertdialog").ejmDialog("open");
        }