Press return on text input to submit form when entering password?

Nov 20, 2018

Is this possible? My client loves what we made, but hates the first screen where it captures your login:

Can you make it single line input rather than multi line? Below is the link to the build. I am also struggling with making this fill properly on a mobile device - looks grand on a PC but rubbish on a mobile.

I included the actual working file if you want access to it! Feel free to make it your own project if you like.

http://m3dia.uk/responders/story.html

User: Test

Pass: Responder01!

 

 

7 Replies
Daniel Servan

Hi,

What do you mean by single line input?
The User and Password should be in the same input field or Text entry?
So it is like

Username / Password: Test Responder01!

Do you want it with that format?

If so, you can use Javascript to parse those 2 words and check.

You can use string.split(" ");

Here's the script flow but not the actual Javascript.

var theUserDetails = "Test Responder01!";
var arrString= Array();

arrString = theUserDetails.split(" ");

if (arrString[0] == "Test" && arrString[1] == "Responder01!"){

alert("Access Granted");

}else{

alert("Access Denied");

}

Designboy Chris

Hey thanks Daniel for getting back so fast! I explained it badly, what I have there is right, but notice when you type the password natural user experience would have you hit return to submit, but when you do this on my example it returns the password line. I want it to be single line only on the password and as a bonus to trigger the submit button on hitting return?

Designboy Chris

I think I reported my own post by accident! One of those days lol! 

Thanks for getting back and the screen grab, I have that enabled but my text on pressing return inside the password field then returns the line to add more. I dont want that.

I would as a bonus love it to submit the button below once I press return.

Designboy Chris

I found this and I think it is my answer... 
Only issue is my button triggers a set of 40 password checks before letting the user move forward. I think I've ran out of options on how to best do this.

Https://articulate.com/support/article/how-the-enter-key-behaves-in-data-entry-fields

Here is the dropbox to my working .story file... 

https://www.dropbox.com/s/et80e18ka86qet8/responders%20JAN%20V4%20MOST%20UPDATED.story?dl=0

This discussion is closed. You can start a new discussion or contact Articulate Support.