lnappLookup.prg

<?php
  /*
   * Script: lnappLookup.v2
   *
   * Purpose:  This script is used to maintain the Select Options for the Online
   *            Loan Applications system. Each drop down will be maintained here.
   *            Even for credit union specific options
   *
   * Parameters:
   *          No Parameters
   * SPB-- 10/6/2015 version two update to kendo
   */

  $monLibrary= dirname(__FILE__) . "/../library";
  $sharedLibrary= dirname(__FILE__) . "/../../shared/library";
  require_once("$monLibrary/cu_top.i");
  require_once("$monLibrary/monitorView.i");
  require_once("$monLibrary/ck_hticket.i");
  require_once("$sharedLibrary/commonJsFunctions.i");

  if (!CheckPerm($link, $Hu, 'loanAppConfig', $_SERVER['REMOTE_ADDR'])) {
    // ** Permissions failed
    // ** redirect to new page
    header("Location: /hcuadm/hcu_noperm.prg");
    exit;
  }

// Globals
$dataFile= "lnappLookup.data";
$showSQL= false;

printMonitorPageTop("Online Loan Application Lookup Options", $homecuKendoVersion, $cloudfrontDomainName);
?>

<style>
  .popupForm .grid_12, .formContainer .grid_12 {
    margin-bottom: 5px;
  }

  #currentStatus {
      position: fixed;
      right: 20px;
      top: 50px;
      width: 250px;
      padding: 10px;
      z-index: 99;
      display: block;
  }

  .k-context-menu .k-item, .k-context-menu {
    width: 150px !important;
  }
</style>

<script type="text/javascript">

<?php
// Include common functions
getErrorsAreShownFunction();
getSetupDeleteConfirmDialogFunction();
getAddMinifiedActionStyleFunction();
getEscapeHTMLFunction();
getShowSQLFunction($showSQL);
getSetupValidatorInGridFunction();
getUseValidatorInGridFunction();
getShowWaitFunctions();
?>

<?php /* Initializes the grid. */ ?>
function initGrid()
{
    var initialized= false;
    var savedDetails= [];
    var grid= $("#grid").kendoGrid({
        dataSource: {
            transport: {
                read: {
                    url: "/hcuadm/<?php echo $dataFile; ?>?operation=read",
                    dataType: "json",
                    type: "POST"
                },
                create: {
                    url: "/hcuadm/<?php echo $dataFile; ?>?operation=createTop",
                    dataType: "json",
                    type: "POST"
                },
                update: {
                    url: "/hcuadm/<?php echo $dataFile; ?>?operation=updateTop",
                    dataType: "json",
                    type: "POST"
                },
                parameterMap: function (data, type) {
                    showWaitWindow();
                    if (type == "read")
                        return {};
                    else if (type == "create")
                        return {topTitle: data.topTitle}
                    else
                    {
                        return {topTitle: data.topTitle, topId: data.topId};
                    }
                }
            },
            schema: {
                model: {
                    id: "topId",
                    fields: {
                        topId: {type: "number"},
                        topTitle: {type: "title"},
                        details: {type: "odata"}
                    }
                },
                parse: function (data) {
                  hideWaitWindow();
                  showSQL(data);
                  $("#invalidRequestServerSide").val(errorsAreShown(data, "formValidateMainDiv"));

                  if (data.operation == "update")
                    data.record[0].details= savedDetails;
                  return data.record;
                }
            },
            sort: [{field: "topTitle"}]
        },
        columns: [
            {field: "topId", title: "Id", width: "80px"},
            {field: "topTitle", title: "Option Title"}
        ],
        sortable: true,
        filterable: {extra: false},
        toolbar: [{name: "create", text: ""}],
        detailTemplate: "<div class=\"detailGrid\"></div>",
        detailInit: function (eOuter) {
          initDetailGrid(eOuter);
       },
       editable: {
            mode: "popup",
            template: kendo.template($("#topPopupTemplate").html()),
            window: {
                draggable: false,
                resizable: false,
                title: "",
                actions: [],
                width: 400
            }
       },
       edit: function (eOuter)
       {
            setupValidatorInGrid(eOuter, false);

            if (eOuter.model.isNew())
            {
                $(".k-window-title").text("Add Lookup");
            }
            else
            {
                $(".k-window-title").text("Edit Lookup");
            }
       },
       save: function (eOuter)
       {
            useValidatorInGrid(eOuter, false);

            if (!eOuter.model.isNew())
                savedDetails= detailGrids[eOuter.model.topId+ ""].dataSource.data().slice(0);
       },
       cancel: function (eOuter)
       {
          this.cancelRow();
          var grid= this;
          var masterRows= $(this.tbody).find("tr.k-master-row");

          $(masterRows).off("mouseenter mouseleave");
        $(masterRows).on("mouseenter", function () {
          $(this).addClass("k-state-hover");
          dataItemForMenu= grid.dataItem($(this));
          gridForMenu= grid;
        });
        $(masterRows).on("mouseleave", function () {
          $(this).removeClass("k-state-hover");
        });
        // Put it at the td level because expanding/collapsing the master row should not open up the edit.
        $(masterRows).find("[role='gridcell']").on("click", function () {
          gridForMenu= grid;
          dataItemForMenu= grid.dataItem($(this).parent());
          grid.editRow($(this).parent());
        });

        eOuter.preventDefault();
        return false;
       },
       dataBound: function (eOuter) {
             var masterRows= $(this.tbody).find("tr.k-master-row");
             var grid= this;
             if (!initialized)
             {
                  addMinifiedActionStyle(this, true);
                  initialized= true;

                  // Make sure that all detail grids are initialized for "add subtask option"
                  $(masterRows).each(function() {
                     grid.expandRow($(this));
                     grid.collapseRow($(this));
                  });
             }

            initContextMenu(this);

            $(masterRows).on("mouseenter", function () {
              $(this).addClass("k-state-hover");
              dataItemForMenu= grid.dataItem($(this));
              gridForMenu= grid;
            });
            $(masterRows).on("mouseleave", function () {
              $(this).removeClass("k-state-hover");
            });
            // Put it at the td level because expanding/collapsing the master row should not open up the edit.
            $(masterRows).find("[role='gridcell']").on("click", function () {
              gridForMenu= grid;
              dataItemForMenu= grid.dataItem($(this).parent());
              grid.editRow($(this).parent());
            });
        }
    }).data("kendoGrid");
}

