React form validation for multiple field - reactjs

I am new to React. I have a very simple form which contains employer address details. I would like to validate if any of the fields got value, then check if length is <=10 and if not exists the it is fine. There are no mandatory validation and only length valiation if exists.
currently doing like below:
const isValid=
employer.address == null ||
(employer.address != null &&
(employer.address.building?.length <= 2) &&
employer.address.street?.length <= 2 &&
employer.address.county?.length <= 2 &&
employer.address.city?.length <= 2 &&
employer.address.postcode?.length <= 2);
Is there a better way to test to check validation if it contains value and ignore if not.

it is neither bad nor the best way
with current code you can do a bit clean Up to make it look nicer
you can assign a const to employer.address so no need to repeat it
const emp = employer.address
const isValid=
!emp||
(emp&&
(emp.building?) &&
emp.street?&&
emp.county?&&
emp.city? &&
emp.postcode?);
in the example above validation works if data is '' but if it has anything inside it ('s') validation would not be called
i think it should work same way
also there are some packages that provide you validation
redux form
https://redux-form.com/8.3.0/
yup
https://www.npmjs.com/package/yup

Related

How to set Password Validation in react

How to validate a password like atleast one Capital letter one special character one number and minlength 8 in react Js without use any react library
try
const valid = value.length >= 8 && /[A-Z]/.test(value) && /[^a-zA-Z]/.test(value) && /[0-9]/.test(value)
const passwordRegExp = new RegExp(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$!%*?&\.\+\*\{\]\{\[\-,;`<>':"=^#_|\/\\])(?=.*?[A-Za-z\d#$!%*+?&\.\+\*\{\]\{\[\-,;`<>':"=^#_|\/\\]).{8,}/)
const formValueFalse = 'aaabbb'
const formValueTrue = 'AaBb123$'
passwordRegExp.test(formValueFalse)
passwordRegExp.test(formValueTrue)

How to select for multiple conditions to return one object that matches those conditions

I am creating a test, and am trying to create a method that pulls a specific job posting ID when it matches the job posting title, the job type and the description, just in case that the case that there are more than one job posting with the same title.
I cannot get the select statement to pull the job posting ID out of the instance variable. Debugging shows that there is indeed the ID nested in the instance variable, but my conditions aren't being met because I am not doing it correctly.
#job_posting is the instance variable that contains the ID that I need, but I need my parameters in select to match so I can subsequently return the ID.
whenever I ONLY use posting title,such as:
target_postings = #job_postings.select{|posting|posting[:posting_title]}
it works and returns the ID I need, however I cannot do this:
def get_specific_posting_id_for_posting(posting_title, job_type, description)
expect(#job_postings.length > 0)
target_postings = #job_postings.select {|posting| posting[:posting_title] == posting_title; posting[:job_type] == job_type; posting[:description] == description}
expect(target_postings.length == 1)
target_posting = target_postings[0]
posting_id = target_posting[:posting_id]
posting_id
end
It looks like
target_postings = #job_postings.select {|posting| posting[:posting_title] == posting_title; posting[:job_type] == job_type; posting[:description] == description}
should probably be
target_postings = #job_postings.select do |posting|
posting[:posting_title] == posting_title
&& posting[:job_type] == job_type
&& posting[:description] == description
end
Your version has three separate checks, the first two of which do nothing, only the last statement in the block is actually being used to determine whether the item matches.
As an aside, since it looks like you only want the single first element that matches your conditions, you might want to consider using find instead of select. It works the same except it will stop iterating and return as soon as it finds the first matching item.

Why adding string make my condition not working

I am using reactJS and I am using some conditions to show my components. The code below is properly working. It show my success message without any problem. The FINALMESSAGE.showFinalMessage = true and FORMSTATUS["loadingForm"] = false
{FINALMESSAGE.showFinalMessage && !FORMSTATUS["loadingForm"] && <FinalMessageSave></FinalMessageSave>}
But when I add a condition with string like this:
{FINALMESSAGE.showFinalMessage && FINALMESSAGE.finalMessageStatus === "SUCCESS" && !FORMSTATUS["loadingForm"] && <FinalMessageSave ></FinalMessageSave>}
it doesnt work anymore even the FINALMESSAGE.showFinalMessage = "SUCCESS"
Here is the screenshot of my state

how to call a function in angularjs when model length is in multiple of 3

I have an input field, so I have to call a function for autosuggestion whenever user type 3, 6 ,9 characters. Means in mulitple of 3. I tried ng-change but it is only working for single value
ng-change="(myNgModel.length >= 3 ) && searchUser(myNgModel)"
You can do the length check inside your searchUser function. You can add an if condition so that your search logic would only run when your input's length is multiple of 3.
html
ng-change="searchUser(myNgModel)"
js
$scope.searchUser = function(myNgModel){
if(myNgModel.length % 3 == 0){
//search user logic
}
}

Using .Filter When the Filter Criteria are in Pre-existing String (TypeScript/Node.js)

I'm trying to process an array of JSON objects that have various common attributes, filtering each array entry on one or more of those attributes.
Normally, I'd just do it something like this:
let filteredResultsArray = originalArray.filter((obj) => {
return obj.attribute1 <= 3 && obj.attribute2 > 0 && obj.attribute3 === 10;
});
My problem is that the filter parameters (the part after "return" in the code above) are highly variable (and unpredictable) from run to run, so I can't hard-code them in the filter. I compute them on the fly and store the whole thing in a string in my code. For example, on one run it might be:
myAttributeString = "obj.attribute1 <= 3 && obj.attribute2 > 0 && obj.attribute3 === 10";
I've tried doing this:
let filteredResultsArray = originalArray.filter((obj) => {
return myAttributeString;
});
That's failing to filter anything. Apparently .filter() is not properly interpreting what I've stored in myAttributeString as filter criteria.
I have a sneaking suspicion that eval(myAttributeString) might be one way to pull this off, but unfortunately I'm working on a team where we've got tslint set to disallow the use of eval(), so that's not an option.
Anybody have an idea how I can get this to work?
When you "compute them on the fly", instead of creating a string, create a callback function that you can then pass to filter. For example, instead of
const myAttributeString = "obj.attribute1 <= 3 && obj.attribute2 > 0 && obj.attribute3 === 10";
do
const filterCallback = obj => obj.attribute1 <= 3 && obj.attribute2 > 0 && obj.attribute3 === 10
Then, later, when the appropriate time comes to .filter, simply pass that as the callback:
const filteredResultsArray = originalArray.filter(filterCallback);
If you can't pass functions around, another option would be to build an array of conditions, for example
[
{
prop: "attribute1",
constraint: "<=",
value: 3
},
{
prop: "attribute2",
constraint: ">",
value: 0
},
// ...
]
and then turn the object into the filter function needed.
****************************************UPDATE******************************
As I suspected, eval() did work, but since I can't use it in my delivered code, and thanks to CertainPerformance's suggestion (which put my thinking on the right track) as well as the Node.js documentation site (via a lucky Google search), I was able to find a workaround using the vm module:
import * as vm from "vm";
let filteredResultsArray = originalArray.filter(
vm.runInThisContext("(obj) => {
return " + myAttributeString + ";}"));
Case closed.

Resources