html page with table inside another table

-
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Designing html page</title>
    <style>
        body {
            font-family: Segoe\000020UI,Arial,sans\00002Dserif;
            font-size: 12px;
            color: #444;
            padding: 0px;
            margin: 0px;
        }

        table {
            border-collapse: collapse;
            width: 100%;
        }

        th {
            border-bottom: none!important;
            border-right: 1px solid #dddddd!important;
        }

        td, th {
            border: 1px solid #dddddd;
            text-align: left;
            padding: 8px;
            vertical-align: top;
        }

        .nobrdr td {
            border: none;
        }

        input {
            cursor: pointer;
        }

        .Record-table {
            position: absolute;
            left: 0px;
            right: 0px;
            top: 38px;
            bottom: 0px;
            overflow: auto;
        }
    </style>
    <script src="../../ClientGlobalContext.js.aspx" type="text/javascript"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            accountEnt();
            hideButtons();
        });
        var account = null;
        var enqId = null;
        var rateReqAdd = null;
        var rRD = null;
        var accountAdd = null;
        //this method is usesd for hide the buttons
        function hideButtons() {
            var formType = null;
            formType = parent.Xrm.Page.ui.getFormType();
            if (formType == 1 || formType == 3 || formType == 4) {
                $("#calculate").hide();
                $("#newenquiry").hide();
            }
        }

        //this method is used to retrieve the Enquiry related account records and binding record to table main table
        function accountEnt() {
            enqId = null;
            enqId = parent.Xrm.Page.data.entity.getId();
            var fetchXml = "<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
                           "<entity name='apy_account'>" +
                             "<attribute name='apy_accountid' />" +
                             "<attribute name='apy_name' />" +
                             "<attribute name='createdon' />" +
                             "<attribute name='apy_quantity' />" +
                             "<attribute name='apy_costprovidedperunit' />" +
                             "<attribute name='apy_costprovidedpershipmentincl' />" +
                             "<attribute name='apy_carriersupplier' />" +
                             "<order attribute='apy_name' descending='false' />" +
                             "<filter type='and'>" +
                            // "<condition attribute='statecode' operator='eq' value='0' />"+
                               "<condition attribute='apy_enquirynumber' operator='eq' uiname='ENQ-014' uitype='apy_enquiry' value='" + enqId + "' />" +//apy_enquirynumber=lookup for Enquiry
                             "</filter>" +
                           "</entity>" +
                           "</fetch>";
            var req = new XMLHttpRequest();
            req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/apy_accounts?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.onreadystatechange = function () {
                if (this.readyState === 4) {
                    req.onreadystatechange = null;
                    if (this.status === 200) {
                        var checkBox = [];
                        var results = JSON.parse(this.response);
                        if (results != null && results != undefined) {
                            account = results.value;
                            if (account.length > 0) {
                                var tbody = "<div class='Record-table'><table cellpadding='0' cellspacing='0'><colgroup><col style='width:39px' /><col style='width:300px' /><col style='width:200px' /><col style='width:300px' /><col style='width:250px' /><col /></colgroup><tbody id='tbody'>";
                                var newRow = $('<tr  class="rowdiv1"></tr>');
                                for (var i = 0; i < account.length; i++) {
                                    rRD = null;
                                    if (account[i].apy_accountid != undefined && account[i].apy_accountid != null) {
                                        tbody += "<tr  id='" + account[i].apy_accountid + "'>";
                                        var entityId = account[i].apy_accountid;
                                        tbody += "<td><input type='checkbox' id='" + account[i].apy_accountid + "' onclick=''></td>";
                                        checkBox.push(account[i].apy_accountid);
                                        if (account[i].apy_name != undefined && account[i].apy_name != null) {
                                            rateReqAdd = contact(account[i].apy_accountid);
                                            //var td = "<td>" + account[i].apy_name + "</td>";
                                            var td = "<td><a href='" + Xrm.Page.context.getClientUrl() + "/main.aspx?etc=10012&extraqs=&histKey=476275793&id=%7b" + account[i].apy_accountid + "%7d&newWindow=true&pagetype=entityrecord' target='_blank'> " + account[i].apy_name + " </a></td>";
                                            if (rateReqAdd != undefined && rateReqAdd != null) {
                                                if (rateReqAdd.length > 0) {
                                                    tbody += td;// "<td>" + account[i].apy_name + "</td>";
                                                    rRD = generateTable(rateReqAdd);
                                                } else {
                                                    tbody += td;
                                                }
                                            } else {
                                                tbody += td;
                                            }
                                        } else {
                                            tbody += "<td>" + "" + "</td>";
                                        }
                                    }
                                    if (account[i][["_apy_carriersupplier_value@OData.Community.Display.V1.FormattedValue"]] != undefined && account[i]["_apy_carriersupplier_value@OData.Community.Display.V1.FormattedValue"] != null)
                                        tbody += "<td>" + account[i]['_apy_carriersupplier_value@OData.Community.Display.V1.FormattedValue'] + "</td>";
                                    else
                                        tbody += "<td>" + "" + "</td>";

                                    if (account[i]['apy_costprovidedpershipmentincl@OData.Community.Display.V1.FormattedValue'] != undefined && account[i]['apy_costprovidedpershipmentincl@OData.Community.Display.V1.FormattedValue'] != null)
                                        tbody += "<td>" + account[i]['apy_costprovidedpershipmentincl@OData.Community.Display.V1.FormattedValue'] + "</td>";
                                    else
                                        tbody += "<td>" + "" + "</td>";

                                    if (account[i]["apy_costprovidedperunit@OData.Community.Display.V1.FormattedValue"] != undefined && account[i]["apy_costprovidedperunit@OData.Community.Display.V1.FormattedValue"] != null)
                                        tbody += "<td>" + account[i]['apy_costprovidedperunit@OData.Community.Display.V1.FormattedValue'] + "</td>";
                                    else
                                        tbody += "<td>" + "" + "</td>";

                                    if (account[i]["apy_quantity@OData.Community.Display.V1.FormattedValue"] != undefined && account[i]["apy_quantity@OData.Community.Display.V1.FormattedValue"] != null)
                                        tbody += "<td>" + account[i]["apy_quantity@OData.Community.Display.V1.FormattedValue"] + "</td>";
                                    else
                                        tbody += "<td>" + "" + "</td>";
                                    //tbody += "<td class='delete'><input type='button' id='" + account[i].apy_accountid + "'  class='delete' value='Delete' onclick='Delete()'></td>";

                                    tbody += "</tr>";
                                    if (rRD != undefined && rRD != null) {
                                        tbody += "<tr><td></td><td><div id='tbl'>" + rRD + "</div></td></tr>";
                                    }
                                }
                                tbody += "</tbody></table></div>"
                                $('#tabledata').append(tbody);
                            }
                        }
                    } else {
                        Xrm.Utility.alertDialog(this.statusText);
                    }
                }
            };
            req.send();
        }
        //this method is used to create the child table inside the parent table
        function generateTable(data) {
            // tabledata = tabledata + "<th>" + "select" + "</th>";
            var tabledata = "<table cellspacing='10'>";
            // tabledata = tabledata + "<th></th>";
            tabledata = tabledata + "<th>Name</th>";
            tabledata = tabledata + "<th>Additional Charges</th>";
            //tabledata = tabledata + "<th></th>";
            //tabledata = tabledata + "<th></th>";
            //tabledata = tabledata + "<th></th>";
            for (var i = 0; i < data.length; i++) {
                tabledata = tabledata + "<tr>";
                //tabledata = tabledata + "<td></td>";
                // tabledata = tabledata + "<td>" + data[i].apy_name + "</td>";
                tabledata = tabledata + "<td><a href='" + Xrm.Page.context.getClientUrl() + "/main.aspx?etc=10035&extraqs=&histKey=579554846&id=%7b" + data[i].apy_contactid + "%7d&newWindow=true&pagetype=entityrecord' target='_blank'> " + data[i].apy_name + " </a></td>";
                tabledata = tabledata + "<td>" + data[i].apy_additionalcharges + "</td>";
                //tabledata = tabledata + "<td></td>";
                //tabledata = tabledata + "<td></td>";
                //tabledata = tabledata + "<td></td>";
                tabledata = tabledata + "</tr>"
            }
            tabledata = tabledata + "</table>";
            return tabledata;
        }     

        //ths is method is used to retrieve the account related contacts
        function contact(cSaccountId) {
            var fetchxml = "<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
     "<entity name='apy_contact'>" +
       "<attribute name='apy_contactid' />" +
       "<attribute name='apy_name' />" +
       "<attribute name='apy_additionalcharges' />" +
       "<attribute name='createdon' />" +
       "<order attribute='apy_name' descending='false' />" +
       "<filter type='and'>" +
         "<condition attribute='apy_account' operator='eq' uiname='RR-007' uitype='apy_account' value='{" + cSaccountId + "}' />" +
       "</filter>" +
     "</entity>" +
   "</fetch>"
            var req = new XMLHttpRequest();
            req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/apy_contacts?fetchXml=" + fetchxml, false);
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
            req.onreadystatechange = function () {
                if (this.readyState === 4) {
                    req.onreadystatechange = null;
                    if (this.status === 200) {
                        var checkBox = [];
                        var data = JSON.parse(this.response);
                        if (data != null && data.value != null) {
                            var checkBox = new Array();
                            if (data.value != null && data.value != undefined) {
                                accountAdd = data.value;
                            }
                        }
                    } else {
                        var error = JSON.parse(this.response).error;
                        alert(error.message);
                    }
                }
            };
            req.send();
            return accountAdd;
        }

        //this method is used to checkbox checked all checkboxes
        function selectAll(CheckBox) {
            var elements = document.getElementsByTagName('input');
            for (var i = 0; i < elements.length; i++) {
                if (elements[i].type == "checkbox") {
                    elements[i].checked = CheckBox.checked;
                }
            }
        }

        //this  method is used to perform calculation on selected records
        function calculate() {
            var checkedRecords = null;
            var contactChargesofRR = null;
            var RRAddCharges = 0;
            var totolCosts = 0;
            var costprovidedperunit = 0;
            var costprovidedpershipmentincl = 0;
            var quantity = 0;
            var rRACharges = 0;
            checkedRecords = $(':checkbox:checked').each(function (i) { });
            if (checkedRecords.length > 0) {
                if (account.length > 0) {
                    for (var i = 0; i < checkedRecords.length; i++) {
                        for (var j = 0; j < account.length; j++) {
                            RRAddCharges = 0;
                            if (checkedRecords[i].id == account[j].apy_accountid) {
                                contactChargesofRR = contact(account[j].apy_accountid);
                                if (contactChargesofRR != undefined && contactChargesofRR != null) {
                                    if (contactChargesofRR.length > 0) {
                                        for (var k = 0; k < contactChargesofRR.length; k++) {
                                            RRAddCharges += contactChargesofRR[k].apy_additionalcharges != undefined && contactChargesofRR[k].apy_additionalcharges != null ? contactChargesofRR[k].apy_additionalcharges : 0;
                                        }
                                    }
                                }
                                costprovidedperunit = account[j].apy_costprovidedperunit != undefined && account[j].apy_costprovidedperunit != null ? account[j].apy_costprovidedperunit : 0;
                                costprovidedpershipmentincl = account[j].apy_costprovidedpershipmentincl != undefined && account[j].apy_costprovidedpershipmentincl != null ? account[j].apy_costprovidedpershipmentincl : 0;
                                quantity = account[j].apy_quantity != undefined && account[j].apy_quantity != null && account[j].apy_quantity ? account[j].apy_quantity : 0;
                                rRACharges = RRAddCharges != undefined && RRAddCharges != null ? RRAddCharges : 0;
                                totolCosts += (costprovidedperunit * quantity) + costprovidedpershipmentincl + rRACharges;
                            }
                        }
                    }
                }
                alert("totolCosts:  " + totolCosts);
            }
        }
        //this method used to open the new contact record
        function openNewRRWindow() {
            //var windowOptions = {
            //        openInNewWindow: true
            //    };
            //Xrm.Utility.openEntityForm("apy_account", null, null, windowOptions);
            var name = null;
            var ids = null;
            var id = null;
            var url = null;
            ids = parent.Xrm.Page.data.entity.getId();
            name = parent.Xrm.Page.getAttribute("apy_name").getValue();
            id = ids.replace("{", "").replace("}", "");
            var parameters = {};
            parameters["apy_equipmentcode"] = id;
            parameters["apy_equipmentcodename"] = name;
            parameters["apy_equipmentcodetype"] = "apy_enquiry";
            var windowOptions = {
                openInNewWindow: true
            };
            url = ""+Xrm.Page.context.getClientUrl()+"/main.aspx?etc=10012&extraqs=%3f_CreateFromId%3d%257b" + id + "%257d%26_CreateFromType%3d10013%26etc%3d10012&histKey=268729806&newWindow=true&pagetype=entityrecord#625131155";
            window.open(url, "_blank", "width=1200,height=1200");
            //Xrm.Utility.openEntityForm("apy_account", null, parameters, windowOptions);
        }
        //this emthod is used to deactivate the selected record like account
        function deactivate() {
            var checkedRecords = {};
            //$("input:checkbox").each(function () {
            //    var $this = $(this);
            //    if ($this.is(":checked")) {
            //        selectedCheckboxes.push($this.attr("id"));
            //    }
            //});
            checkedRecords = $(':checkbox:checked').each(function (i) { });
            if (checkedRecords.length > 0) {
                deActivatecontactData(checkedRecords);
            } else {
                Xrm.Utility.alertDialog("Please select atleast one Rate Request record");
            }

        }

        function deActivatecontactData(selectedCheckboxes) {
            for (var i = 0 ; i < selectedCheckboxes.length; i++) {
                if (selectedCheckboxes[i] != undefined) {
                    if (selectedCheckboxes[i].id != null && selectedCheckboxes[0].id != undefined) {
                        var data =
                  {
                      "statecode": 1,
                      "statuscode": 2,
                  }
                        // Update the Account Record
                        Xrm.WebApi.updateRecord("apy_account", selectedCheckboxes[i].id, data).then(
                        function success(result) {
                            // Perform operations on record update
                            Xrm.Utility.alertDialog("Deactivated Successfully", null);
                        },
                        function (error) {
                            // Handle error conditions
                            Xrm.Utility.alertDialog(error.message, null);
                        }
                        );
                    }
                }
            }
        }
        //this method is used to delete the record selected record
        function Delete() {
            $(".delete").click(function () {
                deleteButtonId = this.id;
            });
            if (deleteButtonId != undefined) {
                alert("Guid : " + deleteButtonId);
            }
            else {
                alert("deleteButton iD is undefined");
            }
        }

    </script>
