web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

🚀 Season of Sharing Community Challenge Launch!
Ask A Community Pro
Introducing our New Video Series: Community Spotlight
News and Announcements icon
Community site session details

Community site session details

Session Id :
Dynamics 365 Community / Forums / Customer experience | Sales, Customer Insights,... / Create table and displ...
Customer experience | Sales, Customer Insights,...
Unanswered

Create table and display records in mscrm html dashboard

(0) ShareShare
ReportReport
Posted on by sandeepc 5,514

Hi, I have written code as below will this work or any changes reuqired in code to dispaly records

<html><head>
    <meta charset="utf-8">
    <!--<meta http-equiv="X-UA-Compatible" content="IE=edge">-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Example of Bootstrap 3 Responsive Tables</title>
    <!--<link rel="stylesheet" href="">maxcdn.bootstrapcdn.com/.../bootstrap.min.css">
    <script type="text/javascript src="">ajax.googleapis.com/.../script>
    <script src="">maxcdn.bootstrapcdn.com/.../script>-->
    <script src="../WebResources/new_Jquery1.9.1" type="text/javascript"></script>
    <script src="../WebResources/new_XRMServiceToolKit.js" type="text/javascript"></script>
    <link href="../WebResources/new_bootstrap.min" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="">cdn.datatables.net/.../datatables.min.css">
    <script type="text/javascript" src="">cdn.datatables.net/.../script>

    <style>
        .btn_pos {
            padding: 10px;
        }

        .title h1 {
            color: #2490eb;
            font-size: 20px;
            /*border-bottom: 1px solid #2490eb;*/
            padding-bottom: 10px;
            margin-bottom: 25px;
        }

        .title .table-bordered th {
            background-color: #f8f8f8;
            color: #333333;
            font-size: 14px;
            font-weight: normal;
            padding: 5px;
        }

        .title .table-bordered td {
            padding: 5px;
            font-size: 14px;
        }

        .table-bordered {
            height: 26px;
            width: 100%;
        }

            .table-bordered .sem {
                width: 25%;
                /* width: 557px;*/
            }

            .table-bordered .mod {
                width: 12%;
                /* width: 557px;*/
            }

            .table-bordered .modl {
                width: 12%;
                /* width: 557px;*/
            }

            .table-bordered .secndmrks {
                width: 12%;
                /* width: 557px;*/
            }


            .table-bordered .input {
                width: 100%;
            }

        .container {
            padding: 0px;
        }

            .container h1 {
                background-color: #002050;
                color: ;
                font-size: 14pt;
                padding: 10px 10px;
                margin: 0px;
            }
