Using jQuery to pull value from form field

Question

I'm trying to do something pretty simple, but it just doesn't seem to be working. I have a small form that asks people for a bill amount, and then if the amount is less than 50, submitting the form will trigger an alert. When this wasn't working, I started trying to find out why. This is my current code, and there isn't a value that shows up in the console. I get a blank line, showing where it's trying to pull a value, but no value is being pulled. No errors show either.

<form id="systemForm">

<fieldset><label>Average bill amount</label><input type="text" name="billAmount" id="billAmount"/></fieldset>

<p class="test" id="test">SUBMIT</p>

<script>

$( document ).ready(function() {
    var theForm = $('#systemForm');
    var billAmountNum = $( "#billAmount" ).val();



    $( "#test" ).click(function() {
      console.log(billAmountNum);
    });
});

</script>

What is systemSize and numPanels?? Don't see either of those in your HTML — Ryan Wilson
– Ryan Wilson, Commented Jun 5, 2018 at 20:32
@RyanWilson Other form fields that aren't important as of yet - I deleted them out of the form when I posted it since they weren't part of the problem, but forgot to remove the variables from the script — Molly Campbell
– Molly Campbell, Commented Jun 5, 2018 at 20:33
you are setting billAmountNum = $('#billAmount').val() on the document ready, then adding an event listener to test.click, and log billAmountNum which is equal to an empty string on page load. — Ryan Wilson
– Ryan Wilson, Commented Jun 5, 2018 at 20:35

Taplar · Accepted Answer · 2018-06-05 20:37:39Z

2

You are setting billAmountNum = $('#billAmount').val() on the document ready, then adding an event listener to test.click, and log billAmountNum which is equal to an empty string on page load.

Change this:

$( "#test" ).click(function() {
      console.log(billAmountNum);
    });

To this:

$( "#test" ).click(function() {
      console.log($( "#billAmount" ).val());
    });

edited Jun 5, 2018 at 20:37

Taplar

25k4 gold badges24 silver badges36 bronze badges

answered Jun 5, 2018 at 20:36

Ryan Wilson

10.9k3 gold badges23 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Ryan Wilson Over a year ago

@Taplar Not at all, I sometimes just assume people will correlate my comment with the answer...thanks again. Have a good day :)

Molly Campbell Over a year ago

@RyanWilson Thanks... I'm a little bit rusty on this, I appreciate the help.

Ryan Wilson Over a year ago

@mollycampbell anytime. Glad to help.

Collectives™ on Stack Overflow

Using jQuery to pull value from form field

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related