<?php /* Initializes the bottom-level grid. */ ?>
function initDetailGrid(eOuter)
{
    var initialized= false;
    var detailData= eOuter.data.details.slice(0);
    var detailGrid= eOuter.detailRow.find(".detailGrid").kendoGrid({
        dataSource: {
            transport: {
                read: function (options) {
                    options.success(detailData);
                },
                create: function (options) {
                    $.post("/hcuadm/<?php echo $dataFile; ?>?operation=createBottom", {bottomValue: options.data.bottomValue, bottomText: options.data.bottomText, topId: eOuter.data.topId},
                    function (data) {
                        showSQL(data);
                        if (!errorsAreShown(data, "formValidatePopupDetailDiv"))
                        {
                            options.success(data.record);
                            eOuter.data.details= detailData.slice(0);
                        }
                        else
                        {
                            options.error(data.record);
                        }

                    });
                },
                update: function (options) {
                    $.post("/hcuadm/<?php echo $dataFile; ?>?operation=updateBottom", {bottomValue: options.data.bottomValue, bottomText: options.data.bottomText, bottomId: options.data.bottomId},
                    function (data) {
                        showSQL(data);
                        if (!errorsAreShown(data, "formValidatePopupDetailDiv"))
                        {
                            options.success(data.record);
                            eOuter.data.details= detailData.slice(0);
                        }
                        else
                        {
                            options.error(data.record);
                        }

                    });
                }
            },
            schema: {
                model: {
                    id: "bottomId",
                    fields: {
                        bottomId: {type: "number"},
                        bottomValue: {type: "string"},
                        bottomText: {type: "string"},
                        topId: {type: "number"}
                    }
                }
            },
            sort: [{field: "bottomText", dir: "asc"}, {field: "bottomValue", dir: "asc"}]
        },
        columns: [
            {field: "bottomId", title: "Id", width: "80px"},
            {field: "bottomValue", title: "Answer Value"},
            {field: "bottomText", title: "Answer Display"}
        ],
        sortable: true,
        filterable: {extra: false},
        editable: {
            mode: "popup",
            template: kendo.template($("#bottomPopupTemplate").html()),
            window: {
                draggable: false,
                resizable: false,
                title: "",
                actions: [],
                width: 400
            }
       },
       edit: function (eInner)
       {
            setupValidatorInGrid(eInner, true);

            if (eInner.model.isNew())
            {
                $(".k-window-title").text("Add Detail");
            }
            else
            {
                $(".k-window-title").text("Edit Detail");
            }
       },
       save: function (eInner)
       {
            useValidatorInGrid(eInner, true);
       },
       cancel: function (eInner)
       {
            this.cancelChanges();
            var grid= this;
            var detailRows= $(this.tbody).find("tr");

            $(detailRows).off("mouseenter mouseleave click");
            $(detailRows).on("mouseenter", function () {
              $(this).addClass("k-state-hover");
              rowForMenu= $(this);
              dataItemForMenu= grid.dataItem($(this));
              gridForMenu= grid;
            });
            $(detailRows).on("mouseleave", function () {
              $(this).removeClass("k-state-hover");
            });
            // Put it at the td level because expanding/collapsing the master row should not open up the edit.
            $(detailRows).on("click", function () {
              gridForMenu= grid;
              dataItemForMenu= grid.dataItem($(this));
              grid.editRow($(this));
            });

            eInner.preventDefault();
            return false;
       },
       dataBound: function (eInner)
       {
            var grid= this;
            var detailRows= $(this.tbody).find("tr");
            $(detailRows).on("mouseenter", function () {
              $(this).addClass("k-state-hover");
              rowForMenu= $(this);
              dataItemForMenu= grid.dataItem($(this));
              gridForMenu= grid;
            });
            $(detailRows).on("mouseleave", function () {
              $(this).removeClass("k-state-hover");
            });
            // Put it at the td level because expanding/collapsing the master row should not open up the edit.
            $(detailRows).on("click", function () {
              gridForMenu= grid;
              dataItemForMenu= grid.dataItem($(this));
              grid.editRow($(this));
            });
       }
    }).data("kendoGrid");

    detailGrids[eOuter.data.topId]= detailGrid;
}

