Making .value value 0 instead of null in javascript











up vote
2
down vote

favorite
1












I have following code:



var drikke = 

parseInt(document.querySelector('input[name="drikke"]:checked').value);

if (typeof drikke == null) {



    drikke == 0;



}


How do I make the .value return 0 instead of null, which is ruining my program?






javascript







share|improve this question
























  • Could you please poste you html part of the code? Thank you.
    – Tornike Shavishvili
    Nov 13 at 9:19















up vote
2
down vote

favorite
1












I have following code:



var drikke = 

parseInt(document.querySelector('input[name="drikke"]:checked').value);

if (typeof drikke == null) {



    drikke == 0;



}


How do I make the .value return 0 instead of null, which is ruining my program?






javascript







share|improve this question
























  • Could you please poste you html part of the code? Thank you.
    – Tornike Shavishvili
    Nov 13 at 9:19













up vote
2
down vote

favorite
1









up vote
2
down vote

favorite
1






1





I have following code:



var drikke = 

parseInt(document.querySelector('input[name="drikke"]:checked').value);

if (typeof drikke == null) {



    drikke == 0;



}


How do I make the .value return 0 instead of null, which is ruining my program?






javascript







share|improve this question















I have following code:



var drikke = 

parseInt(document.querySelector('input[name="drikke"]:checked').value);

if (typeof drikke == null) {



    drikke == 0;



}


How do I make the .value return 0 instead of null, which is ruining my program?






javascript




javascript






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 13 at 10:33









Tornike Shavishvili

60311022




60311022










asked Nov 13 at 9:02









Ken

405




405












  • Could you please poste you html part of the code? Thank you.
    – Tornike Shavishvili
    Nov 13 at 9:19


















  • Could you please poste you html part of the code? Thank you.
    – Tornike Shavishvili
    Nov 13 at 9:19
















Could you please poste you html part of the code? Thank you.
– Tornike Shavishvili
Nov 13 at 9:19




Could you please poste you html part of the code? Thank you.
– Tornike Shavishvili
Nov 13 at 9:19












3 Answers
3






active

oldest

votes

















up vote
1
down vote



accepted










You have to first get the element with:



var drikke = document.querySelector('input[name="drikke"]');


Then check if it is checked get its numeric value with the use of Unary plus (+) and if not, make it 0 with the use of logical operators Logical AND (&&) and Logical OR (||).



drikke = drikke.checked && +drikke.value || 0;


Code example:






function regnut() {

  var drikke = document.querySelector('input[name="drikke"]');

  var mat = document.querySelector('input[name="mat"]');  

  var tilbehør = document.querySelector('input[name="tilbehør"]');  

  var dip = document.querySelector('input[name="dip"]'); 



  drikke = drikke.checked && +drikke.value || 0;

  mat = mat.checked && +mat.value || 0;

  tilbehør = tilbehør.checked && +tilbehør.value || 0;

  dip = dip.checked && +dip.value || 0;



  totalpris = drikke + mat + tilbehør + dip;

  document.querySelector('#output').value = drikke + mat + tilbehør + dip;

  console.log(drikke + mat + tilbehør + dip);

}

@import url('https://rsms.me/inter/inter-ui.css');

html {

  height: 100%;

}



body {

  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);

  font-family: 'Inter UI', sans-serif;

}



#drikke,

#mat,

#tilbehør,

#dip {

  float: left;

}



#resultat {

  display: inline;

}



input {

  margin: 4px;

}



#fresh {

  font-family: 'Inter UI', sans-serif;

  float: right;

}

<h1>

  Velkommen til Mc-bergbys</h1><br>

<h3>Velkommen til menyvelgeren</h3><br>

<h4>Sett sammen din meny under</h4><br>

<input type="text" id="input" placeholder="Navn??"><br>

<div id="drikke">

  <input type="radio" name="drikke" value="25" id="cola">Cola<br>

  <input type="radio" name="drikke" value="25" id="solo">Solo<br>

  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>

  <input type="radio" name="drikke" value="0" id="vann">Vann<br>

