Is this right way to convert data attributes values to number in javascipt? Need to get valid numeric value or 0

asifakhtar · May 30, 2023

I am using the following code to convert data attribute values to Numbers. I want to get a valid numeric value or 0 in all cases. e.g if the data attribute value is blank("") then I need 0 in that case.

I am using the following code to convert data attribute values to Numbers. I want to get a valid numeric value or 0 in all cases. e.g if the data attribute value is blank("") then I need 0 in that case. The intention is to avoid getting NaN because I am using the result in calculations.

JavaScript:

Number($("td[id^='tdCumulativeUnderOverSpendPrevious']").data("val") || 0);

Padonak · May 30, 2023

It seems that your right-hand parenthesis of Number is put at the wrong position:

JavaScript:

Number( $("td[id^='tdCumulativeUnderOverSpendPrevious']").data("val") ) || 0;

You can inspect what is returned by this logic, for exapmle, this way:

HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title></title>
    <style>
  
    </style>
  </head>
  <body> 
      <table>
    <tbody>
    <tr>
    <td id="tdCumulativeUnderOverSpendPrevious_1" data-val="Infinity">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_2" data-val="">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_3" data-val=" ">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_4" data-val="qwe123">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_5" data-val="123">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_6" data-val="false">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_7" data-val="null">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_8" data-val="0,2">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_9" data-val="0.2">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_10" data-val="0.2 * 5">12345</td>
    </tr>
    </tbody>
    </table>
    <script>
    const arr = [...document.querySelectorAll('[id^=tdCumulativeUnderOverSpendPrevious]')].map( n => Number(n.dataset['val']) || 5 );
    console.log( arr ); // [Infinity, 5, 5, 5, 123, 5, 5, 5, 0.2, 5]
    </script>
  </body>
</html>

asifakhtar · May 30, 2023

Padonak said:

It seems that your right-hand parenthesis of Number is put at the wrong position:

JavaScript:

Number( $("td[id^='tdCumulativeUnderOverSpendPrevious']").data("val") ) || 0;

You can inspect what is returned by this logic, for exapmle, this way:

HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title></title>
    <style>
 
    </style>
  </head>
  <body>
      <table>
    <tbody>
    <tr>
    <td id="tdCumulativeUnderOverSpendPrevious_1" data-val="Infinity">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_2" data-val="">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_3" data-val=" ">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_4" data-val="qwe123">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_5" data-val="123">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_6" data-val="false">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_7" data-val="null">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_8" data-val="0,2">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_9" data-val="0.2">12345</td>
    <td id="tdCumulativeUnderOverSpendPrevious_10" data-val="0.2 * 5">12345</td>
    </tr>
    </tbody>
    </table>
    <script>
    const arr = [...document.querySelectorAll('[id^=tdCumulativeUnderOverSpendPrevious]')].map( n => Number(n.dataset['val']) || 5 );
    console.log( arr ); // [Infinity, 5, 5, 5, 123, 5, 5, 5, 0.2, 5]
    </script>
  </body>
</html>

Thanks a lot. Appreciated.

Is there a way to pass this state from component to the fetch?	1	Apr 24, 2023
How do i get numberOfItemsHired to only accept 1-500 if it is outside those values error message should be displayed	9	Jul 5, 2024
I Need Help with making a function that draws in a canvas using location data.	1	Dec 17, 2021
How to try a range of hex values in C# code ?	0	Nov 19, 2022
Outputting signal values to terminal Within Character Array	0	Dec 10, 2021
GET NEIL DEGRASSES TYSON, I ripped a hole with this one...	0	Nov 10, 2022
How to use Densenet121 in monai	0	Feb 16, 2024
Elegant ways to convert '' or 'number' to a number	21	Feb 14, 2012

Is this right way to convert data attributes values to number in javascipt? Need to get valid numeric value or 0

asifakhtar

Padonak

asifakhtar

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads