Search code examples
htmljquery

Stuck showing my information taken from the input field


Hello all i am stuck and was wondering if anyone could help me im new to developing with js i have this code i managed to throw together and suprissinally it works.. but the issue i am having is the data i have collected i need to display it in the span element.

HTML code - Takes the number from the input field Span element to display the math calculated..

<input type="text" value="" id="level" />
<span id='cash'></span>

My Code - the code gets users input and calculates it like ((2500 * input) * multiplier) the code itself works as it does in the alert but i am struggling to get the data and display it in the span box

$(document).ready(function() {
  $("#level").keyup(function() {
    // get the users data
    let dInput = $(this).val();
    // Calculate cost based on input and hardcoded math
    let cost = ((2500 * dInput) * 1.00);
    // Show the cost in the span id?
    $('#cash').load(cost);
    alert(cost);
  });
});

Have got the code to work where it gets the users inputted data and calculates it by the sum.

All the code works but i can't seem to get it to show the collected data in a span or that..


Solution

  • In jQuery the .load() method is used to get data from the server. Instead you want to use .text() to update the text content. Here is the code I would use. Please let me know if it works.

    $(document).ready(function() {
      $("#level").keyup(function() {
          // get the user's data
          let dInput = $(this).val();
          // Calculate cost based on input and hardcoded math
          let cost = ((2500 * dInput) * 1.00);
          // Show the cost in the span id
          $('#cash').text(cost);
      });
    });