</div>

<div id="mat">

  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>

  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>

  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>

  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>

</div>

<div id="tilbehør">

  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>

  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>

  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>

  <br>

</div>

<div id="dip">

  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>

  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>

  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>

  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>

</div>

<div id="resultat">

  <br><br>

  <button id="sendinn" onclick="regnut()">Regn ut</button>

  <input type="text" placeholder="totalpris" readonly="true" id="output">

</div>








share|improve this answer






























    up vote
    0
    down vote













    You can use || logical or operator: 



    var drikke = parseInt(document.querySelector('input[name="drikke"]:checked').value) || 0;


    Updated fiddle






    share|improve this answer























    • This didn't work unfortunately
      – Ken
      Nov 13 at 9:06










    • can you explain didn't work bit more
      – Jai
      Nov 13 at 9:10










    • jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
      – Ken
      Nov 13 at 9:14










    • @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
      – Jai
      Nov 13 at 9:19


















    up vote
    0
    down vote













    You could write your code following way:



    var drikkeElm = document.querySelector('input[name="drikke"]:checked');
    
var drikke = -1;
    
if(drikkeElm === null){
    
    drikke = 0;
    
}else{
    
    drikke = parseInt(drikkeElm.value);
    
}
    

    
alert(drikke);





    share|improve this answer























      Your Answer






      StackExchange.ifUsing("editor", function () {
      StackExchange.using("externalEditor", function () {
      StackExchange.using("snippets", function () {
      StackExchange.snippets.init();
      });
      });
      }, "code-snippets");

      StackExchange.ready(function() {
      var channelOptions = {
      tags: "".split(" "),
      id: "1"
      };
      initTagRenderer("".split(" "), "".split(" "), channelOptions);

      StackExchange.using("externalEditor", function() {
      // Have to fire editor after snippets, if snippets enabled
      if (StackExchange.settings.snippets.snippetsEnabled) {
      StackExchange.using("snippets", function() {
      createEditor();
      });
      }
      else {
      createEditor();
      }
      });

      function createEditor() {
      StackExchange.prepareEditor({
      heartbeatType: 'answer',
      convertImagesToLinks: true,
      noModals: true,
      showLowRepImageUploadWarning: true,
      reputationToPostImages: 10,
      bindNavPrevention: true,
      postfix: "",
      imageUploader: {
      brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
      contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
      allowUrls: true
      },
      onDemand: true,
      discardSelector: ".discard-answer"
      ,immediatelyShowMarkdownHelp:true
      });


      }
      });














       

      draft saved


      draft discarded


















      StackExchange.ready(
      function () {
      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53277269%2fmaking-value-value-0-instead-of-null-in-javascript%23new-answer', 'question_page');
      }
      );

      Post as a guest















      Required, but never shown

























      3 Answers
      3






      active

      oldest

      votes








      3 Answers
      3






      active

      oldest

      votes









      active

      oldest

      votes






      active

      oldest

      votes








      up vote
      1
      down vote



      accepted










      You have to first get the element with:



      var drikke = document.querySelector('input[name="drikke"]');


      Then check if it is checked get its numeric value with the use of Unary plus (+) and if not, make it 0 with the use of logical operators Logical AND (&&) and Logical OR (||).



      drikke = drikke.checked && +drikke.value || 0;


      Code example:






      function regnut() {
      
  var drikke = document.querySelector('input[name="drikke"]');
      
  var mat = document.querySelector('input[name="mat"]');  
      
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
      
  var dip = document.querySelector('input[name="dip"]'); 
      

      
  drikke = drikke.checked && +drikke.value || 0;
      
  mat = mat.checked && +mat.value || 0;
      
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
      
  dip = dip.checked && +dip.value || 0;
      

      
  totalpris = drikke + mat + tilbehør + dip;
      
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
      
  console.log(drikke + mat + tilbehør + dip);
      
}

      @import url('https://rsms.me/inter/inter-ui.css');
      