<?php /* Initializes the right-click menu at both levels of the grid. */ ?>
var dataItemForMenu= null, gridForMenu= null, rowForMenu= null, detailGrids= [];
function initContextMenu(grid)
{
    var contextMenu= $("#contextMenu").data("kendoContextMenu");

    if (contextMenu == null)
    {
        var deleteConfirm= $("<div id='deleteDialog'></div>").kendoWindow({
            content: {template: $("#deleteConfirmTemplate").html()},
            draggable: false,
            visible: false,
            actions: [],
            modal: true,
            title: "Confirm deletion",
            width: 400,
            height: 125,
            resizable: false
        }).data("kendoWindow");

        $("#deleteDialog .deleteConfirmContinueBtn").click(function () {
            var deleteDetails= typeof(dataItemForMenu.details) != "undefined" && Number(dataItemForMenu.details.length) > 0 ? "Y" : "N";
            var isMaster= $(gridForMenu.tbody).find("tr.k-master-row").length > 0;
            var url= "/hcuadm/<?php echo $dataFile; ?>?operation=" + (isMaster ? "deleteTop" : "deleteBottom");
            var parameters= isMaster ? {topId: dataItemForMenu.topId, deleteDetails: deleteDetails} : {bottomId: dataItemForMenu.bottomId};
            showWaitWindow();
            $.post(url, parameters, function (data){
                hideWaitWindow();
                showSQL(data);

                // If no errors, then remove record from the grid
                if (!errorsAreShown(data, "formValidateMainDiv"))
                {
                    var data= gridForMenu.dataSource.data().slice(0);
                    var id= isMaster ? "topId" : "bottomId";
                    data= $.grep(data, function(n,i) { return n[id] != dataItemForMenu[id]; });
                    gridForMenu.dataSource.data(data);

                    if (!isMaster)
                    {
                      var fullGridData= grid.dataSource.data().slice(0);
                      for(var i=0; i!= fullGridData.length; i++)
                      {
                        if (fullGridData[i].topId == dataItemForMenu.topId)
                        {
                          fullGridData[i].details= data;
                          break;
                        }
                      }
                      grid.dataSource.data(fullGridData);
                    }
                }
            });
            deleteConfirm.close();
            return false;
        });

        $("#deleteDialog .deleteConfirmCancelBtn").click(function () {
            deleteConfirm.close();
            return false;
        });

      var contextMenu= $("<div id='contextMenu'></div>").kendoContextMenu({
            target: "#grid",
            filter: ".k-master-row [role='gridcell'], .detailGrid .k-grid-content tr",
            alignToAnchor: true,
            orientation: "vertical",
            popupCollision: false,
            open: function (e)
            {
                this.remove("li");

                var options= [];
                var grid= $(e.event.target).closest(".k-grid").data("kendoGrid");
                var tr= $(e.event.target).closest("tr"); // If set at the tr level, it returns itself.  If set at the td level, it return its parent.
                var dataItem= grid.dataItem($(tr));

                if ($(grid.tbody).find(".k-master-row").length != 0)
                {
                   options= [{text: "Edit", cssClass: "editLi"}, {text: "Delete", cssClass: "deleteLi"}, {text: "Add detail", cssClass: "addDetailLi"}];
                }
                else
                {
                    options= [{text: "Edit", cssClass: "editLi"}, {text: "Delete", cssClass: "deleteLi"}];
                }

                this.append(options);
            },
            select: function (e)
            {
              var item= $(e.item);
              var tr= $(e.target).closest("tr"); // If set at the tr level, it returns itself.  If set at the td level, it return its parent.
              var grid= $(e.target).closest(".k-grid").data("kendoGrid");
              var dataItem= grid.dataItem($(tr));

              if ($(item).hasClass("editLi"))
              {
                  grid.editRow($(tr));
              }
              else if ($(item).hasClass("deleteLi"))
              {
                      var numDetails= typeof(dataItem.details) == "undefined" ? 0 : Number(dataItem.details.length);

                if (numDetails > 0)
                {
                    $("#detailDeleteMsg").show();
                    $("#detailDeleteMsg span").text(numDetails);
                }
                else
                {
                    $("#detailDeleteMsg").hide();
                }
                deleteConfirm.open().center();
              }
              else if ($(item).hasClass("addDetailLi"))
              {
                detailGrids[dataItem.topId+ ""].addRow();
              }
            }
      }).data("kendoContextMenu");
    }
 }

