.val() returns empry strings when i try to fetch value of input in modal

Question

my .val() is not working here is my code

function validate() {
  var username = $('#username').val();
  console.log(username);
  var userEmail = $('#email').val();
  var password = $('#password').val();
  var cpassword = $('#cpassword').val();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="index.php" method="post" name="signupForm" id="signupForm">
  <div class="form-group">
    <label for="forUserName">User Name:</label>
    <input type="text" name="username" id="username" class="form-control" placeholder="Enter User Name" aria-describedby="helpId">
  </div>
  <div class="form-group">
    <label for="forEmail">Email:</label>
    <input type="email" name="signupemail" id='signupemail' class="form-control" placeholder="Enter Your Email" aria-describedby="helpId">
  </div>
  <div class="form-group">
    <label for="">password:</label>
    <input type="password" name="password" id="password" class="form-control" placeholder="Enter Password" aria-describedby="helpId">
  </div>
  <div class="form-group">
    <label for="forConfirmPassword">Confirm Password</label>
    <input type="password" name="cpassword" id="cpassword" class="form-control" placeholder="Enter Confirm Password" aria-describedby="helpId">
  </div>
  <button class="btn btn-primary" onclick="validate();">signup</button>

</form>

Is that code inside an event handler that runs after the user fills in the input? — Barmar, Jul 23 '21 at 16:18
When you run your `username=` code, what does this give you? `console.log($("[id=username]").length)`? If you have *two elements* with id=username, then `$("#username")` will *always* give you the first, which will probably not be the one on the dialog (or it might be on a different dialog) — freedomn-m, Jul 23 '21 at 16:19
If not, it's getting the value when the page is first loaded, and it won't have anything filled in yet. — Barmar, Jul 23 '21 at 16:20
the label attribute for and input id should match. Please share full code to confirm what fires the fetching of username. Is the form loaded after page is rendered. can you share console.log($("#usersname").length) — Alaksandar Jesus Gene, Jul 23 '21 at 16:20
@AlaksandarJesusGene right idea, but `console.log($("#username").length)` will always be 0 or 1. If there's two (eg one on the main page and one on the dialog) it will still be 1, not 2. — freedomn-m, Jul 23 '21 at 16:21
When you click your button, does the page just flash and reload? — j08691, Jul 23 '21 at 16:23
put type="button" in button tag (@j06891) and console.log($("#signupForm #username").length) (@freedomn-m) — Alaksandar Jesus Gene, Jul 23 '21 at 16:26
@j08691 / Barmar - how would that affect the validate() code? This would still run as the onclick= runs before the button submit/post — freedomn-m, Jul 23 '21 at 16:27
@freedomn-m the code will indeed run. And the page reloads, now showing anything unless you preserve the console between refreshes. — j08691, Jul 23 '21 at 16:29
@j08691 so you think "returns empty strings" means "console is empty" ... I guess... could do with more details from a very silent OP... — freedomn-m, Jul 23 '21 at 16:30
Actually console is return empty string but alert is showing the values i put on inputs i guess i may be missing something — Khan Abu Talha, Jul 25 '21 at 09:13

.val() returns empry strings when i try to fetch value of input in modal

0 Answers0