Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

68
Views
Update react select value on change

I am new to react and I am in a bit of a problem. To get the value of a particular react select dropdown I am using an onchange function. Here is the code for it.

const [selectedStatusCondition, setSelectedStatusCondition] =
    React.useState("");

const handleMaterialStatusChange = (value) => {
    setSelectedStatusCondition(value);
  };


                          <GridItem xs={2}>
                          <label>Material Status</label>
                          <ConditionDDL
                            id="materialstatusconditionDDL"
                            options={conditionDDLItems}
                            onChange={handleMaterialStatusChange}
                          />
                        </GridItem>

Howe ver I need the onChange function to set up another function after getting the value in the dropdown of the react select component which has values of E and A . On getting E run a set of functions and on Getting A run a set of functions.

Therefore I changed the code to put a wrapper function to do this like this:

                       <GridItem xs={2}>
                      <label>Material Status</label>
                      <ConditionDDL
                        id="materialstatusconditionDDL"
                        options={conditionDDLItems}
                        onChange={() => wrapperfunctionconfirm()}
                      />
                    </GridItem>

and wrapper function call the handle change function of the react select like this:

const wrapperfunctionconfirm = async (newToken = true) => {
    if (newToken) {
      const rsp = await getAuthorization();
    }
    var defaultOptions = {
      headers: {
        Authorization: "Bearer " + localStorage.getItem("tcm_accessToken"),
      },
    };
    setShrink(true);

    handleMaterialStatusChange(false);
    var status = selectedStatusCondition.value;
    

     console.log(
       "Status=" + status 
        
     );
  };

However I am getting status value as undefined. Clearly as set is an async method the value is yet not set. As I cannot use useEffect on change of a dropdown value to set the value immediately. What should I do How do I change the value of setting the handlechange function immideately?

Please help

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!