javascript - populate div based on row clicked -
i developing project using grails , html. have table , blank div in page. i'm trying display information in div based on row clicked in table. have tried numerous methods none of them seem working. can please help?
<div class="table-responsive" id="div1" style="width:330px; height:400px; background-color:#f5f5f5; float:right; "> </div> <table class="table table-striped" id="table"> <thead> <tr onclick="func1(this)"> <th>os</th> <th>mount</th> <th>size</th> </tr> </thead> <tbody> <tr onclick="func1(this)"> <td>windows1</td> <td>d:</td> <td>50 gb</td> </tr> <tr> <td>windows</td> <td>d:</td> <td>100 gb</td> </tr> </tbody> </table> <script type="text/javascript"> function func1(x) { $("tr").removeclass(); $("tr:gt(0)").click(function() { $('#div1').append("<div id='div1'>alien</div>") } } </script>
<script type="text/javascript"> $(document).ready(function(){ $("#table").on("click", "tr", function() { $('#div1').html(this.text()); }); });
or changes func1
function func1(x) { $(this).removeclass();// not sure why needed $('#div1').html("your data"); } </script>
Comments
Post a Comment