$(document).ready(function () {
    initGrid();
});
</script>

<script id="topPopupTemplate" type="text/x-kendo-template">
    <div id="formValidatePopupDiv" class="homecu-formStatus k-block k-error-colored" style="display:none;"></div>
    <form id="popupForm" class="popupForm" data-role="validator" novalidate>
        <div class="container_12">
            <div class="grid_12">
                 <div class="grid_4 alpha">
                     <label>Title:</label>
                 </div>
                 <div class="grid_7">
                     <input type="text" class="k-input" name="topTitle" maxlength="50" required data-required-msg="Title is required" style="width: 100%">
                 </div>
                 <div class="grid_1 omega">
                     <span data-for='topTitle' class='k-invalid-msg'></span>
                 </div>
            </div>
        </div>
    </form>
</script>

<script id="bottomPopupTemplate" type="text/x-kendo-template">
    <div id="formValidatePopupDetailDiv" class="homecu-formStatus k-block k-error-colored" style="display:none;"></div>
    <form id="popupFormDetail" class="popupForm" data-role="validator" novalidate>
        <div class="container_12">
            <div class="grid_12" id="bottomIdRow" style="display: none;">
                 <div class="grid_4 alpha">
                     <label>Id:</label>
                 </div>
                 <div class="grid_7">
                     <div>#: bottomId #</div>
                 </div>
                 <div class="grid_1 omega">
                     &nbsp;
                 </div>
            </div>
            <div class="grid_12">
                 <div class="grid_4 alpha">
                     <label>Value:</label>
                 </div>
                 <div class="grid_7">
                     <input type="text" class="k-input" name="bottomValue" maxlength="50" required data-required-msg="Value is required" style="width: 100%">
                 </div>
                 <div class="grid_1 omega">
                     <span data-for='bottomValue' class='k-invalid-msg'></span>
                 </div>
            </div>
            <div class="grid_12">
                 <div class="grid_4 alpha">
                     <label>Text:</label>
                 </div>
                 <div class="grid_7">
                     <input type="text" class="k-input" name="bottomText" maxlength="50" required data-required-msg="Text is required" style="width: 100%">
                 </div>
                 <div class="grid_1 omega">
                     <span data-for='bottomText' class='k-invalid-msg'></span>
                 </div>
            </div>
        </div>
    </form>
</script>
<script id="deleteConfirmTemplate" type="text/x-kendo-template">
  <div class="k-edit-form-container">
    <div class="container_12">
        <div class="grid_12 message">Are you sure that you want to delete? <span id="detailDeleteMsg" style="display:none;">This will also delete <span>1</span> detail(s) as well.</div>
    </div>
    <div class="k-edit-buttons k-state-default">
        <a class="k-button k-button-icontext deleteConfirmContinueBtn" href="\#">
            <span class="k-icon k-i-check"></span>
            Continue
        </a>
        <a class="k-button k-button-icontext deleteConfirmCancelBtn" href="\#">
            <span class="k-icon k-i-cancel"></span>
            Cancel
        </a>
    </div>
  </div>
</script>

<?php printMonitorPageMiddle("Online Loan Application Lookup Options"); ?>
        <div id='hideSubmitWait' style='position:relative; left:-2000px;top:-2000px;'>
          <div id='homecuSubmitWait' class='k-block' >
            <div class='k-loading-image'></div>
          </div>
        </div>
        <input type="hidden" id="invalidRequestClientSide">
        <input type="hidden" id="invalidRequestServerSide">
        <div class="container_12">
            <div class="grid_12">
                <div class="grid_7 alpha omega">
                      <div id="sqlOutput"></div>
                </div>
            </div>
            <div class="grid_12">
                <div class="grid_7 alpha omega">
                      <div id="formValidateMainDiv" class="k-block k-error-colored" style="display:none;"></div>
                </div>
            </div>
            <div class="grid_12">
                <div class="grid_7 alpha omega">
                    <div id="grid" style="width:100%"></div>
                </div>
            </div>
        </div>

<?php printMonitorPageBottom(); ?>