.semester label {
            font-weight: bold;
            font-size: 14px;
            margin-top: 10px;
        }
        .module label {
            font-weight: bold;
            font-size: 14px;
            margin-top: 10px;
        }
        .module leader label {
            font-weight: bold;
            font-size: 14px;
            margin-top: 10px;
        }
        .second marker label {
            font-weight: bold;
            font-size: 14px;
            margin-top: 10px;
        }
    </style>

    <meta>
  <!-- Dynamically get table data from Student Placement History -->
 <script type="text/javascript">
        window.onload = function calling() {
            UploadData();
        }
      function UploadData() {

debugger;

var semester = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"><entity name="new_coursestreamdivisionsession"><attribute name="new_name"/><attribute name="createdon"/><attribute name="new_coursestreamdivisionsessionid"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_sessionstatus" value="1" operator="eq"/></filter></entity></fetch>';
var semester = getFetch("new_coursestreamdivisionsession", semester);
var _html = "";
$.each(semester.value, function (index, res) {
_html += "<option value='" + res.new_coursestreamdivisionsessionid + "'>" + res.new_name + "</option>"; });



var module = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"   <entity name="new_subject_course_stream_mapping"><attribute name="new_subject_course_stream_mappingid"/><attribute name="new_name"/><attribute name="createdon"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_session" operator="not-null"/></filter></entity></fetch>';
var module = getFetch("    new_subject_course_stream_mapping", module);
var _html = "";
$.each(module.value ,function (index, res) {
_html += "<option value='" + res.new_subject_course_stream_mappingid + "'>" + res.new_name + "</option>"; });

var module leader = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"  <entity name="new_lessonplan"><attribute name="new_lessonplanid"/><attribute name="new_name"/><attribute name="createdon"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_coursesession" operator="not-null"/><condition attribute="new_subjectsetup" operator="not-null"/><condition attribute="new_subjecttype1" operator="eq" value="{72A07C07-9BE8-E811-A96C-000D3AF05828}" uitype="new_utility" uiname="Lecture"/><condition attribute="new_isfacultyload" operator="eq" value="0"/></filter></entity></fetch>';
var module leader = getFetch("new_lessonplan", module leader);
var _html = "";
$.each(moduleleader.value ,function (index, res) {
_html += "<option value='" + res.new_lessonplanid + "'>" + res.new_name + "</option>"; });

var second marker '<fetch version="1.0" output-format="xml-platform"mapping="logical" distinct="false"  <entity name="bam_employee"><attribute name="bam_employeeid"/><attribute name="bam_name"/><attribute name="createdon"/><order descending="false" attribute="bam_name"/><filter type="and"><condition attribute="sis_isacademic" value="1" operator="eq"/></filter></entity></fetch>';
var second marker = getFetch("bam_employee", second marker );
var _html = "";
$.each(employee.value ,function (index, res) {
_html += "<option value='" + res.new_bam_employeid + "'>" + res.bam_name + "</option>"; });



$('#SemesterComponent').append(_html);
$('#SubjectsetupComponent').append(_html);
$('#LessonPlanComponent').append(_html);
$('#EmployeeComponent').append(_html);


}