html {
      
  height: 100%;
      
}
      

      
body {
      
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
      
  font-family: 'Inter UI', sans-serif;
      
}
      

      
#drikke,
      
#mat,
      
#tilbehør,
      
#dip {
      
  float: left;
      
}
      

      
#resultat {
      
  display: inline;
      
}
      

      
input {
      
  margin: 4px;
      
}
      

      
#fresh {
      
  font-family: 'Inter UI', sans-serif;
      
  float: right;
      
}

      <h1>
      
  Velkommen til Mc-bergbys</h1><br>
      
<h3>Velkommen til menyvelgeren</h3><br>
      
<h4>Sett sammen din meny under</h4><br>
      
<input type="text" id="input" placeholder="Navn??"><br>
      
<div id="drikke">
      
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
      
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
      
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
      
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
      
</div>
      
<div id="mat">
      
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
      
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
      
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
      
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
      
</div>
      
<div id="tilbehør">
      
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
      
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
      
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
      
  <br>
      
</div>
      
<div id="dip">
      
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
      
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
      
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
      
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
      
</div>
      
<div id="resultat">
      
  <br><br>
      
  <button id="sendinn" onclick="regnut()">Regn ut</button>
      
  <input type="text" placeholder="totalpris" readonly="true" id="output">
      
</div>








      share|improve this answer



























        up vote
        1
        down vote



        accepted










        You have to first get the element with:



        var drikke = document.querySelector('input[name="drikke"]');


        Then check if it is checked get its numeric value with the use of Unary plus (+) and if not, make it 0 with the use of logical operators Logical AND (&&) and Logical OR (||).



        drikke = drikke.checked && +drikke.value || 0;


        Code example:






        function regnut() {
        
  var drikke = document.querySelector('input[name="drikke"]');
        
  var mat = document.querySelector('input[name="mat"]');  
        
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
        
  var dip = document.querySelector('input[name="dip"]'); 
        

        
  drikke = drikke.checked && +drikke.value || 0;
        
  mat = mat.checked && +mat.value || 0;
        
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
        
  dip = dip.checked && +dip.value || 0;
        

        
  totalpris = drikke + mat + tilbehør + dip;
        
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
        
  console.log(drikke + mat + tilbehør + dip);
        
}

        @import url('https://rsms.me/inter/inter-ui.css');
        
html {
        
  height: 100%;
        
}
        

        
body {
        
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
        
  font-family: 'Inter UI', sans-serif;
        
}
        

        
#drikke,
        
#mat,
        
#tilbehør,
        
#dip {
        
  float: left;
        
}
        

        
#resultat {
        
  display: inline;
        
}
        

        
input {
        
  margin: 4px;
        
}
        

        
#fresh {
        
  font-family: 'Inter UI', sans-serif;
        
  float: right;
        
}

        <h1>
        
  Velkommen til Mc-bergbys</h1><br>
        
<h3>Velkommen til menyvelgeren</h3><br>
        
<h4>Sett sammen din meny under</h4><br>
        
<input type="text" id="input" placeholder="Navn??"><br>
        
<div id="drikke">
        
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
        
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
        
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
        
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
        
</div>
        
<div id="mat">
        
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
        
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
        
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
        
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
        
</div>
        
<div id="tilbehør">
        
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
        
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
        
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
        
  <br>
        
</div>
        
<div id="dip">
        
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
        
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
        
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
        
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
        
</div>
        
<div id="resultat">
        
  <br><br>
        
  <button id="sendinn" onclick="regnut()">Regn ut</button>
        
  <input type="text" placeholder="totalpris" readonly="true" id="output">
        
