jquery validation at runtime

Question

I wanna create a form in js file.

var form = '<form id="formForgetPass" action="#" method="POST" class="form-horizontal"><div class="form-group" style="margin-bottom: 0px !important;"><label for="textfield" class="control-label col-sm-2">E-posta</label><div class="col-sm-10"><input type="text" id="forgetEmail" name="email" class="form-control" /></div></div></form>';

And I'm using JquerValidation

Is it possible that I could control form inputs at run-time? I haven't figured out that.

It did not work properly as below

    $("#formForgetPass").validate({
    rules: {
        email: {
            required: true,
            email: true
        }
    }
});

Can you give some more Information? What have you tried? what is the goal? — winner_joiner, Dec 04 '14 at 10:42

score 0 · Answer 1 · answered Dec 04 '14 at 11:09

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  var form = '<form id="formForgetPass" action="#" method="POST" class="form-horizontal"><div class="form-group" style="margin-bottom: 0px !important;"><label for="textfield" class="control-label col-sm-2">E-posta</label><div class="col-sm-10"><input type="text" id="forgetEmail" name="email" class="form-control" /></div></div></form>';

$("#MainDiv").append(form);
alert($("#forgetEmail"));

});
</script>
</head>
<body>

<div id="MainDiv">
</div>

</body>
</html>

U can attach into div element and get the elements. This alert will return the object.

Thank you but I appended form into body but I could not validate form input. — Enes Pekkaya, Dec 04 '14 at 12:18

score 0 · Answer 2 · answered Dec 05 '14 at 10:10

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  var form = '<form id="formForgetPass" action="#" method="POST" class="form-horizontal"><div class="form-group" style="margin-bottom: 0px !important;"><label for="textfield" class="control-label col-sm-2">E-

posta</label><div class="col-sm-10"><input type="text" id="forgetEmail" name="email" class="form-control" /></div></div></form>';

$("#MainDiv").append(form);
});

function uivalidate() {
    if  ($("#forgetEmail").val() =='' ) {
        alert(" Value Should not be empty !");
        return false;
    }
    alert('The value - ' +  $("#forgetEmail").val());
}
</script>
</head>
<body>

<div id="MainDiv">
</div>
<br>
<button type="button" onClick="uivalidate();">Click Me!</button>
</body>
</html>

    **Hi we can validate like this... this is question u r asking... give me the clarity**

Run time Added controls not able to validate like that.. if u want to validate manually do the validate.... — Ravi kumar Raman, Dec 05 '14 at 10:11

jquery validation at runtime

2 Answers2