RegEX for Dropdown select, RegEx for Password simulation
I am currently working on a prototype that includes various input fields such as Password, select dropdown, and check box, among others.
I am encountering a couple of issues that I am hoping you can help me with:
- I am struggling to create an error state for the dropdown field in case it is left unselected. I have attempted to apply RegEx similar to selecting the RegEx(Field x, "") method, but it did not yield any results. Can you guide me on how to simulate an error for the dropdown?
- I am attempting to implement RegEx on the password field to meet the following criteria: The password must be at least 8 characters long and must contain at least one uppercase letter, one lowercase letter, one number or symbol. Although I have successfully implemented the "no fill error" expression to the field, I am having trouble applying the same to the remaining criteria. Can you assist me in this regard?
- Finally, I would like to ensure that the user selects the T&C checkbox before proceeding to the next task. How can I prevent them from moving forward without ticking the checkbox?
Thank you for your assistance.
Let me know if I'll have to attach the file for your reference for this.
Hello, I leave you more information about forms with mandatory fields: https://www.justinmind.com/support/how-to-prototype-forms-with-mandatory-fields
Regarding your point number 3, I am attaching an example where you can see how to condition an action depending on a selection.
Let me know how it goes.
Regards.
Hello, I leave you more information about forms with mandatory fields: https://www.justinmind.com/support/how-to-prototype-forms-with-mandatory-fields
Regarding your point number 3, I am attaching an example where you can see how to condition an action depending on a selection.
Let me know how it goes.
Regards.
Thank you, for attaching the sample file.
The example helps. However, I didn't understand how to simulate error state if the dropdown isn't selected. Could you share a sample for the same? I'd really appreciate it
Thank you, for attaching the sample file.
The example helps. However, I didn't understand how to simulate error state if the dropdown isn't selected. Could you share a sample for the same? I'd really appreciate it
Hello, I am attaching an example where you can see a way to perform this action, the events are attached to the button.
Regards.
Hello, I am attaching an example where you can see a way to perform this action, the events are attached to the button.
Regards.
Hi Ria,
I was hoping you could help me with a couple of things. I've attached a file for your reference.
Firstly, I added an error status to an input fields, and now I'm trying to set it up so that the error state disappears when the user starts typing and the field goes into focus. However, I'm having trouble with this - the error state isn't going away as I expected, and I'm not sure where I'm going wrong. Could you please take a look and see if you can help me figure out what's going on?
Secondly, I'm having trouble getting a password input field to meet a certain condition - specifically, I want it to require 8 or more characters and contain at least one uppercase letter, symbol, or number. Unfortunately, I haven't been able to make it work the way I want to. Could you please provide some guidance on how I can apply these conditions correctly?
Thanks in advance for your help!
Hi Ria,
I was hoping you could help me with a couple of things. I've attached a file for your reference.
Firstly, I added an error status to an input fields, and now I'm trying to set it up so that the error state disappears when the user starts typing and the field goes into focus. However, I'm having trouble with this - the error state isn't going away as I expected, and I'm not sure where I'm going wrong. Could you please take a look and see if you can help me figure out what's going on?
Secondly, I'm having trouble getting a password input field to meet a certain condition - specifically, I want it to require 8 or more characters and contain at least one uppercase letter, symbol, or number. Unfortunately, I haven't been able to make it work the way I want to. Could you please provide some guidance on how I can apply these conditions correctly?
Thanks in advance for your help!
Additionally, whenever I attempt to share the user testing link for Android phones, the screen freezes. Can you provide assistance with this issue as well? The vertical scroll doesn't work
Additionally, whenever I attempt to share the user testing link for Android phones, the screen freezes. Can you provide assistance with this issue as well? The vertical scroll doesn't work
Hello, in the case of the password input, the sign up button has a "show visible element" event for the error texts, when you focus on the password input, on the "focus in" event that you already have on that password input, you should add a "hide element" event that hides those texts.
For this point you can use regex expressions. ^(?=.[A-Z]).+$ to check if the text includes a capital letter. ^(?=.[0-9]).+$ to check if the text includes a number and ^(?=.*[@,.$%]).+$ to check if it contains any symbols (you can add the symbols that you want to be checked between the []
The condition to check if an input meets those conditions would be this, where it puts value is its text input.
The vp that you have send us includes blank spaces in the file name (at the end, it ends with a blank space. It is JIM-Signup .vp), could you edit the name and re-share the project from scratch? Then, could you specify where it frezes? Is it on the mobile that the screen does not load or is it in prototyper in the run user test dialog?
Thanks.
Hello, in the case of the password input, the sign up button has a "show visible element" event for the error texts, when you focus on the password input, on the "focus in" event that you already have on that password input, you should add a "hide element" event that hides those texts.
For this point you can use regex expressions. ^(?=.[A-Z]).+$ to check if the text includes a capital letter. ^(?=.[0-9]).+$ to check if the text includes a number and ^(?=.*[@,.$%]).+$ to check if it contains any symbols (you can add the symbols that you want to be checked between the []
The condition to check if an input meets those conditions would be this, where it puts value is its text input.
The vp that you have send us includes blank spaces in the file name (at the end, it ends with a blank space. It is JIM-Signup .vp), could you edit the name and re-share the project from scratch? Then, could you specify where it frezes? Is it on the mobile that the screen does not load or is it in prototyper in the run user test dialog?
Thanks.
Hello Ria,
Thank you for your message. I have attempted to apply the conditions you provided, but only capital letters (A-Z) are functioning properly. The other expressions are not working, especially when I combine them, and they do not work even when applied separately. I have attached a screenshot (Ref: Screenshot 2023-05-12) to show the error that occurs when I use the regular expression for an eight-character count in the input field.
Additionally, I have attached a working file to demonstrate that the error does not detect when I do not include numbers in the password input field, but it does detect when there are no capital letters. I would appreciate any assistance you can provide with this issue.
Moreover, when I share the screen for user testing on Android phones, it becomes stuck, and the fonts are not being embedded in the prototype. The headline and sub-headline fonts should be Abhaya Libre and Nunito, respectively, but they are not being detected.
Hello Ria,
Thank you for your message. I have attempted to apply the conditions you provided, but only capital letters (A-Z) are functioning properly. The other expressions are not working, especially when I combine them, and they do not work even when applied separately. I have attached a screenshot (Ref: Screenshot 2023-05-12) to show the error that occurs when I use the regular expression for an eight-character count in the input field.
Additionally, I have attached a working file to demonstrate that the error does not detect when I do not include numbers in the password input field, but it does detect when there are no capital letters. I would appreciate any assistance you can provide with this issue.
Moreover, when I share the screen for user testing on Android phones, it becomes stuck, and the fonts are not being embedded in the prototype. The headline and sub-headline fonts should be Abhaya Libre and Nunito, respectively, but they are not being detected.
Hello,
You are using onChange and onFocusOut events at the same time in the password input, you could choose one, for example the focusOut one.
The count of a text counts how many characters the text has, but you have to pass the text as a parameter, in the screenshot you are trying to pass a comparison as a parameter, that is, count(text < 7), it should be count (text) < 7.
I am attaching an example with all the conditions combined so you can see how it works.
Sources is a bug that has already been reported and is being worked on to resolve it.
Could you tell us what would be stuck? The scrolls don't work? The screen doesn't load well?
thanks
Hello,
You are using onChange and onFocusOut events at the same time in the password input, you could choose one, for example the focusOut one.
The count of a text counts how many characters the text has, but you have to pass the text as a parameter, in the screenshot you are trying to pass a comparison as a parameter, that is, count(text < 7), it should be count (text) < 7.
I am attaching an example with all the conditions combined so you can see how it works.
Sources is a bug that has already been reported and is being worked on to resolve it.
Could you tell us what would be stuck? The scrolls don't work? The screen doesn't load well?
thanks
At the start of the prototype's loading process, the screen does not scroll. Furthermore, even if it eventually begins scrolling, it freezes again whenever an input field is populated.
Not sure, how do I fix that! Is there anything that you could recommend to make the design more adaptive to different screens and ensure the screen doesn't freeze?
At the start of the prototype's loading process, the screen does not scroll. Furthermore, even if it eventually begins scrolling, it freezes again whenever an input field is populated.
Not sure, how do I fix that! Is there anything that you could recommend to make the design more adaptive to different screens and ensure the screen doesn't freeze?
I also tried doing the show password on the input field - however, it doesn't show/hide the input text.
How do we do that?
I also tried doing the show password on the input field - however, it doesn't show/hide the input text.
How do we do that?
Hello, I have attached an example, please let me know if this is what you need.
Regards.
Hello, I have attached an example, please let me know if this is what you need.
Regards.
Is there a way to shut the hotspots off?
Is there a way to shut the hotspots off?
Hello, the link is not public so we cannot see the project. Are you using the mobile app to see the projects? About "hotspots" if you want that they are not seen in editing, you can go to the View->Preview menu and from there you can deactivate them. If you want the events to not executed, you have to put conditions.
Regards.
Hello, the link is not public so we cannot see the project. Are you using the mobile app to see the projects? About "hotspots" if you want that they are not seen in editing, you can go to the View->Preview menu and from there you can deactivate them. If you want the events to not executed, you have to put conditions.
Regards.
The file I shared, JIM-SIGNUP_2.vp, is the identical file that experiences issues when creating a prototype link for user testing. You can refer to the link provided: https://cloud.justinmind.com/usernote/prototype/a25dc8ac703d36122947f93d6dc89b46437277d510e74234228724f496b23000 (Anyone with the link can view it)
I am currently using a mobile device to access the link, but I prefer not to view it through the mobile application. Instead, I intend to test the design using the same link on a user testing website. Therefore, it would be more suitable to test it on a browser.
The design is encountering a problem where it does not scroll properly. The scrolling is extremely slow, and when selecting an input field, the entire design freezes on the screen. In other words, it becomes unresponsive and fails to scroll.
Does it have to do with the screen size or the way the design is set-up?
I would greatly appreciate your assistance in understanding why this issue is occurring. It seems to happen on Android phones as well as the iPhone 11.
The file I shared, JIM-SIGNUP_2.vp, is the identical file that experiences issues when creating a prototype link for user testing. You can refer to the link provided: https://cloud.justinmind.com/usernote/prototype/a25dc8ac703d36122947f93d6dc89b46437277d510e74234228724f496b23000 (Anyone with the link can view it)
I am currently using a mobile device to access the link, but I prefer not to view it through the mobile application. Instead, I intend to test the design using the same link on a user testing website. Therefore, it would be more suitable to test it on a browser.
The design is encountering a problem where it does not scroll properly. The scrolling is extremely slow, and when selecting an input field, the entire design freezes on the screen. In other words, it becomes unresponsive and fails to scroll.
Does it have to do with the screen size or the way the design is set-up?
I would greatly appreciate your assistance in understanding why this issue is occurring. It seems to happen on Android phones as well as the iPhone 11.
I've attached the video for your reference in case the link doesn't work for you - here is a video recording of the prototype on my android phone. I am attempting to scroll but nothing is happening, and when the keyboard opens the input field is covered up and the screen remains stuck.
I've attached the video for your reference in case the link doesn't work for you - here is a video recording of the prototype on my android phone. I am attempting to scroll but nothing is happening, and when the keyboard opens the input field is covered up and the screen remains stuck.
Hello, could you confirm if you have tested the prototype that we gave you two days ago with your mobile?
Regards,
Hello, could you confirm if you have tested the prototype that we gave you two days ago with your mobile?
Regards,
Yes, I have tested the prototype that you shared with me. It still has the same problem :(
Yes, I have tested the prototype that you shared with me. It still has the same problem :(
Hello,
We will be sending this information to our product engineers and will get back to you soon.
Regards
Hello,
We will be sending this information to our product engineers and will get back to you soon.
Regards
Hello Ria,
Thank you, please keep me posted - as it'll help me in testing with the android phones as well.
Hello Ria,
Thank you, please keep me posted - as it'll help me in testing with the android phones as well.
Hello Ria,
I wanted to follow up on the android responsive problem. It would be greatly appreciated if you could provide us with an update on the issue, as our user testing depends on the prototype functioning properly on android phones. Otherwise, we won't be able to proceed with JIM.
Hello Ria,
I wanted to follow up on the android responsive problem. It would be greatly appreciated if you could provide us with an update on the issue, as our user testing depends on the prototype functioning properly on android phones. Otherwise, we won't be able to proceed with JIM.
Hello,
We will be sending this information to our product engineers and will get back to you soon.
Regards
Hello,
We will be sending this information to our product engineers and will get back to you soon.
Regards
Hello, the problem is that when you try to scroll with your finger you are touching the Dynamic Panel "Card BG" and it doesn't scroll since that dynamic panel is already very high and you don't need to scroll to see anything (because it doesn't have any element inside). There is a structural problem. In order for it to scroll on "Card BG", it must be smaller and must have elements that do not fit in the container for the scroll to be displayed. You can try to make the dynamic panel of "Card BG" of height 450 for example (or the size of the mobile), and that it is pinned both in the x and in the y. And then, put all the inputs and texts you have inside "Card BG".
Regards.
Hello, the problem is that when you try to scroll with your finger you are touching the Dynamic Panel "Card BG" and it doesn't scroll since that dynamic panel is already very high and you don't need to scroll to see anything (because it doesn't have any element inside). There is a structural problem. In order for it to scroll on "Card BG", it must be smaller and must have elements that do not fit in the container for the scroll to be displayed. You can try to make the dynamic panel of "Card BG" of height 450 for example (or the size of the mobile), and that it is pinned both in the x and in the y. And then, put all the inputs and texts you have inside "Card BG".
Regards.
Hi Ria,
I have enclosed a file containing the password requirements you previously provided. Unfortunately, in my prototype, the system is not recognizing the conditions of having a minimum character count of 8, symbols, and numbers. The only condition that seems to be acknowledged is the requirement for uppercase letters. I have diligently followed all the steps outlined in the file you shared, but the functionality is not working as intended on my side. I would greatly appreciate your assistance in resolving this matter. Thank you!
Best regards,
Hi Ria,
I have enclosed a file containing the password requirements you previously provided. Unfortunately, in my prototype, the system is not recognizing the conditions of having a minimum character count of 8, symbols, and numbers. The only condition that seems to be acknowledged is the requirement for uppercase letters. I have diligently followed all the steps outlined in the file you shared, but the functionality is not working as intended on my side. I would greatly appreciate your assistance in resolving this matter. Thank you!
Best regards,
Hello, you are using onChange and onFocusOut events at the same time in the password input; you could choose one, for example, the focused one, the onchange is applied when you focus out of the input (you have finished writing to it).
You could remove the event, once you have removed the focusOut event, in the onChange condition, the part that checks for case should be ^(?=.*[A-Z]).+$ yours is: ^( ?=.[A-Z]).+$ (missing *)
Regards.
Hello, you are using onChange and onFocusOut events at the same time in the password input; you could choose one, for example, the focused one, the onchange is applied when you focus out of the input (you have finished writing to it).
You could remove the event, once you have removed the focusOut event, in the onChange condition, the part that checks for case should be ^(?=.*[A-Z]).+$ yours is: ^( ?=.[A-Z]).+$ (missing *)
Regards.
Regarding the Show/Hide password file you shared, I have attached it here for your convenience.
I attempted to implement it, but I encountered some difficulties. Specifically, I need clarification on how we set the value for the Password input field. Could you please explain the process and provide more information on what you are setting it to?
There are two fields involved:
Could you provide further details on the specific value we should be setting for each of these fields? I would greatly appreciate it if you could elaborate on this matter.
Furthermore, it would be highly beneficial if you could provide an example where the "eye" icon is placed within the input field, as opposed to outside as demonstrated in your file. I believe that the interactions may vary significantly when the eye icon is positioned inside the field rather than outside.
Regarding the Show/Hide password file you shared, I have attached it here for your convenience.
I attempted to implement it, but I encountered some difficulties. Specifically, I need clarification on how we set the value for the Password input field. Could you please explain the process and provide more information on what you are setting it to?
There are two fields involved:
Could you provide further details on the specific value we should be setting for each of these fields? I would greatly appreciate it if you could elaborate on this matter.
Furthermore, it would be highly beneficial if you could provide an example where the "eye" icon is placed within the input field, as opposed to outside as demonstrated in your file. I believe that the interactions may vary significantly when the eye icon is positioned inside the field rather than outside.
Hello, in the example that we sent you, you can see in the layers palette the elements that were used, in this case, you have:
- Two inputs on top of each other, the first input has the "type" in properties, is set to "password" and the second input to text with the "hide in simulation" activated; in each input, an event "on focus out" + "set value", with a calculated value that points to the other input (when you write to any input, the other input takes the same value).
- A dynamic panel for the visible eye icon and a panel for the invisible icon, each panel contains an eye icon, visible/invisible, and a hotspot. In the hotspot you can see an event "on click" + "set active panel" pointed to the opposite icon, and you will also see the event to show and hide the inputs, depending on which panel you have active.
Regards.
Hello, in the example that we sent you, you can see in the layers palette the elements that were used, in this case, you have:
- Two inputs on top of each other, the first input has the "type" in properties, is set to "password" and the second input to text with the "hide in simulation" activated; in each input, an event "on focus out" + "set value", with a calculated value that points to the other input (when you write to any input, the other input takes the same value).
- A dynamic panel for the visible eye icon and a panel for the invisible icon, each panel contains an eye icon, visible/invisible, and a hotspot. In the hotspot you can see an event "on click" + "set active panel" pointed to the opposite icon, and you will also see the event to show and hide the inputs, depending on which panel you have active.
Regards.
Dear Rhea,
I greatly appreciate your assistance thus far, but I still have a few more inquiries. I have attached the file for your reference. Specifically, I require assistance with the password input field. Currently, when an incorrect password is entered, it displays an error state. However, once the correct password is entered, the error state fails to revert. Could you please review the Events that I have implemented in the file and provide guidance on how to rectify this issue?
Additionally, I am able to create an event that triggers an error message if all the fields are left empty, but not I am not understanding how to allow progression to the next screen only when all the fields are correctly filled. Despite my attempts at creating the necessary events, they are not functioning as intended. Could you please explain the steps to correct this problem?
Dear Rhea,
I greatly appreciate your assistance thus far, but I still have a few more inquiries. I have attached the file for your reference. Specifically, I require assistance with the password input field. Currently, when an incorrect password is entered, it displays an error state. However, once the correct password is entered, the error state fails to revert. Could you please review the Events that I have implemented in the file and provide guidance on how to rectify this issue?
Additionally, I am able to create an event that triggers an error message if all the fields are left empty, but not I am not understanding how to allow progression to the next screen only when all the fields are correctly filled. Despite my attempts at creating the necessary events, they are not functioning as intended. Could you please explain the steps to correct this problem?
Hello, in your project, the password check works correctly, that is, if it meets the conditions, the error message does not show, however when you click on the sign-up button, the error shows anyway, this is because you have an extra interaction, if you remove interaction number 8, this problem is solved. To navigate to a new screen, you could put another interaction that when all 8 interactions have been executed, check if all error messages are hidden and if so, navigate.
Regards.
Hello, in your project, the password check works correctly, that is, if it meets the conditions, the error message does not show, however when you click on the sign-up button, the error shows anyway, this is because you have an extra interaction, if you remove interaction number 8, this problem is solved. To navigate to a new screen, you could put another interaction that when all 8 interactions have been executed, check if all error messages are hidden and if so, navigate.
Regards.
Hello Ria! I appreciate your assistance, it was helpful. Presently, I'm facing an issue where my sign-up button disappears after I click on the T&C (Terms and Conditions) checkbox. I'm uncertain about the cause of this problem. Would you be able to provide me with some guidance regarding this matter?
Hello Ria! I appreciate your assistance, it was helpful. Presently, I'm facing an issue where my sign-up button disappears after I click on the T&C (Terms and Conditions) checkbox. I'm uncertain about the cause of this problem. Would you be able to provide me with some guidance regarding this matter?
Hello, I am glad that the information has been useful to you.
Regarding the sign-up button error, I was not able to reproduce it, could you tell us what browser you are using? Could you send us a video of the error?
Thank you
Hello, I am glad that the information has been useful to you.
Regarding the sign-up button error, I was not able to reproduce it, could you tell us what browser you are using? Could you send us a video of the error?
Thank you
Replies have been locked on this page!