</div>








        share|improve this answer

























          up vote
          1
          down vote



          accepted







          up vote
          1
          down vote



          accepted






          You have to first get the element with:



          var drikke = document.querySelector('input[name="drikke"]');


          Then check if it is checked get its numeric value with the use of Unary plus (+) and if not, make it 0 with the use of logical operators Logical AND (&&) and Logical OR (||).



          drikke = drikke.checked && +drikke.value || 0;


          Code example:






          function regnut() {
          
  var drikke = document.querySelector('input[name="drikke"]');
          
  var mat = document.querySelector('input[name="mat"]');  
          
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
          
  var dip = document.querySelector('input[name="dip"]'); 
          

          
  drikke = drikke.checked && +drikke.value || 0;
          
  mat = mat.checked && +mat.value || 0;
          
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
          
  dip = dip.checked && +dip.value || 0;
          

          
  totalpris = drikke + mat + tilbehør + dip;
          
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
          
  console.log(drikke + mat + tilbehør + dip);
          
}

          @import url('https://rsms.me/inter/inter-ui.css');
          
html {
          
  height: 100%;
          
}
          

          
body {
          
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
          
  font-family: 'Inter UI', sans-serif;
          
}
          

          
#drikke,
          
#mat,
          
#tilbehør,
          
#dip {
          
  float: left;
          
}
          

          
#resultat {
          
  display: inline;
          
}
          

          
input {
          
  margin: 4px;
          
}
          

          
#fresh {
          
  font-family: 'Inter UI', sans-serif;
          
  float: right;
          
}

          <h1>
          
  Velkommen til Mc-bergbys</h1><br>
          
<h3>Velkommen til menyvelgeren</h3><br>
          
<h4>Sett sammen din meny under</h4><br>
          
<input type="text" id="input" placeholder="Navn??"><br>
          
<div id="drikke">
          
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
          
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
          
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
          
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
          
</div>
          
<div id="mat">
          
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
          
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
          
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
          
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
          
</div>
          
<div id="tilbehør">
          
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
          
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
          
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
          
  <br>
          
</div>
          
<div id="dip">
          
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
          
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
          
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
          
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
          
</div>
          
<div id="resultat">
          
  <br><br>
          
  <button id="sendinn" onclick="regnut()">Regn ut</button>
          
  <input type="text" placeholder="totalpris" readonly="true" id="output">
          
</div>








          share|improve this answer














          You have to first get the element with:



          var drikke = document.querySelector('input[name="drikke"]');


          Then check if it is checked get its numeric value with the use of Unary plus (+) and if not, make it 0 with the use of logical operators Logical AND (&&) and Logical OR (||).



          drikke = drikke.checked && +drikke.value || 0;


          Code example:






          function regnut() {
          
  var drikke = document.querySelector('input[name="drikke"]');
          
  var mat = document.querySelector('input[name="mat"]');  
          
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
          
  var dip = document.querySelector('input[name="dip"]'); 
          

          
  drikke = drikke.checked && +drikke.value || 0;
          
  mat = mat.checked && +mat.value || 0;
          
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
          
  dip = dip.checked && +dip.value || 0;
          

          
  totalpris = drikke + mat + tilbehør + dip;
          
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
          
  console.log(drikke + mat + tilbehør + dip);
          
}

          @import url('https://rsms.me/inter/inter-ui.css');
          
html {
          
  height: 100%;
          
}
          

          
body {
          
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
          
  font-family: 'Inter UI', sans-serif;
          
}
          

          
#drikke,
          
#mat,
          
#tilbehør,
          
#dip {
          
  float: left;
          
}
          

          
#resultat {
          
  display: inline;
          
}
          

          
input {
          
  margin: 4px;
          
}
          

          
#fresh {
          
  font-family: 'Inter UI', sans-serif;
          
  float: right;
          
}

          <h1>
          
  Velkommen til Mc-bergbys</h1><br>
          
<h3>Velkommen til menyvelgeren</h3><br>
          
<h4>Sett sammen din meny under</h4><br>
          
<input type="text" id="input" placeholder="Navn??"><br>
          
<div id="drikke">
          
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
          
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
          
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
          
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
          
</div>
          
<div id="mat">
          
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
          
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
          
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
          
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
          
</div>
          
