Recent Posts

ads

Dynamically Create HTML Table in microsoft dynamics crm/microsoft crm/microsoft crm 365

 Dynamically Create HTML Table in microsoft dynamics crm



Dynamically Create HTML Table in Microsoft CRM

Microsoft Dynamic CRM




Requirment :

On Click of Button i need to display Account Entity Names by sorting dynamically in a HTML Table.


Solution :


Here i wrote the HTML code by using FetchXml in MicrosoftCRM.




<html>
<head>
    <style>
        table, td {
            border: 1px solid black;
        }
    </style>
    <meta>
</head>
<body onfocusout="parent.setEmailRange();" style="overflow-wrap: break-word;">

    <p>Click the button to add a new row at the first position of the table and then add cells and content.</p>

    <table id="myTable">
        <tbody>
            <tr>
                <th>Name</th>
                <th>id</th>
                <th>phone</th>
            </tr>
            <!--<tr>
                <td>Row1 cell1</td>
                <td>Row1 cell2</td>
                <td>Row1 cell3</td>
            </tr>
            <tr>
                <td>Row2 cell1</td>
                <td>Row2 cell2</td>
                <td>Row2 cell3</td>
            </tr>
            <tr>
                <td>Row3 cell1</td>
                <td>Row3 cell2</td>
                <td>Row3 cell3</td>

            </tr>-->
        </tbody>
    </table>
    <br>

    <button onclick="myFunction()">Try it</button>
    <p>Click the button to sort the table alphabetically, by name:</p>
    <p><button onclick="sortTable()">Sort</button></p>
    <script>
function myFunction() {
    var table = document.getElementById("myTable");
    var accountFetchXML = "<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
            "  <entity name='account'>" +
            "    <attribute name='name' />" +
            "    <attribute name='primarycontactid' />" +
            "    <attribute name='telephone1' />" +
            "    <attribute name='accountid' />" +
            "    <order attribute='name' descending='false' />" +
            "  </entity>" +
            "</fetch>";

    //Build an array containing Customer records.
    var contactsLog = new Array();
    contactsLog.push(["name", "primarycontactid", "telephone1"]);
    var contactRecords = "?fetchXml=" + encodeURIComponent(accountFetchXML);
    parent.Xrm.WebApi.retrieveMultipleRecords("account", contactRecords).then(
            function success(result) {
                //x.add(option, x[accountRecordsCount]);
                //for (var contact = 0 ; contact < contactRecords.length; contact++) {
        for (var accountRecordsCount = 0; accountRecordsCount < result.entities.length; accountRecordsCount++) {
            var name=result.entities[accountRecordsCount].name;
            var id=result.entities[accountRecordsCount].primarycontactid;
            var phone=result.entities[accountRecordsCount].telephone1;
            //outputText += result.entities[accountRecordsCount].name + "\t\t" + result.entities[accountRecordsCount].primarycontactid + "\t\t" + result.entities[accountRecordsCount].telephone1 + "\n";
            contactsLog.push([name,id,phone
          //  name=result.entities[accountRecordsCount].name ? result.entities[accountRecordsCount].name : "",
          //primarycontactid=result.entities[accountRecordsCount].primarycontactid ? result.entities[accountRecordsCount].primarycontactid : "",
          //  telephone1=result.entities[accountRecordsCount].telephone1 ? result.entities[accountRecordsCount].telephone1 : "",
            ]);
            var row = table.insertRow(0);
            var cell1 = row.insertCell(0);
            var cell2 = row.insertCell(1);
            var cell3 = row.insertCell(2);
            cell1.innerHTML = name;
            cell2.innerHTML = id;
            cell3.innerHTML = phone;
        }

                // parent.Xrm.Utility.alertDialog(outputText, null);
            },
            function (error) {
                // Handle error conditions
                parent.Xrm.Utility.alertDialog(error.message, null);
            });

}
function sortTable() {
    var table, rows, switching, i, x, y, shouldSwitch;
    table = document.getElementById("myTable");
    switching = true;
    /*Make a loop that will continue until
    no switching has been done:*/
    while (switching) {
        //start by saying: no switching is done:
        switching = false;
        rows = table.rows;
        /*Loop through all table rows (except the
        first, which contains table headers):*/
        for (i = 1; i < (rows.length - 1) ; i++) {
            //start by saying there should be no switching:
            shouldSwitch = false;
            /*Get the two elements you want to compare,
            one from current row and one from the next:*/
            x = rows[i].getElementsByTagName("TD")[0];
            y = rows[i + 1].getElementsByTagName("TD")[0];
            //check if the two rows should switch place:
            if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
                //if so, mark as a switch and break the loop:
                shouldSwitch = true;
                break;
            }
        }
        if (shouldSwitch) {
            /*If a switch has been marked, make the switch
            and mark that a switch has been done:*/
            rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
            switching = true;
        }
    }
}
    </script>
</body>
</html>

Post a Comment

1 Comments