giving link inside a table row using javascript

时间:2017-12-18 04:57:11

标签: javascript html

I am passing values to a table from my dropdown values using JavaScript.

I need to give a link on the last row of my table. I tried the following code, but it's not working. Can anyone suggest any other idea please?

$("#btnadd").click(function(){
    var lov_name  = $("#lov_name option:selected").text();
    var lov_value = $("#lov_value").val();
    var markup    = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href="#"> Edit</a></td></tr>";

    $("table tbody").append(markup);
    $(".alert-success").css('display','block');
});

1 个答案:

答案 0 :(得分:0)

Change var markup = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href="#"> Edit</a></td></tr>";

to

var markup = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href='#'> Edit</a></td></tr>";

note the quotes in a href='#'

$("#btnadd").on('click',function(){
    var lov_name  = $("#lov_name option:selected").text();
    var lov_value = $("#lov_value").val();
    var markup    = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href='#'> Edit</a></td></tr>";

    $("table tbody").append(markup);
    $(".alert-success").css('display','block');   
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lov_name">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3" id="lov_value">Three</option>
</select>
<button id="btnadd">Add row</button>
<span class="alert-success" style="display: none;"></span>
<table>
 <tbody>
 </tbody>
</table>