Link to home
Start Free TrialLog in
Avatar of sbornstein2
sbornstein2

asked on

JQuery populate a scrollable datatable?

Hello all,

I have the following JQuery that right now populates a UL list an it's quite ugly.   I want to use a datatable somehow at a fixed width and height W500px, H160px and then somehow just append the rows on the populate and then add a top row on a save command I already have.  This is my current code snippet where I loop through my results I have a note and under it I have who added that note with the <br/>:
success: function (json_results) {
                        var text;
                        $.each(json_results.d, function (index, noteItem) {
                            text = '<html><p>' + noteItem.Note + '</p>';
                            text = text + "<br/>";
                            text = text + '<p>Added ' + noteItem.EnteredDateDisplay + ' by ' + noteItem.FirstName + ' ' + noteItem.LastName + '</p></html>';
                            var $li = $("<li class='ui-state-default'/>").html(text);
                            $("#sortable").append($li);

                        });

Open in new window

   <div id="scrollable_content" style="display:block; overflow-y:scroll; border: 1px solid green; resize:none; width:500px; height:160px;">
                                <ul id="sortable" style="list-style-type:none; padding:0;margin:0;" ></ul>
                            </div>

Open in new window


Looking for a way to have in place of the Ul a datatable of some sort scrollable I will get rid of the color and then append to the scrollable datatable.  The above populates but then I have on the save button I just append the new item without having to recall the DB call.
success: function (msg) {
                        var c = eval(msg.d);
                        $('#subject_note').val('');
                        $('#subject_note').focus();

                        var text = '<html><p>' + c.Note + '</p>';
                        text = text + "<br/>";
                        text = text + '<p>Added ' + c.EnteredDateDisplay + ' by ' + c.FirstName + ' ' + c.LastName + '</p></html>';
                        var $li = $("<li class='ui-state-default'/>").html(text);
                        $("#sortable").prepend($li);
                        $("#sortable").sortable('refresh');

Open in new window


Anyone have any samples on how to use a datatable instead?  Thanks all
ASKER CERTIFIED SOLUTION
Avatar of deast05
deast05
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of sbornstein2
sbornstein2

ASKER

thanks