function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Sukriti SharmaSukriti Sharma 

Input from LWC to JS

I am trying to make a LWC component using radio buttons where user select whether to make account or contact. Here I am having trouble reading the values inputted by user. I am unable to read name, phone or checkbox.

HTML Code:
<template>
    <lightning-card  title="CREATE NEW">
        
        <lightning-radio-group name="Create New"
            options={options} 
            value={value} 
            type="button" 
            onchange={handleChange} 
            class="slds-p-around_medium">
        </lightning-radio-group>
   
        <p class="slds-p-horizontal_small">
            <lightning-input class="inp" label={displayName} name="name" ></lightning-input>
            <lightning-input class="inp" type="tel" label="Contact Info" name="phone"></lightning-input>
        </p> 
        <template if:true={displayaccount}>
            <p class="slds-p-horizontal_small">
                <lightning-input class="inp" type="checkbox" label="Create Contact" name="CreateContact"></lightning-input>
            </p> 
        </template>
        <p slot="footer">     
            <lightning-button
                type="submit"
                name="submit"
                label={createaccount}
                onclick={handleClick}
                variant="brand">
            </lightning-button>
         </p> 
        
    </lightning-card>
</template>
JS Code:-
import { LightningElement, track } from 'lwc';
import insertNewAccOrCon from '@salesforce/apex/AddAccOrCon.insertNewAccOrCon';

import {ShowToastEvent} from 'lightning/platformShowToastEvent';

export default class AccountOrContact extends LightningElement {
    @track displayaccount = true;
    @track Name;
    @track Phone;
    @track displayName = "Account Name";
    @track CreateContact = false;
    @track createaccount="Create Account";
    @track value = 'account';
    get options() {
        return [
            { label: 'Account', value: 'account' },
            { label: 'Contact', value: 'contact' },
        ];
    }
   
    handleChange(event){
        const selectedOption = event.detail.value;
        if(selectedOption =='account'){
            this.displayaccount = true;
            this.createaccount = "Create Account";
            this.displayName = "Account Name";
        }
        else{
                this.displayaccount = false;
                this.createaccount = "Create Contact";
                this.displayName = "Contact Name";
    }
    }

    handleClick(event)
    {
        console.log(event.target.label);
        var inp=this.template.querySelectorAll("lightning-input");
        
        inp.forEach(function(element){
            if(element.name=="name")
                this.Name = element.value;
            else if(element.name=="phone")
                    this.Phone = element.value;
                // else if(element.name=="CreateContact")
                        // this.CreateContact = element.value;
        },this);
        console.log("Name :" + this.name);
        console.log("Phone: "+this.phone);
        console.log("CreateContact Boolean: "+this.CreateContact);
        console.log("DisplayAccount : "+this.displayaccount);
        insertNewAccOrCon({name:this.name, 
            phone:this.phone, 
            createcontact: this.CreateContact, 
            displayAccButton:this.displayaccount}).then(result=>{
                console.log(JSON.stringify(result));
                const toastEvent = new ShowToastEvent({
                    title:'Success!',
                    message:'Account created successfully',
                    variant:'success'
                });
                this.dispatchEvent(toastEvent);
            }).catch(error=>{
                this.error=error.message;
             console.log(this.error);
            })
    } 
    
}
The LWC and errors

 
AnkaiahAnkaiah (Salesforce Developers) 
Hi Sukriti,

Refer the below example, how to create account usig LWC.
https://niksdeveloper.com/salesforce/create-record-using-lightning-data-service-in-lwc/
Refer the below example how to pass the checkbox value and make the chnages. 
https://www.infallibletechie.com/2020/12/how-to-check-and-uncheck-check-box.html

If this information helps, Please mark it as best answer.

Thanks!!