$(document).ready(function () {
$("#SemesterComponent", "SubjectsetupComponent","LessonPlanComponent","EmployeeComponent" ).change(function () {
$("#semestertable", "SubjectsetupComponent","LessonPlanComponent","EmployeeComponent").empty();

debugger;

$(this).parents("tr").remove();

var grid_id = $('#StudentSubjectComponent :selected').val();
var grid_id = $('#SubjectsetupComponent :selected').val();
var grid_id = $('#LessonPlanComponent :selected').val();
var grid_id = $('#EmployeeComponent :selected').val();
var uploadData;

if (grid_id != null) {

//var fetch = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false" ><entity name="new_studentsubjectmarks" ><attribute name="new_coursestreamdivisionsessionid" /><attribute name="new_subjecttype1" /><attribute name="new_secondmarker" /><attribute name="new_marker1" /><attribute name="new_marker2" /><attribute name="new_marker3" /><attribute name="new_examtype" /><attribute name="new_name" /><attribute name="new_maximummarks1" /><attribute name="new_marksobtained1" /><attribute name="new_enrollmentno" /><order attribute="new_name" descending="false" /><filter type="and" ><condition attribute="new_isotherassesment" operator="eq" value="0" /><condition attribute="new_examination" operator="eq" uiname="Audits and Regulatory Compliance" uitype="new_examination" value="' + grid_id + '" /><condition attribute="new_appeared" operator="eq" value="1" /></filter><link-entity name="new_studentsubjectattendance" from="new_studentsubjectattendanceid" to="new_studentsubject" link-type="inner" alias="ae" ><link-entity name="new_studentcoursestreamdivisionsession" from="new_studentcoursestreamdivisionsessionid" to="new_studentsession" link-type="inner" alias="af" ><attribute name="new_examrollno" /><attribute name="new_student" /><attribute name="new_studentname" /><attribute name="new_rollnumber" /><link-entity name="new_student" from="new_studentid" to="new_student" link-type="inner" alias="st" ><attribute name="new_studentname" /><attribute name="new_firstname" /><attribute name="new_contactname" /><attribute name="new_contact" /><attribute name="sis_registrationid" /></link-entity></link-entity></link-entity></entity></fetch>';
var fetch = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"><entity name="new_coursestreamdivisionsession"><attribute name="new_name"/><attribute name="createdon"/><attribute name="new_coursestreamdivisionsessionid"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_sessionstatus" value="1" operator="eq"/></filter></entity></fetch>
uploadData = getFetch("new_coursestreamdivisionsession", fetch);


var fetch = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"   <entity name="new_subject_course_stream_mapping"><attribute name="new_subject_course_stream_mappingid"/><attribute name="new_name"/><attribute name="createdon"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_session" operator="not-null"/></filter></entity></fetch>';
uploadData = getFetch("new_coursestreamdivisionsession", fetch);
var fetch = '<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false"  <entity name="new_lessonplan"><attribute name="new_lessonplanid"/><attribute name="new_name"/><attribute name="createdon"/><order descending="false" attribute="new_name"/><filter type="and"><condition attribute="new_coursesession" operator="not-null"/><condition attribute="new_subjectsetup" operator="not-null"/><condition attribute="new_subjecttype1" operator="eq" value="{72A07C07-9BE8-E811-A96C-000D3AF05828}" uitype="new_utility" uiname="Lecture"/><condition attribute="new_isfacultyload" operator="eq" value="0"/></filter></entity></fetch>';
uploadData = getFetch("new_coursestreamdivisionsession", fetch);
var fetch = '<fetch version="1.0" output-format="xml-platform"mapping="logical" distinct="false"  <entity name="bam_employee"><attribute name="bam_employeeid"/><attribute name="bam_name"/><attribute name="createdon"/><order descending="false" attribute="bam_name"/><filter type="and"><condition attribute="sis_isacademic" value="1" operator="eq"/></filter></entity></fetch>';
uploadData = getFetch("new_coursestreamdivisionsession", fetch);
}

var len = uploadData.value.length;

var head

var html = "";            
var tbody = "";
////////////////////
tbody = "<thead><tr><th valign='middle' style='width:25%'>Semester.</th><th style='text-center'>Module</th><th class='text-center' style='width:10%'>Module Leader</th><th class='text-center' style='width:10%'>Second Marker</th></tr></thead><tbody>";
///////////////
if (len > 0) {

for (i = 0; i < len; i++) {

var semester, module, module 1eader, second marker;

//var enrollNo = uploadMarks.value[i]["af_x002e_new_examrollno"];

var semester = uploadData.value[i]["new_sessionstatus@OData.Community.Display.V1.FormattedValue"];
var module = uploadData.value[i]["_new_session_value@OData.Community.Display.V1.FormattedValue"];
var moduleleader = uploadData.value[i]["_new_coursesession_value@OData.Community.Display.V1.FormattedValue"],["new_isfacultyload@OData.Community.Display.V1.FormattedValue"],["_new_subjectsetup_value@OData.Community.Display.V1.FormattedValue"],["_new_subjecttype1_value@OData.Community.Display.V1.FormattedValue"];
var secondmarker = uploadData.value[i]["sis_isacademic@OData.Community.Display.V1.FormattedValue"];




/////////////
html += "<tr><td class='nme' id='" + uploadData.value[i].new_coursestreamdivisionsessionid + "'>" + semester + "</td>
<td class='nme' id='" + uploadData.value[i].new_subject_course_stream_mappingid + "'>"  + module + "</td>
<td class='nme' id='" + uploadData.value[i].new_lessonplanid + "'>"  + module leader + "</td>
<td class='nme' id='" + uploadData.value[i].bam_employeeid + "'>" + second marker + "</td>
//////////////////

}

}

var examTable = tbody + html + "</tbody>";

var table = $("#semestertable").append(semesterTable);
var table = $("#Moduletable").append(subjectsetupTable);
var table = $("#ModuleLeadertable").append(lessonplanTable);
var table = $("#SecondMarkertable").append(secondmarkerTable);

if ($.fn.DataTable.isDataTable('#semestertable')) {
$('#semestertable').DataTable().destroy();
}
if ($.fn.DataTable.isDataTable('#subjectsetuptable')) {
$('#Moduletable').DataTable().destroy();
}
if ($.fn.DataTable.isDataTable('#lessonplantable')) {
$('#ModuleLeadertable').DataTable().destroy();
}
if ($.fn.DataTable.isDataTable('#secondmarkertable')) {
$('#SecondMarkertable').DataTable().destroy();

}


table.DataTable();

});

});

