When I click the register button and the input fields appear, the problem arises. When I fill in the fields and then the code jumps to the function
$ (document) .on ("click", "#register_in", function (), all $().val()
, it results in all values being undefined. It seems like there might be issues with the Dom tree. Can someone assist me with this?
$(document).on("click", "#register_in", function() {
var error = "";
if ($("username").val() == "" || $("password").val() == "" || $("name").val() == "" ||
$("lastname").val() == "" || $("jmbg").val() == "" || $("tel").val() == "" || $("email").val() == "") {
error += "All fields must be filled";
}
var n = $("jmbg").length;
if (n != 13) {
error += "\nJMBG must have 13 digits.";
}
$("#error1").text(error);
});
$("#register").click(function() {
var text = "<div class=\"Centar\"><div id= \"error1\" class=\"Red\" ></div >";
text += "Username: <br /> <input type=\"text\" id=\"username\" /> <br />";
text += "Password: <br /> <input type=\"password\" id=\"password\" /> <br />";
text += "Name:<br /> <input type=\"text\" id=\"name\" /> <br />";
text += "Last Name:<br /> <input type=\"text\" id=\"lastname\" /> <br />";
text += "Gender: <br /> <select id=\"pol\"><option value=\"M\">Male</option><option value=\"Z\">Female</option></select><br />";
text += "JMBG:<br /> <input type=\"text\" id=\"jmbg\" /> <br />";
text += "Contact Phone Number:<br /> <input type=\"text\" id=\"tel\" /> <br />";
text += "Email:<br /> <input type=\"text\" id=\"email\" /> <br />";
text += "<input type=\"submit\" id=\"register_in\" value=\"Register\" /> </div >";
$("#screen").html(text);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="Naslov">Taxi Service</div>
<div id="mainmenu" class="Menu">
<table>
<tr>
<td name="menu" id="login">Login</td>
<td>|</td>
<td name="menu" id="register">Register</td>
</tr>
</table>
</div>
<br /><br /><br />
<div id="screen">
<div class="Center">
<div id="error1" class="Red"></div>
Username:<br /> <input type="text" id="username" /><br /> Password:
<br /> <input type="password" id="password" /><br />
<input type="submit" id="log_in" value="Login" />
</div>
</div>