How to add two edit text fields in an alert dialog

Question

I am trying to use an alert dialog to prompt for a username and a password in android. I have found this code here:

  if (token.equals("Not Found"))
    {
        LayoutInflater factory = LayoutInflater.from(this);            
        final View textEntryView = factory.inflate(R.layout.userpasslayout, null);

        AlertDialog.Builder alert = new AlertDialog.Builder(this); 

        alert.setTitle("Please Login to Fogbugz"); 
        alert.setMessage("Enter your email and password"); 
        // Set an EditText view to get user input  
        alert.setView(textEntryView); 
        AlertDialog loginPrompt = alert.create();

        final EditText input1 = (EditText) loginPrompt.findViewById(R.id.username);
        final EditText input2 = (EditText) loginPrompt.findViewById(R.id.password);

        alert.setPositiveButton("Login", new DialogInterface.OnClickListener() { 
        public void onClick(DialogInterface dialog, int whichButton) { 
            input1.getText().toString(); **THIS CRASHES THE APPLICATION**


        } 
        }); 

        alert.setNegativeButton("Cancel", new DialogInterface.OnClickListener() { 
          public void onClick(DialogInterface dialog, int whichButton) { 
            // Canceled. 
          } 
        }); 

        alert.show(); 

    }

EDIT: I was able to set up the proper layout, but receive an error when I try to access the text field. What is the problem here?

score 59 · Answer 1 · edited Dec 17 '15 at 12:05

59

Check this code in alert box have edit textview when click OK it displays on screen using toast.

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    final AlertDialog.Builder alert = new AlertDialog.Builder(this);
    final EditText input = new EditText(this);
    alert.setView(input);
    alert.setPositiveButton("Ok", new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int whichButton) {
            String value = input.getText().toString().trim();
            Toast.makeText(getApplicationContext(), value, 
                Toast.LENGTH_SHORT).show();
        }
    });

    alert.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int whichButton) {
            dialog.cancel();
        }
    });
    alert.show();               
}

edited Dec 17 '15 at 12:05

pevik

4,523
3
33
44

answered Aug 26 '10 at 07:07

ud_an

4,939
4
27
43

23

He wanted two EditText fields.. not one – Dediqated Sep 13 '13 at 08:33
Simply add another one with name input2 and then also alert.setView(input2); – Zar E Ahmer May 08 '14 at 06:05
10

@Nepster - `set` means that the new view (input2) will override the old view (input1). – AlikElzin-kilaka Jun 09 '14 at 11:58
Exactly, you can't simply add Views like this, once you stablish a view by using setView() it overrides the other setView(), that's now an answer for the real question – Windgate Jul 12 '23 at 09:15

score 25 · Accepted Answer · edited Aug 03 '13 at 10:32

25

The API Demos in the Android SDK have an example that does just that.

It's under DIALOG_TEXT_ENTRY. They have a layout, inflate it with a LayoutInflater, and use that as the View.

EDIT: What I had linked to in my original answer is stale. Here is a mirror.

edited Aug 03 '13 at 10:32

answered Aug 06 '10 at 19:13

EboMike

76,846
14
164
167

This worked, but I still receive an error when I try to access the EditText. I edited my answer, is there some problem because the fields are not yet built? – mbauer14 Aug 06 '10 at 21:13
This sample code is no longer present on the website or the latest samples – conners Jul 18 '12 at 08:42
Updated with a link to a mirror. – EboMike Jul 19 '12 at 07:17
6

Posting links that work now but may not work later is clearly a bad thing for coders who read this post years later. Consider in the future also this aspect and just post a snippet from that code (with proper references to it). – Valentin Despa Dec 08 '12 at 11:56

score 19 · Answer 3 · answered Aug 26 '10 at 04:36

19

Use these lines in the code, because the textEntryView is the parent of username edittext and password edittext.

    final EditText input1 = (EditText) textEntryView .findViewById(R.id.username); 
    final EditText input2 = (EditText) textEntryView .findViewById(R.id.password);

answered Aug 26 '10 at 04:36

Nandy

191
3

Been stuck on this for so long. I thought I wasn't inflating properly but it turns out I was using the wrong parent. Thanks for your input Nandy! – Kitteh Sep 21 '11 at 09:20

D.Snap · Answer 4 · 2014-06-23T05:47:26.433

               /* Didn't test it but this should work "out of the box" */

                AlertDialog.Builder builder = new AlertDialog.Builder(this);
                //you should edit this to fit your needs
                builder.setTitle("Double Edit Text");

                final EditText one = new EditText(this);
                from.setHint("one");//optional
                final EditText two = new EditText(this);
                to.setHint("two");//optional

                //in my example i use TYPE_CLASS_NUMBER for input only numbers
                from.setInputType(InputType.TYPE_CLASS_NUMBER);
                to.setInputType(InputType.TYPE_CLASS_NUMBER);

                LinearLayout lay = new LinearLayout(this);
                lay.setOrientation(LinearLayout.VERTICAL);
                lay.addView(one);
                lay.addView(two);
                builder.setView(lay);

                // Set up the buttons
                builder.setPositiveButton("Ok", new DialogInterface.OnClickListener() {
                  public void onClick(DialogInterface dialog, int whichButton) {
                       //get the two inputs
                       int i = Integer.parseInt(one.getText().toString());
                       int j = Integer.parseInt(two.getText().toString());
                  }
                });

                builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
                  public void onClick(DialogInterface dialog, int whichButton) {
                       dialog.cancel();
                }
              });
              builder.show();

score 10 · Answer 5 · edited Sep 05 '13 at 20:07

 LayoutInflater factory = LayoutInflater.from(this);