///////////////////////////
  function creatNewFeepaymnetTable() {
            debugger;
            var Semester = 0;
            var Module = 0;
            var ModuleLeader= 0;
            var SecondMarker = 0;
  var Tablellength = $($("#subjectExam_table","#subjectsetup_table","#Lessonplan_table","#Secondmarker_table").find('tr')).length;
            for (var i = 1; i < Tablellength - 1; i++) {
               var Semester =("#subjectExam_table").find('tr'))[1]).find('td')[4].innerHTML)
                var NewModule =("#subjectsetup_table").find('tr'))[1]).find('td')[4].innerHTML)
                 var NewModuleLeader =("#Lessonplan_table").find('tr'))[1]).find('td')[4].innerHTML)
                  var NewSecondMarker =("#Secondmarker_table").find('tr'))[1]).find('td')[4].innerHTML)

            $('#modaltable').html(_html);

            $("#myModal").modal("show");
            }

////////////////

        function getFetch(entity, fetchXML) {
            var req = new XMLHttpRequest();
            req.open("GET", window.parent.Xrm.Page.context.getClientUrl() + "/api/data/v8.2/" + entity + "s?fetchXml=" + fetchXML + "", false);
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
            req.send();
            if (req.status === 200) {
                return results = JSON.parse(req.response);
            } else {
                window.parent.Xrm.Utility.alertDialog(req.statusText);
            }
        }
        function checkObtainedMarks(obtainedMarks) {
            var inputMarks = obtainedMarks.value;
            var totalMarks = obtainedMarks.getAttribute("data");

            if (parseInt(inputMarks) > parseInt(totalMarks)) {
                alert("Obtained marks should not be greater than total marks. ");
                obtainedMarks.value = null;
            }
        }
        function idBasedOdata(EntityName, id) {
            var guid = id.replace('{', '').replace('}', '');
            var url = window.parent.Xrm.Page.context.getClientUrl() + "/api/data/v8.0/" + EntityName + "s(" + guid + ")?$filter= statecode eq 0";
            var req = new XMLHttpRequest();
            req.open("GET", url, false);
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
            req.setRequestHeader("Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"");
            req.send();
            if (req.status == 200) {
                var results = JSON.parse(req.response);
                return results;
            }
            else
                return null;
        }
        function fieldBasedOdata(EntityName, fieldName, id) {
            var guid = id.replace('{', '').replace('}', '');
            var url = window.parent.Xrm.Page.context.getClientUrl() + "/api/data/v8.0/" + EntityName + "s?$filter=_" + fieldName + "_value eq " + guid + " and statecode eq 0";
            var req = new XMLHttpRequest();
            req.open("GET", url, false);
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
            req.setRequestHeader("Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"");
            req.send();
            if (req.status == 200) {
                var results = JSON.parse(req.response);
                return results;
            }
            else
                return null;
        }
        function twofieldBasedOdataidvalue(EntityName, field1, field2, id1, value) {
            var guid1 = id1.replace('{', '').replace('}', '');
            var url = window.parent.Xrm.Page.context.getClientUrl() + "/api/data/v8.0/" + EntityName + "s?$filter=_" + field1 + "_value eq " + guid1 + " and " + field2 + " eq " + value + " and statecode eq 0";
            var req = new XMLHttpRequest();
            req.open("GET", url, false);
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
            req.setRequestHeader("Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"");
            req.send();
            if (req.status == 200) {
                var results = JSON.parse(req.response);
                return results;
            }
            else
                return null;
        }
    </script>
    
    <style>
        #WebResource_Componentdb6474d {
            height: 700px !important;
        }

        .headblue {
            padding: 5px 10px;
            float: left;
            width: 100%;
            background-color: #428bca;
            color: ;
            font-size: 12px;
            padding-top: 10px;
            padding-bottom: 10px;
            font-family: 'Segoe UI';
        }

            .headblue h3 {
                padding: 0px;
                margin: 0px;
                font-size: 14px;
            }

        .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
            border: 1px solid #efefef !important;
            text-align: left;
        }

        .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th {
            border: 1px solid #dddddd !important;
            text-align: left;
        }

        Iframe {
            width: 100%;
            display: block;
        }

        .table-bordered {
            border: 1px solid #6589e6 !important;
        }

        input.form-control.input-sm {
            border: 1px solid #eee;
            background: #fff;
        }

        .btn-sm, .btn-group-sm > .btn {
            padding: 7px 8px !important;
        }

        .table > tbody > tr > td, .table > tfoot > tr > td {
            padding: 4px !important;
            line-height: 29px !important;
            font-size: 12px !important;
        }

        .table > thead > tr > th {
            padding: 4px !important;
            line-height: 29px !important;
            font-size: 12px !important;
        }

        th {
            background-color: #fffefe;
            color: #666666;
            padding: 4px;
            font-weight: bold;
            font-size: 12px;
        }

        td {
            background-color: white;
            color: #636363;
        }

        .btn-primary {
            color: #fff;
            background-color: #ca4242;
            border-color: #ca4242;
        }

        .scroll-list {
            padding: 0px;
            height: 250px;
            overflow-y: scroll;
        }

        .headblue .btn-primary {
            color: #333333;
            background-color: #eee;
            border-color: #333333;
            font-size: 12px;
        }

        .headblue .btn {
            padding: 2px 5px;
        }

        select label {
            top: -14px !important;
            font-size: 14px !important;
            color: #2196f3 !important;
        }
    </style>
    <style>
        input[type="radio"], input[type="checkbox"] {
            line-height: normal;
            position: relative;
            margin: 6px 0px 0px -20px;
            padding: 0px;
        }
    </style>
    <meta charset="utf-8">
    <title>Second Markings</title>
    <style type="text/css">
        P {
            margin: 0;
        }
    </style>
<meta><meta><meta><meta>

    <meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta></head><body dir="LTR" onfocusout="parent.setEmailRange();" lang="en-US" style="overflow-wrap: break-word;"><div class="container title" style="width: 100%; margin: 0px; font-family: undefined;">
        <div class="modal-dialog modal-lg" style="margin:15px 0px;">
        </div>
                <!-- Modal content-->
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">×</button>
                        <h4 class="modal-title">Second Markings</h4>
                    </div>
                    <div class="modal-body">
                        <div id="modaltable">
                                   </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Approve</button>
                        <button id="newInstalment" class="btn btn-primary" onclick="validation()">Submit</button>
                    </div>
                </div>
            </div>
        </div>
        <!--<div class="clearfix"></div>
        <div class="container"  style="display:none" id="divtable">-->
        <!--</div>-->
  
<meta></body></html>

I have the same question (0)
  • sandeepc Profile Picture
    sandeepc 5,514 on at

    after adding this code  <script>
    <script>
    array = [ Semester, Module, Module Leader, Second Marker ];
    for (index = 0; index < array.length; index++) {
        console.log(array[index]);
    }
    </script>

    it s shwoing like this

    pastedimage1571115172749v1.png

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

News and Announcements

🚀 Season of Sharing Community Challenge Launch!
Ask A Community Pro
Introducing our New Video Series: Community Spotlight

Quick Links

Season of Sharing Community Challenge Launch!

Jump in, show your community spirit, and win prizes!

Women in Power Builds Momentum

Expanding mentorship, skilling, and AI innovation

Congratulations to the April Top 10 Community Leaders

These are the community rock stars!

Leaderboard > Customer experience | Sales, Customer Insights, CRM

#1
Nagaraju_Matta Profile Picture

Nagaraju_Matta 121

#2
ManoVerse Profile Picture

ManoVerse 73 Super User 2026 Season 1

#3
Abhilash Warrier Profile Picture

Abhilash Warrier 66 Super User 2026 Season 1

Last 30 days Overall leaderboard

Featured topics

Hide selecting Contact for potential customer when creating quote

Product updates

Dynamics 365 release plans