<div id="tilbehør">
          
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
          
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
          
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
          
  <br>
          
</div>
          
<div id="dip">
          
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
          
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
          
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
          
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
          
</div>
          
<div id="resultat">
          
  <br><br>
          
  <button id="sendinn" onclick="regnut()">Regn ut</button>
          
  <input type="text" placeholder="totalpris" readonly="true" id="output">
          
</div>








          function regnut() {
          
  var drikke = document.querySelector('input[name="drikke"]');
          
  var mat = document.querySelector('input[name="mat"]');  
          
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
          
  var dip = document.querySelector('input[name="dip"]'); 
          

          
  drikke = drikke.checked && +drikke.value || 0;
          
  mat = mat.checked && +mat.value || 0;
          
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
          
  dip = dip.checked && +dip.value || 0;
          

          
  totalpris = drikke + mat + tilbehør + dip;
          
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
          
  console.log(drikke + mat + tilbehør + dip);
          
}

          @import url('https://rsms.me/inter/inter-ui.css');
          
html {
          
  height: 100%;
          
}
          

          
body {
          
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
          
  font-family: 'Inter UI', sans-serif;
          
}
          

          
#drikke,
          
#mat,
          
#tilbehør,
          
#dip {
          
  float: left;
          
}
          

          
#resultat {
          
  display: inline;
          
}
          

          
input {
          
  margin: 4px;
          
}
          

          
#fresh {
          
  font-family: 'Inter UI', sans-serif;
          
  float: right;
          
}

          <h1>
          
  Velkommen til Mc-bergbys</h1><br>
          
<h3>Velkommen til menyvelgeren</h3><br>
          
<h4>Sett sammen din meny under</h4><br>
          
<input type="text" id="input" placeholder="Navn??"><br>
          
<div id="drikke">
          
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
          
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
          
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
          
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
          
</div>
          
<div id="mat">
          
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
          
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
          
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
          
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
          
</div>
          
<div id="tilbehør">
          
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
          
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
          
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
          
  <br>
          
</div>
          
<div id="dip">
          
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
          
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
          
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
          
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
          
</div>
          
<div id="resultat">
          
  <br><br>
          
  <button id="sendinn" onclick="regnut()">Regn ut</button>
          
  <input type="text" placeholder="totalpris" readonly="true" id="output">
          
</div>





          function regnut() {
          
  var drikke = document.querySelector('input[name="drikke"]');
          
  var mat = document.querySelector('input[name="mat"]');  
          
  var tilbehør = document.querySelector('input[name="tilbehør"]');  
          
  var dip = document.querySelector('input[name="dip"]'); 
          

          
  drikke = drikke.checked && +drikke.value || 0;
          
  mat = mat.checked && +mat.value || 0;
          
  tilbehør = tilbehør.checked && +tilbehør.value || 0;
          
  dip = dip.checked && +dip.value || 0;
          

          
  totalpris = drikke + mat + tilbehør + dip;
          
  document.querySelector('#output').value = drikke + mat + tilbehør + dip;
          
  console.log(drikke + mat + tilbehør + dip);
          
}

          @import url('https://rsms.me/inter/inter-ui.css');
          
html {
          
  height: 100%;
          
}
          

          
body {
          
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
          
  font-family: 'Inter UI', sans-serif;
          
}
          

          
#drikke,
          
#mat,
          
#tilbehør,
          
#dip {
          
  float: left;
          
}
          

          
#resultat {
          
  display: inline;
          
}
          

          
input {
          
  margin: 4px;
          
}
          

          
#fresh {
          
  font-family: 'Inter UI', sans-serif;
          
  float: right;
          
}

          <h1>
          
  Velkommen til Mc-bergbys</h1><br>
          
<h3>Velkommen til menyvelgeren</h3><br>
          
<h4>Sett sammen din meny under</h4><br>
          
<input type="text" id="input" placeholder="Navn??"><br>
          
