Jquery problem in accessing information inside a var

Issue

This is what i have done so far i created a dropdown menu inside a table and based on selection from this menu i want to do some calculations and insert those calculation inside a table and here the problem begins i don’t know how to access what someone picked inside this menu also i want to take the information from the table and use it for calculations

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
                 $(function(){
            var vat  = [{
            display: "ZW",
            value: "0"        
        }, {
            display: "NP",
            value: "0"
        }, {
            display: "0%",
            value: "0"
        }, {
            display: "3%",
            value: "0.03"
        }, {
            display: "8%",
            value: "0.08"
         }, {
            display: "23%",
            value: "0.023"
        }];
        
        var options = ['<option value="">Wybierz VAT</option>'];
        
        for(var i = 0; i < vat.length; i++){
           options.push('<option value="');
           options.push(vat[i].value);
           options.push('">');
           options.push(vat[i].display);
           options.push('</option>');       
        }
        
        $('.obliczvat').html(options.join('')).change(function(){
            var val = $(this).val();
          if(val[i].value ==0) 
          {
              var ilosc = parseInt($('.ilosc',this).text(),10);
            var brutto =parseInt($('.brutto',this).text(),10);
            
            
            var ob = (brutto*ilosc);
            $('.netto',this).text(ob);  
          }
        else
        {
            
        }
        });     
    });
              </script>

this is the html portion

<table class="tabela">
            <tr>
                <th>Lp.</th>
                <th>Opis</th>
                <th>Ilość</th>
                <th>VAT</th>
                <th>Kwota Brutto</th>
                <th>Wartość Netto</th>
                <th>Wartość Brutto</th>
            </tr>
            <tr>
                <td>1</td>
                <td>Palety</td>
                <td class="ilosc">2</td>
                <td> <form name="Vat">
                <select class="obliczvat"></select></form>
                </td>
                <td class="brutto">2000</td>
                <td class="netto"></td>
                <td></td>
            </tr>
            <tr>
                <td>2</td>
                <td>Modernizjacja sprzętu komputerowego</td>
               <td class="ilosc">10</td>
                <td> <form name="Vat">
                <select class="obliczvat"></select></form>
                </td>
                <td class="brutto">120</td>
                <td class="netto"></td>
                <td></td>
            </tr>
            <tr>
                <td>3</td>
                <td>modernizacja biura</td>
                <td class="ilosc">4</td>
                <td> <form name="Vat">
                <select class="obliczvat"></select></form>
                </td>
                <td class="brutto">5000</td>
                <td class="netto"></td>
                <td></td>
            </tr>
            <tr>
                <td>4</td>
                <td>Paliwo</td>
                <td class="ilosc">7</td>
                <td> <form name="Vat">
                <select class="obliczvat"></select></form>
                </td>
                <td class="brutto">350</td>
                <td class="netto"></td>
                <td></td>
            </tr>
            <tr>
                <td>5</td>
                <td>Zakup nowego Samochódu do floty</td>
                <td class="ilosc">1</td>
                <td> <form name="Vat">
                <select class="obliczvat"></select></form>
                </td>
                <td class="brutto">23753</td>
                <td class="netto"></td>
                <td></td>
            </tr>
        </table>

Solution

The expression $(this).val() results in a numeric value.

      $(function () {
        var vat = [
          {
            display: "ZW",
            value: "0",
          },
          {
            display: "NP",
            value: "0",
          },
          {
            display: "0%",
            value: "0",
          },
          {
            display: "3%",
            value: "0.03",
          },
          {
            display: "8%",
            value: "0.08",
          },
          {
            display: "23%",
            value: "0.023",
          },
        ];

        var options = ['<option value="">Wybierz VAT</option>'];

        for (var i = 0; i < vat.length; i++) {
          options.push('<option value="');
          options.push(vat[i].value);
          options.push('">');
          options.push(vat[i].display);
          options.push("</option>");
        }

        $(".obliczvat")
          .html(options.join(""))
          .change(function () {
            var val = $(this).val();
            if (val == 0) {
              var ilosc = parseInt($(this).closest("td").prev().text(), 10);
              var brutto = parseInt($(this).closest("td").next().text(), 10);

              var ob = brutto * ilosc;
              $(this).closest("td").next().next().text(ob);
            } else {
            }
          });
      });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="tabela">
      <tr>
        <th>Lp.</th>
        <th>Opis</th>
        <th>Ilość</th>
        <th>VAT</th>
        <th>Kwota Brutto</th>
        <th>Wartość Netto</th>
        <th>Wartość Brutto</th>
      </tr>
      <tr>
        <td>1</td>
        <td>Palety</td>
        <td class="ilosc">2</td>
        <td>
          <form name="Vat">
            <select class="obliczvat"></select>
          </form>
        </td>
        <td class="brutto">2000</td>
        <td class="netto"></td>
        <td></td>
      </tr>
      <tr>
        <td>2</td>
        <td>Modernizjacja sprzętu komputerowego</td>
        <td class="ilosc">10</td>
        <td>
          <form name="Vat">
            <select class="obliczvat"></select>
          </form>
        </td>
        <td class="brutto">120</td>
        <td class="netto"></td>
        <td></td>
      </tr>
      <tr>
        <td>3</td>
        <td>modernizacja biura</td>
        <td class="ilosc">4</td>
        <td>
          <form name="Vat">
            <select class="obliczvat"></select>
          </form>
        </td>
        <td class="brutto">5000</td>
        <td class="netto"></td>
        <td></td>
      </tr>
      <tr>
        <td>4</td>
        <td>Paliwo</td>
        <td class="ilosc">7</td>
        <td>
          <form name="Vat">
            <select class="obliczvat"></select>
          </form>
        </td>
        <td class="brutto">350</td>
        <td class="netto"></td>
        <td></td>
      </tr>
      <tr>
        <td>5</td>
        <td>Zakup nowego Samochódu do floty</td>
        <td class="ilosc">1</td>
        <td>
          <form name="Vat">
            <select class="obliczvat"></select>
          </form>
        </td>
        <td class="brutto">23753</td>
        <td class="netto"></td>
        <td></td>
      </tr>
    </table>

Answered By – user2495207

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0