How to Create a Dialog with "Ok" and "Cancel" Options

How to create a dialog with “Ok” and “Cancel” options

You’re probably looking for confirm(), which displays a prompt and returns true or false based on what the user decided:

if (confirm('Are you sure you want to save this thing into the database?')) {  // Save it!  console.log('Thing was saved to the database.');} else {  // Do nothing!  console.log('Thing was not saved to the database.');}

How to bring up an okay / cancel dialog box in Javascript?

You can achieve it by using confirm, use the code as below:

<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
confirm("Press a button!");
}
</script>

The above example is very basic, if you some designed confirm box then please check craftpip's jquery-confirm Hope you like it.

Overriding OK and Cancel buttons in a dialog

A button has a DialogResult property and, when this property is set to something different than None, clicking that button automatically closes the dialog.
You can use this behavior to write simpler code in your button event handlers

Private Sub OK_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles OK.Click
    If PasswordTextBox.Text.Length < 8 Then
        MessageBox.Show("Passwords must be at least 8 characters long.")
        ' Not good, stop the form's closure.
        Me.DialogResult = DialogResult.None
    End If
End Sub

In this example I block the default behavior of the button only if there is something that is not right. Setting the form's DialogResult property to DialogResult.None blocks the default closure when you press a button with a DialogResult property set to something different than None.

The same approach could be used for your cancel button

Adding Ok/Cancel buttons to DialogFragment

You shall override onCreateDialog and use AlertDialog.Builder to set the Positive and Negative buttons something like below:

@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
    String title = getArguments().getString("title");
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    builder.setTitle(title);
    builder.setMessage("Are you sure?");

    // Edited: Overriding onCreateView is not necessary in your case
    LayoutInflater inflater = LayoutInflater.from(getContext());
    View newFileView = inflater.inflate(R.layout.fragment_newfile, null);
    builder.setView(newFileView);

    builder.setPositiveButton("OK",  new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            // on success
        }
    });
    builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            dialog.dismiss();
        }
    });

    return builder.create();
}

Ok and Cancel button on right OR left side of the Dialog window?

Set a standard for all your products, so they all have the same behaviour.

Investigate and follow the standard for the OS/Platform you are developing for.

Consider that some cultures/regions may expect different button positions.

Make it possible to change your mind easily without revisting every dialog.

---

Related Topics