<div id="drikke">
          
  <input type="radio" name="drikke" value="25" id="cola">Cola<br>
          
  <input type="radio" name="drikke" value="25" id="solo">Solo<br>
          
  <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
          
  <input type="radio" name="drikke" value="0" id="vann">Vann<br>
          
</div>
          
<div id="mat">
          
  <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
          
  <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
          
  <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
          
  <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
          
</div>
          
<div id="tilbehør">
          
  <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
          
  <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
          
  <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
          
  <br>
          
</div>
          
<div id="dip">
          
  <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
          
  <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
          
  <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
          
  <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
          
</div>
          
<div id="resultat">
          
  <br><br>
          
  <button id="sendinn" onclick="regnut()">Regn ut</button>
          
  <input type="text" placeholder="totalpris" readonly="true" id="output">
          
</div>






          share|improve this answer














          share|improve this answer



          share|improve this answer








          edited Nov 13 at 9:34

























          answered Nov 13 at 9:06









          Yosvel Quintero

          10.7k42229




          10.7k42229
























              up vote
              0
              down vote













              You can use || logical or operator: 



              var drikke = parseInt(document.querySelector('input[name="drikke"]:checked').value) || 0;


              Updated fiddle






              share|improve this answer























              • This didn't work unfortunately
                – Ken
                Nov 13 at 9:06










              • can you explain didn't work bit more
                – Jai
                Nov 13 at 9:10










              • jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
                – Ken
                Nov 13 at 9:14










              • @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
                – Jai
                Nov 13 at 9:19















              up vote
              0
              down vote













              You can use || logical or operator: 



              var drikke = parseInt(document.querySelector('input[name="drikke"]:checked').value) || 0;


              Updated fiddle






              share|improve this answer























              • This didn't work unfortunately
                – Ken
                Nov 13 at 9:06










              • can you explain didn't work bit more
                – Jai
                Nov 13 at 9:10










              • jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
                – Ken
                Nov 13 at 9:14










              • @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
                – Jai
                Nov 13 at 9:19













              up vote
              0
              down vote










              up vote
              0
              down vote









              You can use || logical or operator: 



              var drikke = parseInt(document.querySelector('input[name="drikke"]:checked').value) || 0;


              Updated fiddle






              share|improve this answer














              You can use || logical or operator: 



              var drikke = parseInt(document.querySelector('input[name="drikke"]:checked').value) || 0;


              Updated fiddle







              share|improve this answer














              share|improve this answer



              share|improve this answer








              edited Nov 13 at 9:18

























              answered Nov 13 at 9:04









              Jai

              63.4k95479




              63.4k95479












              • This didn't work unfortunately
                – Ken
                Nov 13 at 9:06










              • can you explain didn't work bit more
                – Jai
                Nov 13 at 9:10










              • jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
                – Ken
                Nov 13 at 9:14










              • @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
                – Jai
                Nov 13 at 9:19


















              • This didn't work unfortunately
                – Ken
                Nov 13 at 9:06










              • can you explain didn't work bit more
                – Jai
                Nov 13 at 9:10










              • jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
                – Ken
                Nov 13 at 9:14










              • @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
                – Jai
                Nov 13 at 9:19
















              This didn't work unfortunately
              – Ken
              Nov 13 at 9:06




              This didn't work unfortunately
              – Ken
              Nov 13 at 9:06












              can you explain didn't work bit more
              – Jai
              Nov 13 at 9:10




              can you explain didn't work bit more
              – Jai
              Nov 13 at 9:10












              jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
              – Ken
              Nov 13 at 9:14




              jsfiddle.net/8tr2zumk/#&togetherjs=QxK7eEKKkV this is my code if you want to look at the entirety of it.
              – Ken
              Nov 13 at 9:14












              @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
              – Jai
              Nov 13 at 9:19




              @Ken just updated the fiddle. You can take a look at it. I think the issue was it wasn't able to find the function in the page.
              – Jai
              Nov 13 at 9:19










              up vote
              0
              down vote













              You could write your code following way:



              var drikkeElm = document.querySelector('input[name="drikke"]:checked');
              
