In my previous post titled ‘Display an Alert or Action Sheet Using Swift in iOS 8' I showed you how to create and display an alert using Swift and iOS 8. In this post I will take that a step further and show you how to display a text entry field in an alert to get input from the user and use that input back in the application. In this example we will simply take the entered text and change a label on the view, however these simple principles apply for using the data any way you wish.
Let's get started.
First off, I created a new Swift based Single View Application and added one button and one label to the display. I also took advantage of Xcode and let it assign missing constraints for me so the view stays nice at any device size and rotation, I also added an @IBOutlet for the label and an @IBAction for the button. These should be familiar to you by now, if not please see my other Swift posts
From this point onwards we will be entering code in the button @IBAction that we created.
We need to create a variable to hold our instance of the UIAlertController
var alertController:UIAlertController?
Now we create the instance giving it the title and message to display.
alertController = UIAlertController(title: "Enter Text",
message: "Enter some text below",
preferredStyle: .Alert)
So far all we have created is an alert that shows a message, now we add the text entry field to capture the users input. The placeholder is a text prompt that will be displayed by default and will be replaced once the user starts typing on the keyboard.
alertController!.addTextFieldWithConfigurationHandler(
{(textField: UITextField!) in
textField.placeholder = "Enter something"
})
Next we need to create an action button that will perform the magic for us, for this we create a variable of type UIAlertAction. We give a label to the button along with a style and then the code to be executed when the button is touched. Note that the alert contains an array of text fields, since our dialog only has one we reference the first element in that array to access the correct text field even if there is only one by using theTextFields[0].text.
let action = UIAlertAction(title: "Submit",
style: UIAlertActionStyle.Default,
handler: {[weak self]
(paramAction:UIAlertAction!) in
if let textFields = alertController?.textFields{
let theTextFields = textFields as [UITextField]
let enteredText = theTextFields[0].text
self!.displayLabel.text = enteredText
}
})
With all the creation code done, the action needs to be added to the UIAlertController view.
alertController?.addAction(action)
Finally we display the alert on the screen.
self.presentViewController(alertController!,
animated: true,
completion: nil)
So the entire code content for the button should look like this
@IBAction func buttonTouched(sender: AnyObject) {
var alertController:UIAlertController?
alertController = UIAlertController(title: "Enter Text",
message: "Enter some text below",
preferredStyle: .Alert)
alertController!.addTextFieldWithConfigurationHandler(
{(textField: UITextField!) in
textField.placeholder = "Enter something"
})
let action = UIAlertAction(title: "Submit",
style: UIAlertActionStyle.Default,
handler: {[weak self]
(paramAction:UIAlertAction!) in
if let textFields = alertController?.textFields{
let theTextFields = textFields as [UITextField]
let enteredText = theTextFields[0].text
self!.displayLabel.text = enteredText
}
})
alertController?.addAction(action)
self.presentViewController(alertController!,
animated: true,
completion: nil)
}
Save the project and run in either the simulator or your device and try it out. Click the button on the view and the alert should appear waiting for some input.
Enter some text and touch / click Submit
You should now see the text you entered on the view displayed in the label.
I also have a post that shows you how to ‘Display an Alert or Action Sheet.'
What if user enters no name. Can you provide code to validate?
Awesome, thanks for the assistance, Peter!
hey do you know how to add multiple text fields ??
hey do you know how to add multiple text fields ??