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
Post a Comment