var drikke = -1;
              
if(drikkeElm === null){
              
    drikke = 0;
              
}else{
              
    drikke = parseInt(drikkeElm.value);
              
}
              

              
alert(drikke);





              share|improve this answer



























                up vote
                0
                down vote













                You could write your code following way:



                var drikkeElm = document.querySelector('input[name="drikke"]:checked');
                
var drikke = -1;
                
if(drikkeElm === null){
                
    drikke = 0;
                
}else{
                
    drikke = parseInt(drikkeElm.value);
                
}
                

                
alert(drikke);





                share|improve this answer

























                  up vote
                  0
                  down vote










                  up vote
                  0
                  down vote









                  You could write your code following way:



                  var drikkeElm = document.querySelector('input[name="drikke"]:checked');
                  
var drikke = -1;
                  
if(drikkeElm === null){
                  
    drikke = 0;
                  
}else{
                  
    drikke = parseInt(drikkeElm.value);
                  
}
                  

                  
alert(drikke);





                  share|improve this answer














                  You could write your code following way:



                  var drikkeElm = document.querySelector('input[name="drikke"]:checked');
                  
var drikke = -1;
                  
if(drikkeElm === null){
                  
    drikke = 0;
                  
}else{
                  
    drikke = parseInt(drikkeElm.value);
                  
}
                  

                  
alert(drikke);






                  share|improve this answer














                  share|improve this answer



                  share|improve this answer








                  edited Nov 13 at 9:50

























                  answered Nov 13 at 9:29









                  Tornike Shavishvili

                  60311022




                  60311022






























                       

                      draft saved


                      draft discarded



















































                       


                      draft saved


                      draft discarded














                      StackExchange.ready(
                      function () {
                      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53277269%2fmaking-value-value-0-instead-of-null-in-javascript%23new-answer', 'question_page');
                      }
                      );

                      Post as a guest















                      Required, but never shown





















































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown

































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown







                      -

                      Popular posts from this blog

                      How to send String Array data to Server using php in android

                      Image
                      0 I have a String array which contains value string array = {6,37,38,837,7,...} and I have also used some string values. I want to send that all string values and string array to my database which is located at server side. When I am click on submit button the data will stored in table. On the PHP side I want to read this array as it is,other thing i will do at background means PHP side. See my below code then you will get it what I am says. Here is my code: public class Hotels extends Activity { // Declare Variables JSONArray jsonarray = null; private static final String TAG_ID = "id"; public static final String TAG_NAME = "name"; public static final String TAG_LOCATION = "location"; public static final String TAG_DESC = "description"; String f_date, l_date;...
                      Read more

                      Title Spacing in Bjornstrup Chapter, Removing Chapter Number From Contents

                      Image
                      up vote 5 down vote favorite 2 I would like to make it so that the vertical space below the title of each chapter is the same when using the Bjornstrup package (i.e. so that the descenders do not affect the spacing - as shown by the red arrow in the picture below). I think I'm fairly happy with the spacing around "A chapter", so I'd really like titles without descenders (e.g. "Contents") to have the same vertical spacing as "A chapter" below the title. I would also like to remove the large "0" in the contents title. Any help appreciated, as always. documentclass[11pt,a4paper]{book} % Packages[![enter image description here][1]][1] usepackage[left=3.5cm, right=3.5cm, top=4.3cm, bottom=4.25cm]{geometry} usepackage[utf8]{inputenc} usepackage{libertine} usepackage[libertine]{newtx...
                      Read more

                      Is anime1.com a legal site for watching anime?

                      Image
                      up vote 4 down vote favorite 1 Other anime streaming sites are blocking my IP because I'm Iranian while anime1.com isn't. I wanted to know if it's legal to watch/stream anime from this site. Thanks. anime-production share | improve this question edited Nov 27 at 22:38 W. Are 1,599 2 23 asked Nov 27 at 20:36 mhnajafi 23 3 add a comment ...
                      Read more