In this Plunker I have a prompt which asks for a name and an email address, I check if the email is provided, and then either alert or process the data accordingly.
What I would like to know is if it is possible to feedback to the user that an input is incorrect, for example adding the border bottom red attribute and also to display an error message underneath the input like in the standard material design error pattern.
I know the inputs in the prompt aren’t wrapped in a form which may make things trickier but does anybody have any suggestions on how to do this?
Also should this be considered as a feature because to me validation messages in prompts sound like a common scenario?
7 Likes
Could you use a Modal instead of an Alert? That would give you complete control over the template, and you could do form stuff.
I could implement it using a Modal, although trying to get the Modal to look like the prompt will take a lot of CSS work.
My point is that a prompt is used to request an input and this input will usually be at least a required input so it makes sense to wrap it in a form so validators can be attached. If i’m the only one of all the framework users that see this then I guess there isn’t any point in changing the prompt implementation but if others agree with my view then it would be nice to provide us with that functionality 
7 Likes
I ran across the same problem. I like the idea of a Prompt-Alert, but if a cannot validate the input i always have build a modal with a form which is always more effort,
It would probably be pretty tough to change the CSS of an input element on the alert, but you can easily add to the message of the alert to give more details on the email being invalid. Here’s what I did:
let alert = this.alertCtrl.create({ ... });
alert.data.message = alert.data.message +'<br><br>Invalid email address';
Unfortunately if you try to add in a style to the message (for example in a span element) it will strip out (sanitize) any additional css from the message string.