I want to validate the dynamically created textarea, In the below mentioned code i can able to validate only the first row but i can't validate for the second row.How to validate/get all the row values.Thanks in advance.To create Dynamic elements click add question image.\[code\]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> new document </title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { var i = 0; $("#AddQuestion").click(function () { $("#NoQuestions").remove(); ++i; var IdCount = i + ".)"; var newRowContent = "<tr id='SQRow"+i+"'"+" ><td>" + IdCount + "</td>" + "<td><textarea id='txtQuestions" + i + "'" + "style='height: 45px;width: 420px'></textarea> </td>" + "<td><select id='ddlDataType" + i + "'" + " style='margin-left: 47px'><option value=''>Select Data Type</option><option value='http://stackoverflow.com/questions/15491326/int'>Numeric</option><option value='http://stackoverflow.com/questions/15491326/Varchar'>Alpha Numeric</option></select> </td>" + "<td><div ><a href='http://stackoverflow.com/questions/15491326/#'><img src='http://stackoverflow.com/Images/1363247672_document-edit.png' width='26' height='27' alt='EditButton'/> </a><a href='http://stackoverflow.com/questions/15491326/#'><img src='http://stackoverflow.com/Images/1363247321_Remove.png' alt='DeleteButton'/></a> </div> </br><div style='display: none'><a href='http://stackoverflow.com/questions/15491326/#'><img src='http://stackoverflow.com/Images/Accept-iconSmall.png' width='26' height='27' alt='UpdateButton'/></a><a href='http://stackoverflow.com/questions/15491326/#'><img src='http://stackoverflow.com/Images/Button-Cancel-icon.png' width='26' height='27' alt='CancelButton' /></a></td>" + "</tr>"; $("#tblSecurityQuestions").append(newRowContent); }); $("#btnUpdateQuestions").click(function () { var txtAreaVal = $('textarea').val().length; var ddlDataType = $('#tblSecurityQuestions select').val().length; alert(txtAreaVal); alert(ddlDataType + "The ddl is " ); if (txtAreaVal <= 0) { alert('Please add Questions'); return; } else if (ddlDataType <= 0) { alert('Please select the data type'); return; } }); }); </script></head> <body> <form id="SQPageForm" name="SQPageForm" method="post" action=""> <div id="SecurityQuestions" style="height: auto;border-color: #f00;border: 1.5px;border-style: dotted"> <h3>Configure Security Questions</h3> <div id="AddNewSecurityQuestions" style=""> <p style="float: left;margin-top: 11px">Add Question </p> <img id="AddQuestion" src="http://stackoverflow.com/Images/document-add-icon.png" alt="Add Questions" width="35px" height="35px" style="cursor: pointer"/> </div> </br> Security Questions? </br> <table border="1" id="tblSecurityQuestions"> <tr> <th style="width: 25px"> ID </th> <th style="width: 424px"> Security Questions </th> <th style="width: 210px"> DataType </th> <th style="width :65px"> Actions </th> </tr> </table> </div> </br> </br> <input type="button" id="btnUpdateQuestions" value="http://stackoverflow.com/questions/15491326/Set Security Question" style="margin-left: 300px" /> </body></html>\[/code\]
To validate dynamic elements in the table
- Thread starter badbadman
- Start date