final View textEntryView = factory.inflate(R.layout.text_entry, null);
//text_entry is an Layout XML file containing two text field to display in alert dialog
final EditText input1 = (EditText) textEntryView.findViewById(R.id.EditText1);
final EditText input2 = (EditText) textEntryView.findViewById(R.id.EditText2);             
input1.setText("DefaultValue", TextView.BufferType.EDITABLE);
input2.setText("DefaultValue", TextView.BufferType.EDITABLE);
final AlertDialog.Builder alert = new AlertDialog.Builder(this);

alert.setIcon(R.drawable.icon)
     .setTitle("Enter the Text:")
     .setView(textEntryView)
     .setPositiveButton("Save", 
         new DialogInterface.OnClickListener() {
             public void onClick(DialogInterface dialog, int whichButton) {
                    Log.i("AlertDialog","TextEntry 1 Entered "+input1.getText().toString());
                    Log.i("AlertDialog","TextEntry 2 Entered "+input2.getText().toString());
                    /* User clicked OK so do some stuff */
             }
         })
     .setNegativeButton("Cancel",
         new DialogInterface.OnClickListener() {
             public void onClick(DialogInterface dialog,
                    int whichButton) {
             }
         });
alert.show();

Vince Yuan · Answer 6 · 2014-05-03T07:26:36.063

Check the following code. It shows 2 edit text fields programmatically without any layout xml. Change 'this' to 'getActivity()' if you use it in a fragment.

The tricky thing is we have to set the second text field's input type after creating alert dialog, otherwise, the second text field shows texts instead of dots.

    public void showInput() {
        OnFocusChangeListener onFocusChangeListener = new OnFocusChangeListener() {
            @Override
            public void onFocusChange(final View v, boolean hasFocus) {
                if (hasFocus) {
                    // Must use message queue to show keyboard
                    v.post(new Runnable() {
                        @Override
                        public void run() {
                            InputMethodManager inputMethodManager= (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE);
                            inputMethodManager.showSoftInput(v, 0);
                        }
                    });
                }
            }
        };

        final EditText editTextName = new EditText(this);
        editTextName.setHint("Name");
        editTextName.setFocusable(true);
        editTextName.setClickable(true);
        editTextName.setFocusableInTouchMode(true);
        editTextName.setSelectAllOnFocus(true);
        editTextName.setSingleLine(true);
        editTextName.setImeOptions(EditorInfo.IME_ACTION_NEXT);
        editTextName.setOnFocusChangeListener(onFocusChangeListener);

        final EditText editTextPassword = new EditText(this);
        editTextPassword.setHint("Password");
        editTextPassword.setFocusable(true);
        editTextPassword.setClickable(true);
        editTextPassword.setFocusableInTouchMode(true);
        editTextPassword.setSelectAllOnFocus(true);
        editTextPassword.setSingleLine(true);
        editTextPassword.setImeOptions(EditorInfo.IME_ACTION_DONE);
        editTextPassword.setOnFocusChangeListener(onFocusChangeListener);

        LinearLayout linearLayout = new LinearLayout(this);
        linearLayout.setOrientation(LinearLayout.VERTICAL);
        linearLayout.addView(editTextName);
        linearLayout.addView(editTextPassword);

        DialogInterface.OnClickListener alertDialogClickListener = new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                switch (which){
                case DialogInterface.BUTTON_POSITIVE:
                    // Done button clicked
                    break;
                case DialogInterface.BUTTON_NEGATIVE:
                    // Cancel button clicked
                    break;
                }
            }
        };
        final AlertDialog alertDialog = (new AlertDialog.Builder(this)).setMessage("Please enter name and password")
                .setView(linearLayout)
                .setPositiveButton("Done", alertDialogClickListener)
                .setNegativeButton("Cancel", alertDialogClickListener)
                .create();

        editTextName.setOnEditorActionListener(new OnEditorActionListener() {
            @Override
            public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
                editTextPassword.requestFocus(); // Press Return to focus next one
                return false;
            }
        });
        editTextPassword.setOnEditorActionListener(new OnEditorActionListener() {
            @Override
            public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
                // Press Return to invoke positive button on alertDialog.
                alertDialog.getButton(AlertDialog.BUTTON_POSITIVE).performClick();
                return false;
            }
        });

        // Must set password mode after creating alert dialog.
        editTextPassword.setInputType(InputType.TYPE_TEXT_VARIATION_PASSWORD);
        editTextPassword.setTransformationMethod(PasswordTransformationMethod.getInstance());
        alertDialog.show();
    }

score 1 · Answer 7 · answered Aug 06 '10 at 19:14

Have a look at the AlertDialog docs. As it states, to add a custom view to your alert dialog you need to find the frameLayout and add your view to that like so:

FrameLayout fl = (FrameLayout) findViewById(android.R.id.custom);
fl.addView(myView, new LayoutParams(MATCH_PARENT, WRAP_CONTENT));

Most likely you are going to want to create a layout xml file for your view, and inflate it:

LayoutInflater inflater = getLayoutInflater();
View twoEdits = inflater.inflate(R.layout.my_layout, f1, false);

score 0 · Answer 8 · edited Nov 02 '11 at 06:38

I found another set of examples for customizing an AlertDialog from a guy named Mossila. I think they're better than Google's examples. To quickly see Google's API demos, you must import their demo jar(s) into your project, which you probably don't want.

But Mossila's example code is fully self-contained. It can be directly cut-and-pasted into your project. It just works! Then you only need to tweak it to your needs. See here

How to add two edit text fields in an alert dialog

8 Answers8

Linked