</head>
<body>
    <div class="wrapper">
        <div id="tabledata" class="table-data">
            <div style="background-color: #f3f3f3;">
                <table cellpadding="0" cellspacing="0" id="tblSPFolderConfig" style="table-layout: fixed; width: 100%;">
                    <colgroup>
                        <col style="width: 39px">
                        <col style="width: 300px;">
                        <col style="width: 200px;">
                        <col style="width: 300px;">
                        <col style="width: 250px;">
                        <col style="">
                    </colgroup>
                    <thead>
                        <tr>
                            <th>
                                <input type="checkbox" class="allcheck" onclick="selectAll(this)"></th>
                            <th>Name</th>
                            <th>Carrier Supplier</th>
                            <th>Cost Provided Per Shipmentincl</th>
                            <th>Cost Provided Per Unit</th>
                            <th>Quantity</th>
                            <th>
                                <input type="button" id="calculate" class="button" value="Calculate" onclick="calculate()">
                                <input type="button" id="newenquiry" class="plus" value="+" onclick="openNewRRWindow()">
                                 <input type="button" id="deactivate" class="button" value="Deactivate" onclick="deactivate()">
                            </th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</body>
</html>

Comments

Post a Comment

Popular posts from this blog

Basic Plugin Code in D365 using C#

-
 using System; using Microsoft.Xrm.Sdk; using Microsoft.Xrm.Sdk.Query; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using Microsoft.Xrm.Sdk.Messages; using Microsoft.Xrm.Sdk.Metadata; namespace  apy.CWA.Arcese.Security {     public class PostOperationCreateQuote : IPlugin     {         public void Execute(IServiceProvider serviceProvider)         {             ITracingService tracingService = (ITracingService)serviceProvider.GetService(typeof(ITracingService));             IPluginExecutionContext context = (IPluginExecutionContext)serviceProvider.GetService(typeof(IPluginExecutionContext));             IOrganizationServiceFactory serviceFactory = (IOrganizationServiceFactory)serviceProvider.GetService(typeof(IOrganizationServiceFactory));             IOrganizationService service = serviceFactory.CreateOrganizationService(context.UserId);             Entity entity = null;             try             {                 if (context.I
Read more

CURD (Create, Update, Retrieve and Delete) Operation in D365 using Power Shell Script

-
Connect D365 using below details: Install-Module Microsoft.Xrm.Data.PowerShell -Scope CurrentUser Set-ExecutionPolicy –ExecutionPolicy RemoteSigned –Scope CurrentUser [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.SecurityProtocolType]::Tls12 $Username ="APY***@Trailcrm.com" $Password ="apy****" $pwd = ConvertTo-SecureString $Password -AsPlainText -Force  $credentials = New-Object System.Management.Automation.PSCredential($Username, $pwd) $conn = Connect-CrmOnline -Credential $credentials -ServerUrl "https://apytrailcrm****.crm.dynamics.com/" -ForceOAuth Create a record using powershell Syntax:     New-CrmRecord [-conn <CrmServiceClient>] [-EntityLogicalName] <String> [-Fields] <Hashtable> [<CommonParameters>] Ex:      $parentId = New-CrmRecord account @{"name"="parent account name"}     $parentReference = New-CrmEntityReference -EntityLogicalName account -Id $parentId     New-CrmRecord -conn
Read more

Meta Data Using WebApiRequest

-
////////////////Query Entity Metadata along with all attributes///////////// var url = req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/EntityDefinitions(LogicalName='contact')/Attributes", false); /////////////////Entity Object Type code///////////////////////  req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/EntityDefinitions?$filter=LogicalName eq '" + entityLogicalName + "'&$select=ObjectTypeCode", false); ////////////////////////////////////Querying single Field Metadata///////////////////// var url = req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/EntityDefinitions(LogicalName='contact')/Attributes(LogicalName='firstname')", false); /////////////////Querying Relationships/////////////////// var url = req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/RelationshipDefinitions(SchemaName
Read more