Question 312337 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How can I push an input type: 'radio' to firebase database

I looped through the radio with it ‘name’ to get the selected ‘term’ for it value then use a button to add data to database with other values.

const inputTerm = document.getElementsByName("terms")

propertyBtn.addEventListener("click", function () {

    for (let  i = 0; i < inputTerm.length; i++){
        if(inputTerm[i].checked){
            let pickedTerm = inputTerm[i].value
        }
    }
    
    
    let propertyData = {
        terms: pickedTerm,
        title: inputTitle.value,
        location: inputLocation.value,
      };

  push(addedPropertyInDB, propertyData);
  
  
});

With this code pickedTerm is not defined, I want all propertyData to get pushed as one to firebase database

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    After few trials and errors.

    I created a separate function for looping and it worked as I wanted.

    
    const inputTerm = document.getElementsByName("terms");
    
    function getSelectedValue(inputs) {
        for (let i = 0; i < inputs.length; i++) {
          if (inputs[i].checked) {
            return inputs[i].value;
          }
        }
        return null;
      }
    
    propertyBtn.addEventListener("click", function () {
    
        const pickedTerm = getSelectedValue(inputTerm);
    
      
    
    
      let propertyData = {
        terms: pickedTerm,
        title: inputTitle.value,
        location: inputLocation.value,
      };
    
      push(addedPropertyInDB, propertyData);
      console.log(propertyData);
    
    });

  2. 0

    you need to declare pickedTerm outside the loop.

    const inputTerm = document.getElementsByName("terms");
let pickedTerm; // Declare pickedTerm outside the loop

propertyBtn.addEventListener("click", function () {
    for (let i = 0; i < inputTerm.length; i++){
        if (inputTerm[i].checked) {
            pickedTerm = inputTerm[i].value; 
            break;
        }
    }

        let propertyData = {
            terms: pickedTerm,
            title: inputTitle.value,
            location: inputLocation.value,
        };
        push(addedPropertyInDB, propertyData);

});
    Login or Signup to reply.
  3. 0

    Its because the scope of the variable pickedTerm is only valid inside the if statement.

    Scope in JavaScript

    Scope is the current context of execution in which values and expressions are "visible" or can be referenced. If a variable or expression is not in the current scope, it will not be available for use.

    JavaScript has the following kinds of scopes:

    • Global scope: The default scope for all code running in script mode.
    • Module scope: The scope for code running in module mode.
    • Function scope: The scope created with a function.

    Read more on Scope

    For your current script, you would need to declare the pickedTerm variable where on the scope where it is being accessed.

    And that’s it. Happy Coding!!

    const inputTerm = document.getElementsByName("terms")

propertyBtn.addEventListener("click", function () {
    let pickedTerm = null;
    for (let  i = 0; i < inputTerm.length; i++){
        if(inputTerm[i].checked){
            pickedTerm = inputTerm[i].value
        }
    }
    
    
    let propertyData = {
        terms: pickedTerm,
        title: inputTitle.value,
        location: inputLocation.value,
      };

  push(addedPropertyInDB, propertyData);
  
  
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search