title: Problem getting methods in JavaScript from Java Spring Boot model objects
body: <p>I am trying to build an application using Spring Boot (Java 15, Spring Boot 2.4.2) and Thymeleaf (version 2.4.2), which would allow me to add some electronic parts to database and generally use the database in an accessible way.</p>
  <p>One type of those electronic parts are resistors, one of the attributes of which is resistance. To add the resistance, user should type in the value of number of the resistance and choose unit from a list (mΩ, Ω, kΩ or MΩ), which is shown below:</p>
  <pre><code>&lt;div class=&quot;custom-select&quot;&gt;
      &lt;label&gt;Resistance&lt;/label&gt; &lt;input type=&quot;number&quot; step=&quot;0.01&quot; th:field=&quot;*{resistor.resistance}&quot;&gt;
      &lt;select th:field=&quot;*{resistor.resistanceUnit}&quot; &gt;
          &lt;option value=&quot;mΩ&quot;&gt;mΩ&lt;/option&gt;
          &lt;option value=&quot;Ω&quot;&gt;Ω&lt;/option&gt;
          &lt;option value=&quot;kΩ&quot;&gt;kΩ&lt;/option&gt;
          &lt;option value=&quot;MΩ&quot;&gt;MΩ&lt;/option&gt;
      &lt;/select&gt;&lt;br/&gt;
  &lt;/div&gt;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/aHu7f.png" rel="nofollow noreferrer">Screenshot of typing in the resistance</a></p>
  <p>Then, after submitting the data to ResistorController class, the controller calls the method in Resistor class to convert the resistance to single <code>Double</code> value, which will be easier to sort by a database:</p>
  <p>Method in ResistorController:</p>
  <pre><code>@PostMapping(&quot;/add&quot;)
  public String addResistor(@ModelAttribute(&quot;resistor&quot;) Resistor resistor,
                            Model model) {
      resistor.convertValuesFromUnitized();
      model.addAttribute(&quot;resistor&quot;, resistor);//converting method mentioned above
      resistor.setId(resistorService.addResistor(resistor));
      return &quot;resistor/registrationDone&quot;;
  }
  </code></pre>
  <p>Part of Resistor class:</p>
  <pre><code>@Data
  public class Resistor extends BaseComponent {
      private String type;
      private double resistance;
      private int tolerance;
      private double power;
      ...
  
      private String resistanceUnit;//mΩ, Ω, kΩ, MΩ
  
      public String writeResistance() {//**This is a method mentioned in the text below**
          if (resistance &lt; 1) return resistance*1000+&quot;mΩ&quot;;
          else if (resistance &lt; 1000) return resistance+&quot;Ω&quot;;
          else if (resistance &gt;= 1000 &amp;&amp; resistance &lt; 1_000_000) return resistance/1000 + &quot;kΩ&quot;;
          else return resistance/1_000_000 + &quot;kΩ&quot;;
      }
      ...
  
      public void convertValuesFromUnitized() {//**This is the mentioned above converting method**
          switch (resistanceUnit) {
              case &quot;mΩ&quot; -&gt; resistance /= 1000;
              case &quot;kΩ&quot; -&gt; resistance *= 1000;
              case &quot;MΩ&quot; -&gt; resistance *= 1_000_000;
          }
          ...
      }
  
      public void convertValuesToUnitized() {
          if (resistance &lt; 1) {
              resistance *= 1000;
              resistanceUnit = &quot;mΩ&quot;;
          }
          else if (resistance &lt; 1000) resistanceUnit = &quot;Ω&quot;;
          else if (resistance &gt;= 1000 &amp;&amp; resistance &lt; 1_000_000) {
              resistance /= 1000;
              resistanceUnit = &quot;kΩ&quot;;
          }
          else {
              resistance /= 1_000_000;
              resistanceUnit = &quot;MΩ&quot;;
          }
          ...
      }
      ...
  }
  </code></pre>
  <p>In the database, I don't store units (mΩ, Ω, kΩ or MΩ) to avoid data redundancy. But in my html file, which shows list of all resistors, I want to show the resistance attribute with units, so I convert the number values again to &quot;unitized&quot; values using the second method (writeResistance()) in the Resistor class (↑↑attached above↑↑).</p>
  <p>Part of the html file with the list of all resistors:</p>
  <pre><code>&lt;td th:text=&quot;${resistor.writeResistance()}&quot;&gt;Resistance&lt;/td&gt;
  
  </code></pre>
  <p>All the code above works fine, but <strong>my problem is</strong> when I want to filter the resistors list using e.g. name of the resistor (resistor model). I'm trying to do it in JavaScript to have live changes - without submitting data to the controller and filtering it at the database level.</p>
  <p>Fragment of HTML file, which refers to the JavaScript filter function:</p>
  <pre><code>&lt;th&gt;&lt;input type=&quot;text&quot; id=&quot;nameFilter&quot; onkeyup=&quot;filterTable()&quot;/&gt;&lt;/th&gt;
  </code></pre>
  <p>The JavaScript filter function itself:</p>
  <pre><code>function filterTable() {
  
      let resistors = /*[[${resistors}]]*/ &quot;res&quot;;
      let resistorsFiltered = [];
      console.clear();
      for(let i=0; i&lt;resistors.length; ++i) {
          let name = resistors[i].name.toLowerCase();
          if(name.includes(document.getElementById(&quot;nameFilter&quot;).value)) {
              resistorsFiltered.push(resistors[i]);
          }
      }
  
      //building new table body:
      let table = document.getElementById(&quot;resistorsTableBody&quot;);
      table.innerHTML='';
      for(let i=0; i&lt;resistorsFiltered.length; ++i) {
          let resistor = resistorsFiltered[i];
          console.log(resistor);
  
          /**
           * I write about below commented out code in the text below
           */
          /*let Resistor = Java.type(pl.argo.ArgoInventory.resistor.Resistor);
          let resistor = new Resistor(resistorsFiltered[i]);*/
          
          let row = `
                      &lt;tr&gt;
                          &lt;td&gt;${resistorsFiltered[i].name}&lt;/td&gt;
                          &lt;td&gt;${resistorsFiltered[i].casing}&lt;/td&gt;
                          &lt;td&gt;${resistorsFiltered[i].manufacturer}&lt;/td&gt;
                          &lt;td&gt;${resistorsFiltered[i].typeOfAssembly}&lt;/td&gt;
  
                          &lt;td&gt;${resistorsFiltered[i].type}&lt;/td&gt;
                          &lt;td&gt;${resistorsFiltered[i].writeResistance()}&lt;/td&gt;
                          ...
                      &lt;/tr&gt;`;
          table.innerHTML += row;
      }
  }
  </code></pre>
  <p>The <code>resistorsFiltered[i].writeResistance()</code> method doesn't work - Intellij Idea doesn't find any methods assigned to the resistor variable, nor does Chrome browser.</p>
  <p>Intellij Idea message:
  <a href="https://i.stack.imgur.com/kQCbD.png" rel="nofollow noreferrer">enter image description here</a></p>
  <p>Chrome message:
  <a href="https://i.stack.imgur.com/a7lUC.png" rel="nofollow noreferrer">enter image description here</a></p>
  <p>I think this is because while transforming Java object to JavaScript object, the transformed object has only its fields, but not its methods.</p>
  <p><strong>My question is</strong>:
  How to &quot;brake the limit&quot; and use the Java object methods (the object is the Model Attribute) in this JavaScript script?</p>
  <p>I tried the metod below:</p>
  <pre><code>let Resistor = Java.type(pl.argo.ArgoInventory.resistor.Resistor);
  let resistor = new Resistor(resistorsFiltered[i]);
  </code></pre>
  <p>which I put earlier in the JavaScript filtrerTable() function in the code above. Unfortunately this method doesn't work - the Chrome browser tells that &quot;Java is not defined&quot;:
  <a href="https://i.stack.imgur.com/bxUCC.png" rel="nofollow noreferrer">enter image description here</a></p>
  <p>But this isn't my main problem. I want to refer to my Model Attribute (resistor object) and not just a method from &quot;some&quot; Java class.</p>
  <p>Is it somehow possible to use the Java Model Attribute object methods in JavaScript file? If yes, can someone propose a method to do it? Or, if not, can someone recommend me a method which would somehow fit my needs?</p>
  <p>In the addition, I will add, that I spent a few hours to find a sollution, bo unfortunately nothing suited my problem.</p>