4
rated 0 times
[
7]
[
3]
/ answers: 1 / hits: 5171
/ 11 Years ago, tue, december 24, 2013, 12:00:00
I want to add row to the table on clicking Add button and delete row using Delete button using javascript/jquery. I have tried writing the following code:
<script src=/js/jquery-2.0.3.js></script>
<script>
/* Javascript for phone numbers*/
$(document).ready(function()
{
var counter = 2;
var count= 4;
$(#add_phone).click(function()
{
alert(whoah it worked);
if(counter>=count)
{
alert(Only + count + Phone number allowed.);
return false;
}
var htmlToAppend = '<tr id=pn'+ counter +'><th>
<select class=phone_no>
<option value=home>home</option>
<option value=Business>Business</option>
<option value=Business2>Business 2</option>
</select>
</th>
<td><input type=text/></td></tr>';
$(#phone_number).append ( htmlToAppend );
newTableRow.appendTo(#phone_number);
counter++;
});
$(#delete_phone).click(function()
{
if(counter==2)
{
alert(Cannot remove phone number);
return false;
}
counter--;
$(#pn + counter-1).remove();
});
});
But the alert message alert(whoah it worked);
doesn't get displayed i.e its not entering the function.
<div class=info_type>
Phone numbers <hr>
<table id=phone_number>
<tr id=pn1>
<th>
<select class=phone_no>
<option value=home>home</option>
<option value=Business>Business</option>
<option value=Business2>Business 2</option>
</select>
</th>
<td><input type=text/></td>
</tr>
</table>
<input type=button id=add_phone value=Add/>
<input type=button id=delete_phone value=Delete/>
</div>
I really want this solution. Can anybody help me??
PS: I am using Ruby on rails
More From » jquery