Display sharepoint list data to dynamic html table using jQuery -


i having scenario need list data shown in dynamic html table using jquery display in site content editor webpart. please me out regards in advance...

you can use sharepoint client context rest api data , display in table. add reference these 3 scripts:
1. /_layouts/15/sp.runtime.js
2./_layouts/15/sp.js
3. //ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js
, use below example:

<script type="text/javascript">      $(document).ready(function () {         fngetdata();     });     function fngetdata() {         context = new sp.clientcontext.get_current();         web = context.get_web();         var list = web.get_lists().getbytitle('users');         var myquery = new sp.camlquery();         myquery.set_viewxml("<view><query>" +                        "<where>" +                         "<isnotnull>" +     "<fieldref name='title' />" +     "</isnotnull>" +    "</where>" +                               "</query></view>");         myquery.set_datesinutc(false);         myitems = list.getitems(myquery);         context.load(myitems);         context.executequeryasync(function.createdelegate(this, function () { fngetdatasuccess(); }), function.createdelegate(this, this.fngetdatafailed));     }     function fngetdatasuccess() {         var txthtml = "";         var listenumeratoracc = this.myitems.getenumerator();         while (listenumeratoracc.movenext()) {             var currentitem = listenumeratoracc.get_current();             txthtml = txthtml + "<tr>";             txthtml = txthtml + "<td>";             if (currentitem.get_item('title') != null) {                 txthtml = txthtml + currentitem.get_item('title');             }             txthtml = txthtml + "</td>";               txthtml = txthtml + "<td>";             if (currentitem.get_item('owner') != null) {                 txthtml = txthtml + currentitem.get_item('owner').get_lookupvalue();             }             txthtml = txthtml + "</td>";             txthtml = txthtml + "</tr>";         }         $("#tblcustomlistdata").append(txthtml);      }     function fngetdatafailed(sender, args) {         alert("error message:\n" + "url: " + sender.get_url() + ". \n\error description:" + args.get_message());     } </script> <table id="tblcustomlistdata" border="1">     <thead>         <tr>             <th>title             </th>             <th>owner             </th>         </tr>     </thead> </table> 

Comments

Popular posts from this blog

javascript - JS causing window size to be bigger than necessary - Dropdown bug -

How to mention the localhost in android -

php - Calling a template part from a post -