Getting undefined on passing form data to param in angular

Question

I am trying to pass values to formData from a form in my view, but when I am passing my parameters, it is showing undefined.

    // Initialize Params Object
    let myFormData = new FormData();

    // Begin assigning parameters     
    const username = myFormData.append('myUsername', this.registerForm.value.firstname);
    const email = myFormData.append('myEmail', this.registerForm.value.email);

    //post request
    return this.http.post('http://localhost:81/save.php/', myFormData).subscribe((res: Response) => {
        console.log(res);
    },
    (err) =>{
        this.indexedDbService
            .addUser(username,email)  //  undefined , undefined
            .then(this.backgroundSync)
            .catch(console.log);
            // this.backgroundSync();
    })
}

However, if I try passing a hard-coded JSON object, it is taking properly. How can I pass data from myFormData into the parameters of addUser properly?

Connor Low · Accepted Answer · 2021-07-07 16:09:23Z

1

FormData.append is a void function, so username and email will always be undefined in your code.

const example = new FormData();
const voidResult = example.append('foo', 'bar');
console.log(voidResult) // undefined

You'll need to assign those to your form values instead if you want to access them that way. Example:

const { firstname: username, email } = this.registerForm.value;
myFormData.append('myUsername', username);
myFormData.append('myEmail', email);

edited Jul 7, 2021 at 16:09

answered Jul 7, 2021 at 16:02

Connor Low

7,4443 gold badges39 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

NoobCoder Over a year ago

Thanks for the information. Didn't noticed it is void function.

Collectives™ on Stack Overflow

Getting undefined on passing form data to param in angular

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related