var gridBuilderGlobal =
{
    dictionary: {
        item: "مورد",
        null: "خالی باشد",
        notNull: "شامل هر مقداری باشد",
        equal: "برابر باشد",
        notEqual: "برابر نباشد",
        startWith: "شروع شود با",
        endWith: "تمام شود با",
        contain: "شامل شود",
        notContain: "شامل نشود",
        less: "کمتر از",
        lessEqual: "کمتر از یا مساوی با",
        greater: "بیشتر از",
        greaterEqual: "بیشتر از یا مساوی با",
        viewSelected: "نمایش انتخاب شده‌ها",
        selectedItems: "انتخاب شده‌ها",
        viewAll: "نمایش همه",
        deleteSelected: "حذف انتخاب شده ها",
        selected: "انتخاب شده",
        goto: "برو به",
        from: "از",
        insertKeyForNewRow: "برای درج سطر جدید از کلیدهای ctrl + insert استفاده نمایید",
        newRow: "سطر جدید",
        groupingDragHelp: "ستون مورد نظر را در اینجا رها کنید",
        noSelectedItem: "رکوردی انتخاب نشده است",
        selectRecordAll: "انتخاب همه رکوردها",
        selectCurrentRecord: "انتخاب رکوردهای جاری",
        changeField: "تغییر فیلد",
        autoAlignColumns: "متناسب کردن خودکار ستون ها",
        getExcelSample: "دریافت نمونه اکسل",
        excelOutput: "خروجی اکسل",
        importFromExcel: "ورود از اکسل",
        fileOutputOffline: "خروجی فایل (افلاین)",
        fileInputOffline: "ورود از فایل (افلاین)",
        manageTags: "مدیریت برچسب ها"
    },
    gridBodyRowsFind: "tr:not('.row-edit'):not('.grid-empty'):not('.grid-row-lazy'):not('.header-grouping'):not('.row-summery'):not('.row-expandable'):not('.ui-draggable-dragging')",
    gridBodyRowsDeleteFind: "tr:not('.row-edit'):not('.grid-empty'):not('.grid-row-lazy')",
    gridFocusColumnEditModeFind: "td:not('.column-select'):not('.column-tag'):not('.column-context-menu'):not('.column-delete-row'):not([hidden]):not([disabled]):not('.extend-data')",
    gridFocusColumnFind: "td:not('.column-select'):not('.column-tag'):not('.column-context-menu'):not('.column-delete-row'):not([hidden]):not('.extend-data')",
    enterKey: 13, tabKey: 9, insertKey: 45, deleteKey: 46, escapeKey: 27, upKey: 38, downKey: 40, leftKey: 37, rightKey: 39, equalKey: 187,
    f1Key: 112, f2Key: 113, f3Key: 114, f4Key: 115, f5Key: 116, f6Key: 117, f7Key: 118, f8Key: 119, f9Key: 120, f10Key: 121, f11Key: 122, f12Key: 123,
    moreIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 24 24' version='1.1' style='fill:#666666'><g><path d='M 12 3 C 10.894531 3 10 3.894531 10 5 C 10 6.105469 10.894531 7 12 7 C 13.105469 7 14 6.105469 14 5 C 14 3.894531 13.105469 3 12 3 Z M 12 10 C 10.894531 10 10 10.894531 10 12 C 10 13.105469 10.894531 14 12 14 C 13.105469 14 14 13.105469 14 12 C 14 10.894531 13.105469 10 12 10 Z M 12 17 C 10.894531 17 10 17.894531 10 19 C 10 20.105469 10.894531 21 12 21 C 13.105469 21 14 20.105469 14 19 C 14 17.894531 13.105469 17 12 17 Z '></path></g></svg>",
    filterIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 24 24' version='1.1' style='fill:#666666;'><g><path d='M 3 2 L 3 4 L 9 12 L 15 12 L 21 4 L 21 2 Z M 9 13 L 9 19 L 15 22 L 15 13 Z '></path></g></svg>",
    unFilterIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 24 24' xml:space='preserve'><g><rect x='2' y='3' width='18' height='2' style='fill: #666666;'/><polygon points='4,7 9,13 9,21 13,21 13,13 18,7' style='fill: #666666;'/><path d='M17.5,9.5c-3.2,0-5.8,2.6-5.8,5.8c0,3.2,2.6,5.8,5.8,5.8s5.8-2.6,5.8-5.8C23.3,12.1,20.7,9.5,17.5,9.5z M20.8,17.6l-0.9,0.9l-2.3-2.3l-2.3,2.3l-0.9-0.9l2.3-2.3l-2.3-2.3l0.9-0.9l2.3,2.3l2.3-2.3l0.9,0.9l-2.3,2.3L20.8,17.6z' style='fill: #E00036;'/></g></svg>",
    refreshIcon: "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='fill:  #666666;'><path d='M 12 3 C 7.037 3 3 7.038 3 12 L 5 12 C 5 8.14 8.141 5 12 5 C 14.185097 5 16.125208 6.0167955 17.408203 7.5917969 L 15 10 L 21 10 L 21 4 L 18.833984 6.1660156 C 17.184843 4.2316704 14.736456 3 12 3 z M 19 12 C 19 15.859 15.859 19 12 19 C 9.8149031 19 7.8747922 17.983204 6.5917969 16.408203 L 9 14 L 3 14 L 3 20 L 5.1660156 17.833984 C 6.8151574 19.76833 9.263544 21 12 21 C 16.963 21 21 16.963 21 12 L 19 12 z'></path></svg>",
    relatedTagIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='fill:#666666;' xml:space='preserve'><path d='M11.3,3l-7.8,8.2c-0.6,0.7-0.6,1.7,0,2.4l4.9,5.1c0.6,0.6,1.6,0.7,2.2,0.1c0,0,0.1,0,0.1-0.1 l7.8-8.2V3H11.3z M15.7,4.7c0.7,0,1.3,0.5,1.3,1.2s-0.5,1.3-1.2,1.3c-0.7,0-1.3-0.5-1.3-1.2c0,0,0,0,0-0.1C14.4,5.3,15,4.7,15.7,4.7 z M16.9,14.1v2.6h-2.5v1.7h2.5V21h1.6v-2.6H21v-1.7h-2.5v-2.6H16.9z'/></svg>",
    filterTagIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='fill:#666666;' xml:space='preserve'><g transform='translate(0 0)'><path d='M16.1,21v-3.9l-2.2-2.9h6.3l-2.2,2.9V21H16.1z M8.2,19.4L3.5,14c-0.6-0.7-0.6-1.8,0-2.5L11.1,3h7 v7.4c-0.6-0.3-1.3-0.4-2-0.4c-3,0-5.4,2.6-5.4,5.8c0,0.9,0.2,1.8,0.6,2.7l-0.8,0.9c-0.3,0.3-0.7,0.5-1.1,0.5 C8.9,19.9,8.5,19.7,8.2,19.4L8.2,19.4z M14.1,6.1c0,0.7,0.5,1.3,1.2,1.3c0.7,0,1.2-0.6,1.2-1.3c0-0.7-0.5-1.3-1.2-1.3 C14.6,4.8,14.1,5.4,14.1,6.1L14.1,6.1z M12.9,13.3v-1H21v1H12.9z'/></g></svg>",
    manageTagIcon: "<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><g transform='translate(94 -196)'><path d='M0,24V0H24V24Z' transform='translate(-94 196)' fill='none'/><path d='M8.271,20.582a2.008,2.008,0,0,1-1.462-.635l-6.2-6.5a2.243,2.243,0,0,1,0-3.064L10.516,0h9.129V9.016a7.112,7.112,0,0,0-8.907,9.879L9.733,19.948A2.008,2.008,0,0,1,8.271,20.582ZM16.026,2.166a1.591,1.591,0,0,0-1.551,1.625,1.553,1.553,0,1,0,3.1,0A1.592,1.592,0,0,0,16.026,2.166Z' transform='translate(-93.999 197)' fill='#e64a19'/><g transform='translate(-93 196)'><path d='M36.564,26.333a.254.254,0,0,0-.252.225L36.2,27.57a3.974,3.974,0,0,0-1.3.752l-.937-.406a.252.252,0,0,0-.318.107L32.7,29.644a.254.254,0,0,0,.068.33l.807.6a3.827,3.827,0,0,0,0,1.52l-.807.6a.253.253,0,0,0-.068.33l.938,1.621a.251.251,0,0,0,.318.105l.938-.4a3.956,3.956,0,0,0,1.3.752l.117,1.012a.254.254,0,0,0,.252.225h1.871a.254.254,0,0,0,.252-.225L38.8,35.1a3.974,3.974,0,0,0,1.3-.752l.938.406a.252.252,0,0,0,.318-.107l.938-1.621a.254.254,0,0,0-.068-.33l-.807-.6a3.827,3.827,0,0,0,0-1.52l.807-.6a.253.253,0,0,0,.068-.33l-.937-1.621a.252.252,0,0,0-.318-.107l-.937.406a3.974,3.974,0,0,0-1.3-.752l-.117-1.012a.254.254,0,0,0-.252-.225Zm.936,3a2,2,0,1,1-2,2A2,2,0,0,1,37.5,29.333Z' transform='translate(-21.5 -14.333)' fill='#e64a19'/></g></g></svg>",
    customizeIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none' /><g fill='#3498db'><path d='M35.83333,14.33333c-7.90483,0 -14.33333,6.4285 -14.33333,14.33333v114.66667c0,7.90483 6.4285,14.33333 14.33333,14.33333h55.06576c-2.12133,-4.45767 -4.17526,-9.2665 -4.89909,-14.33333v-28.66667h4.89909c2.55133,-5.36783 5.99044,-10.21967 10.1901,-14.33333h-15.08919v-28.66667h35.83333v16.44694c4.54367,-1.3545 9.34533,-2.11361 14.33333,-2.11361v-57.33333c0,-7.90483 -6.4285,-14.33333 -14.33333,-14.33333zM35.83333,28.66667h35.83333v28.66667h-35.83333zM86,28.66667h35.83333v28.66667h-35.83333zM35.83333,71.66667h35.83333v28.66667h-35.83333zM129.46191,100.33333c-0.9245,0 -1.69816,0.69236 -1.80566,1.6097l-0.83985,7.25065c-3.46867,1.204 -6.6061,3.03833 -9.32226,5.389l-6.71875,-2.91146c-0.84567,-0.3655 -1.82291,-0.02564 -2.28157,0.76986l-6.71875,11.61784c-0.45867,0.7955 -0.24826,1.81373 0.48991,2.36556l5.78093,4.2972c-0.344,1.77017 -0.5459,3.58166 -0.5459,5.44499c0,1.86333 0.2019,3.67482 0.5459,5.44499l-5.78093,4.2972c-0.73817,0.55183 -0.95574,1.57006 -0.48991,2.36556l6.71875,11.61784c0.45867,0.80267 1.43591,1.12136 2.28157,0.75586l6.71875,-2.89746c2.71617,2.35783 5.8536,4.185 9.32226,5.389l0.83985,7.25065c0.1075,0.91733 0.88116,1.6097 1.80566,1.6097h13.40951c0.9245,0 1.69816,-0.69236 1.80566,-1.6097l0.83985,-7.25065c3.46867,-1.204 6.6061,-3.03833 9.32226,-5.389l6.71875,2.91146c0.84567,0.3655 1.82291,0.02564 2.28157,-0.76986l6.71875,-11.61784c0.45867,-0.80267 0.24826,-1.82089 -0.48991,-2.36556l-5.78093,-4.2972c0.344,-1.77017 0.5459,-3.58166 0.5459,-5.44499c0,-1.86333 -0.2019,-3.67482 -0.5459,-5.44499l5.78093,-4.2972c0.73817,-0.55183 0.95574,-1.57006 0.48991,-2.36556l-6.71875,-11.61784c-0.45867,-0.7955 -1.43591,-1.13536 -2.28157,-0.76986l-6.71875,2.91146c-2.71617,-2.35067 -5.8536,-4.185 -9.32226,-5.389l-0.83985,-7.25065c-0.1075,-0.91733 -0.88116,-1.6097 -1.80566,-1.6097zM35.83333,114.66667h35.83333v28.66667h-35.83333zM136.16667,121.83333c7.912,0 14.33333,6.41417 14.33333,14.33333c0,7.912 -6.42133,14.33333 -14.33333,14.33333c-7.912,0 -14.33333,-6.42133 -14.33333,-14.33333c0,-7.91917 6.42133,-14.33333 14.33333,-14.33333z' /></g></g></svg>",
    adjustIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><g fill='#666666'><path d='M21.5,21.5v129h14.33333v-64.5v-64.5zM35.83333,86l21.5,21.5v-14.33333h57.33333v14.33333l21.5,-21.5l-21.5,-21.5v14.33333h-57.33333v-14.33333zM136.16667,86v64.5h14.33333v-129h-14.33333z'/></g></g></svg>",
    logIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><g><path d='M118.25,150.5h-100.33333v-136.16667h68.08333l32.25,32.25z' fill='#90caf9'/><path d='M112.875,50.16667h-30.45833v-30.45833z' fill='#e1f5fe'/><path d='M123.66684,134.66311l7.09451,-7.09476l30.40612,30.40506l-7.09451,7.09476z' fill='#616161'/><path d='M100.33333,64.5c-21.76922,0 -39.41667,17.64744 -39.41667,39.41667c0,21.76922 17.64744,39.41667 39.41667,39.41667c21.76922,0 39.41667,-17.64744 39.41667,-39.41667c0,-21.76922 -17.64744,-39.41667 -39.41667,-39.41667z' fill='#616161'/><path d='M100.33333,71.66667c-17.81118,0 -32.25,14.43882 -32.25,32.25c0,17.81118 14.43882,32.25 32.25,32.25c17.81118,0 32.25,-14.43882 32.25,-32.25c0,-17.81118 -14.43882,-32.25 -32.25,-32.25z' fill='#90caf9'/><path d='M132.07102,142.9014l7.09451,-7.09476l22.04444,22.04367l-7.09451,7.09476z' fill='#37474f'/><g fill='#1976d2'><path d='M107.5,111.08333h-34.75833c1.43333,5.73333 4.65833,10.75 8.95833,14.33333h25.8zM72.74167,96.75h34.75833v-14.33333h-26.15833c-4.3,3.58333 -7.16667,8.6 -8.6,14.33333zM72.025,71.66667h-32.60833v7.16667h26.15833c1.79167,-2.50833 3.94167,-5.01667 6.45,-7.16667zM61.275,86h-21.85833v7.16667h19.35c0.71667,-2.50833 1.43333,-5.01667 2.50833,-7.16667zM57.33333,103.91667c0,-1.075 0,-2.50833 0.35833,-3.58333h-18.275v7.16667h18.275c-0.35833,-1.075 -0.35833,-2.50833 -0.35833,-3.58333zM58.76667,114.66667h-19.35v7.16667h21.85833c-1.075,-2.15 -1.79167,-4.65833 -2.50833,-7.16667z'/></g></g></g></svg>",
    xlsxIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 588.6 588.6' xml:space='preserve'><g><path fill='#2e7d32' d='M359,537.8c0.8,0.1,1.6,0.1,2.3,0.1h178.2c20.8,0,37.8-17,37.8-37.8V87c0-20.8-17-37.8-37.8-37.8H361.4 c-0.8,0-1.6,0.1-2.3,0.1V0L11.2,46.4V541L359,588.6V537.8z M361.4,70.8h178.2c8.9,0,16.2,7.3,16.2,16.2v413.1 c0,8.9-7.3,16.2-16.2,16.2H361.4c-0.8,0-1.6-0.1-2.3-0.2V397.2h179.7V229.9H359V71C359.8,70.9,360.6,70.8,361.4,70.8z M443.8,356.7 v35.1h-84.2v-35.1H443.8z M359.7,310.8v-35.1h84.2v35.1H359.7z M533.4,275.8v35.1h-84.1v-35.1H533.4z M449.2,270.4v-35.1h84.1v35.1 H449.2z M533.4,356.7v35.1h-84.1v-35.1H533.4z M77.7,339.2L70.5,323c-2.9-6.2-4.8-10.8-7-15.9l-0.2,0c-1.6,5-3.6,9.5-6,15.5L51,338 l-19.4-0.8l21.8-42.8l-21-42.1l19.5-0.5l6.7,15.7c2.3,5.3,4,9.5,5.9,14.4h0.2c1.9-5.6,3.4-9.5,5.3-14.6l6.7-16.2l20.8-0.6L74.9,294 l24,46L77.7,339.2z M163.3,342.8l-54.4-2.3v-90.3l19.3-0.5v74.3l35.1,1V342.8z M198.5,345.7c-10.8-0.5-21.3-3.7-26.6-6.9l4.2-17.6 c5.6,3.1,14.4,6.4,23.6,6.6c10,0.3,15.4-3.7,15.4-10.1c0-6.1-4.6-9.6-16.2-14c-15.7-5.7-25.8-14.5-25.8-28.3 c0-16.2,13.2-28.9,35.8-29.6c11-0.3,19.3,1.8,25.2,4.3l-5.1,18.2c-4-1.8-11-4.5-20.6-4.4c-9.4,0.1-13.9,4.5-13.9,9.5 c0,6.1,5.4,8.8,17.8,13.6c17.4,6.5,25.8,15.6,25.8,29.6C238.2,333.3,225.2,346.8,198.5,345.7z M310.3,349l-10-19.2 c-4.1-7.3-6.7-12.8-9.7-18.8h-0.3c-2.3,5.9-5,11.2-8.3,18.2l-8.9,18.2l-26.9-1.1l30.2-50.4l-29.1-49.6l27.1-0.8l9.4,18.5 c3.2,6.2,5.6,11.2,8.2,17h0.3c2.6-6.6,4.7-11.2,7.5-17.2l9.4-19.2l29.3-0.8l-32,51.7l33.7,54.7L310.3,349z'/></g></svg>",
    importIcon: "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><defs><style>.cls-1{fill:none;}.cls-2{fill:#009688;}</style></defs><title>upload</title><g data-name='Layer 2'><g data-name='Layer 1'><path class='cls-1' d='M0,24V0H24V24Z'/><path class='cls-2' d='M12,5.45,17.5,12H6.5ZM10,20h4v2H10Zm0-3h4v2H10Z'/><path class='cls-2' d='M10,10.5h4V16H10ZM3,2H21V4H3Z'/></g></g></svg>",
    exportIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172' style='fill:#3c7cca;'><g fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><path d='M80.625,21.5v86.83984l-12.26172,-12.26172l-7.72656,7.55859l25.36328,25.36328l25.36328,-25.36328l-7.72656,-7.55859l-12.26172,12.26172v-86.83984zM10.75,123.625v26.875h150.5v-26.875h-10.75v16.125h-129v-16.125z'/></g></svg>",
    prevIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 172 172' xml:space='preserve'><g><path fill='none' d='M0,172V0h172v172H0z'/><g><path fill='#34495E' d='M58.9,53.2L91.6,86l-32.8,32.8l10.8,10.8L113.1,86L69.6,42.5L58.9,53.2z'/></g></g></svg>",
    nextIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><g fill='#34495e'><path d='M93.16667,42.49609l-43.50391,43.50391l43.50391,43.5039l10.75,-10.75l-32.75391,-32.7539l32.75391,-32.75391z'/></g></g></svg>",
    goIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' font-family='none' font-weight='none' font-size='none' text-anchor='none' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><g fill='#7f8080'><path d='M86,14.33333c-39.5815,0 -71.66667,32.08517 -71.66667,71.66667c0,39.5815 32.08517,71.66667 71.66667,71.66667c39.5815,0 71.66667,-32.08517 71.66667,-71.66667c0,-39.5815 -32.08517,-71.66667 -71.66667,-71.66667zM121.83333,93.16667h-47.19967l16.43317,16.43317l-10.13367,10.13367l-33.7335,-33.7335l33.7335,-33.7335l10.13367,10.13367l-16.43317,16.43317h47.19967z'/></g></g></svg>",
    loadingIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='40px' height='40px' viewBox='0 0 50 50' xml:space='preserve'><path fill='#000' d='M43.935,25.145c0-10.318-8.364-18.683-18.683-18.683c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615c8.072,0,14.615,6.543,14.615,14.615H43.935z'><animateTransform attributeType='xml' attributeName='transform' type='rotate' from='0 25 25' to='360 25 25' dur='0.6s' repeatCount='indefinite'></animateTransform></path></svg>",
    indicatorIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 20 20' class='move' style='fill:#666766;' xml:space='preserve'><g><circle cx='12.6' cy='4.3' r='2'/><circle cx='7.4' cy='4.3' r='2'/><circle cx='12.6' cy='10' r='2'/><circle cx='7.4' cy='10' r='2'/><circle cx='12.6' cy='15.7' r='2'/><circle cx='7.4' cy='15.7' r='2'/></g></svg>",
    leftIcon: "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' xml:space='preserve'><path d='M15.8,7.4l-1.5-1.5L8.2,12l6.1,6.1l1.5-1.5L11.2,12L15.8,7.4z'/></svg>",
    tagIcon: "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172' style='fill: #3498db;'><g><path d='M0,172v-172h172v172z' fill='none'/><path d='M105.94629,28.66667l-58.50911,58.50911c-5.9125,5.9125 -5.9125,15.51752 0,21.43002l30.29036,30.29036c5.9125,5.9125 15.51752,5.9125 21.43002,0l58.50911,-58.50911v-51.72038zM67.10352,30.76628l-55.73763,55.73763c-5.53686,5.53686 -5.54737,14.74905 0,20.28223l38.43685,38.43685l10.13411,-10.13412l-38.43685,-38.45084l55.73763,-55.73763zM136.16667,43c3.956,0 7.16667,3.21067 7.16667,7.16667c0,3.956 -3.21067,7.16667 -7.16667,7.16667c-3.956,0 -7.16667,-3.21067 -7.16667,-7.16667c0,-3.956 3.21067,-7.16667 7.16667,-7.16667z'/></g></svg>"
}

jQuery.fn.extend({
    gridBuilder: function (option) {
        var UserEvent = (function () {
            function UserEvent(event) {
                this.event = event;
                if (event.originalEvent && event.originalEvent.touches && event.originalEvent.changedTouches) {
                    this.event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0];
                    this.isTouchEvent = true;
                }
            }
            return UserEvent;
        })();
        var JsGridView = (function () {
            function jsGridView(target, parameters) {
                if (!parameters) {
                    parameters = {
                        checkedRecordAll: false,
                        expandable: false,
                        canModify: true,
                        editable: false,
                        multiSelect: false,
                        offlinePaging: false,
                        offlinePagingSortable: false,
                        exportExcel: false,
                        groupingName: "",
                        sortByFields: "",
                        async: true,
                        pageSize: window.top.gridPageRecordCount ? window.top.gridPageRecordCount : 100,
                        popupMenuItems: null,
                        isLeftToRight: window.top.isLeftToRight ? true : false,
                        withLogData: false,
                    };
                }
                this.sortByFields = parameters.sortByFields;
                this.checkedRecordAll = parameters.checkedRecordAll === undefined ? false : parameters.checkedRecordAll;
                this.chromeOldVersion = this.isChromeOldVersion();
                this.mongoDbLogAddress = parameters.mongoDbLogAddress;
                this.resetTime = null;
                this.resetTimeFocus = null;
                this.resetTimeScroll = null;
                this.async = parameters.async === undefined || parameters.async ? true : false;
                this.canModify = parameters.canModify === undefined || parameters.canModify ? true : false;
                this.baseUrl = parameters.baseUrl ? parameters.baseUrl : (window.top.baseUrl ? window.top.baseUrl : "../");
                this.enabled = true;
                this.offsetX = 5;
                this.offsetY = 5;
                this.container = target;
                this.isLeftToRight = parameters.isLeftToRight === undefined ? (window.top.isLeftToRight ? true : false) : parameters.isLeftToRight;
                this.editable = parameters.editable ? true : false;
                this.withLogData = this.editable && (parameters.withLogData === undefined || parameters.withLogData) ? true : false;
                this.expandable = !this.editable && parameters.expandable ? true : false;
                this.multiSelect = !this.editable && parameters.multiSelect ? true : false;
                this.offlinePaging = this.editable || this.grouping || this.groupingName || parameters.offlinePaging;
                this.offlinePagingSortable = !this.editable && parameters.offlinePagingSortable ? true : false;
                this.exportExcel = parameters.exportExcel ? true : false;
                this.pageSize = parameters.pageSize ? parameters.pageSize : (window.top.gridPageRecordCount ? window.top.gridPageRecordCount : 100);
                this.popupMenuItems = !parameters.grouping ? parameters.popupMenuItems : null;
                this.noPaging = parameters.noPaging;
                this.grouping = parameters.grouping ? true : false;
                this.groupingName = parameters.groupingName && this.offlinePaging ? parameters.groupingName : "";
                this.columnHeaderGrouping = !this.grouping && !this.groupingName && parameters.columnHeaderGrouping ? true : false;
                this.offlineRecordsJson = [];
                this.filterRecordsJson = null;
                this.shortKeys = [];

                this.comboChangedEvents = null;
                this.keyField = target.attr("data-key") ? target.attr("data-key") : null;
                this.entityName = target.attr("data-entity") ? target.attr("data-entity") : null;
                this.hasTag = !this.editable && this.entityName && !this.offlinePaging;
                this.tagExistsDepth = this.hasTag && parameters.tagExistsDepth ? parameters.tagExistsDepth : null;
                this.keepSelection = this.multiSelect && !this.grouping && this.keyField ? true : false;
                this.selectionList = [];
                this.selectionViewMode = false;
                this.defaultExtendedColumns = null;
                this.defaultColumns = null;
                this.defaultColumnsCaption = null;
                this.defaultColumnsWidth = null;
                this.workingScrollLazyLoading = false;
                this.lastStatus = null;
                this.dataStartLazy = 0;
                this.rowHeight = 27;
                this.manualScrollTop = null;
                this.existScroll = false;

                this.getComboData = null;
                this.dblClick = null;
                this.cellChanged = null;
                this.pageChanged = null;
                this.cellClick = null;
                this.rowChanged = null;
                this.rowEnterPress = null;
                this.cellBeforeLostFocus = null;
                this.actionClick = null;
                this.pgmSumChanged = null;
                this.selectedChanged = null;
                this.afterLoaded = null;
                this.dragRowChanged = null;
                this.exportClick = null;
                this.importClick = null;
                this.expandChanged = null;
                this.startEditing = null;
                this.setMaskEdit = null;
                this.customizeFieldClick = null;
                this.getTreeTag = null;
                this.saveTagRelatedTree = null;
                this.saveTagManageTree = null;
                this.displayItemTags = null;
                this.resetTimeDisplayItemTags = null;
                this.menuMoreClick = null;
                this.actionMenuMoreClick = null;
                this.openCalculator = null;

                var that = this;
                if (this.grouping)
                    if (this.container.find(".grouping").length === 0)
                        this.container.prepend("<div class='grouping'><div class='grouping-tags-box'><ul class='grouping-tags'><li class='grouping-drag-help'>" + gridBuilderGlobal.dictionary.groupingDragHelp + "</li></ul></div></div>");
                if (this.columnHeaderGrouping)
                    if (this.container.find(".header-grouping").length === 0)
                        this.container.prepend("<div class='header-grouping'></div>");
                this.container.find(".grouping-tags").sortable({
                    handle: ".img-drag",
                    revert: true,
                    forceHelperSize: true,
                    forcePlaceholderSize: true,
                    tolerance: "pointer",
                    axis: "x",
                    update: function () {
                        that.resetPaging();
                    }
                }).disableSelection();

                if (this.popupMenuItems && this.popupMenuItems.length > 0) {
                    var contextMenuHml = "<div id='" + this.getId() + "popup' class='context-menu-container'>";
                    this.popupMenuItems.forEach(function (item) {
                        contextMenuHml += "<div " + (item.Visible ? "" : "hidden='hidden'") + " onmousedown=\"" + item.EventName + "\">" + item.Name + "<span data-key='" + item.ShortKey.split(":")[0] + "'>" + (item.ShortKey ? " (" + item.ShortKey.split(":")[1] + ")" : "") + "</span></div>";
                        if (item.ShortKey)
                            that.shortKeys.push(item.ShortKey.split(":")[0]);
                    });
                    contextMenuHml += "</div>";
                    $("body").append(contextMenuHml);
                }
                if (this.multiSelect && $("#" + this.getId() + "selection.context-menu-container").length === 0) {
                    var contextMenuHml = "<div id='" + this.getId() + "selection' class='context-menu-container'><div data-value='current'>" + gridBuilderGlobal.dictionary.selectCurrentRecord + "</div><div data-value='all'>" + gridBuilderGlobal.dictionary.selectRecordAll + "</div></div>";
                    contextMenuHml += "</div>";
                    $("body").append(contextMenuHml);
                }
                if ($("#" + this.getId() + "popup.context-menu-container").length === 1) {
                    if (!this.grouping) {
                        $("#" + this.getId() + "popup.context-menu-container span[data-key]").each(function () {
                            var key = $(this).attr("data-key");
                            that.shortKeys.push(key);
                            if (!$(this).parent().attr("onmousedown")) {
                                if (key === "ctrlkey+45") {
                                    $(this).parent().attr("onmousedown", "var gridBuilder=$('#" + that.getId() + "').gridBuilder();gridBuilder.addNewRow();gridBuilder.hideContextMenu();gridBuilder.setEditRow(gridBuilder.getActiveRowIndex(), 0, true);").attr("onmouseup", "event.stopPropagation();");
                                }
                                else if (key === "ctrlkey+46") {
                                    $(this).parent().attr("onmousedown", "var gridBuilder=$('#" + that.getId() + "').gridBuilder();gridBuilder.endEditGrid();gridBuilder.deleteRow(gridBuilder.getActiveRowIndex());gridBuilder.hideContextMenu();").attr("onmouseup", "event.stopPropagation();");
                                }
                                else if (key === "shiftkey+ctrlkey+45") {
                                    $(this).parent().attr("onmousedown", "var gridBuilder=$('#" + that.getId() + "').gridBuilder();gridBuilder.endEditGrid();gridBuilder.copyRow(gridBuilder.getActiveRowIndex());gridBuilder.hideContextMenu();").attr("onmouseup", "event.stopPropagation();");
                                }
                            }
                        });
                    }
                    else
                        $("#" + this.getId() + "popup.context-menu-container").remove();
                }
                var imgNewRow = "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 172 172'><g fill='none' fill-rule='nonzero' stroke='none' stroke-width='1' stroke-linecap='butt' stroke-linejoin='miter' stroke-miterlimit='10' stroke-dasharray='' stroke-dashoffset='0' style='mix-blend-mode: normal'><path d='M0,172v-172h172v172z' fill='none'/><g fill='#666666'><g><path d='M86,16.125c-38.52783,0 -69.875,31.34717 -69.875,69.875c0,38.52783 31.34717,69.875 69.875,69.875c38.52783,0 69.875,-31.34717 69.875,-69.875c0,-38.52783 -31.34717,-69.875 -69.875,-69.875zM86,26.875c32.71192,0 59.125,26.41309 59.125,59.125c0,32.71192 -26.41308,59.125 -59.125,59.125c-32.71191,0 -59.125,-26.41308 -59.125,-59.125c0,-32.71191 26.41309,-59.125 59.125,-59.125zM80.625,59.125v21.5h-21.5v10.75h21.5v21.5h10.75v-21.5h21.5v-10.75h-21.5v-21.5z'/></g></g></g></svg>";
                if (this.editable) {
                    if (this.canModify) {
                        this.container.find("tbody").append("<tr class='grid-empty'><td><div>" + imgNewRow + gridBuilderGlobal.dictionary.insertKeyForNewRow + "</div></td></tr>");
                    }
                    this.container.find("tbody").append("<tr class='grid-row-lazy'><td></td></tr>");

                    var gridComboHtml = "<input class='combo-text' type='text' /><div data-toggle='dropdown' data-bs-toggle='dropdown'><span class='combo-caret'></span></div><div class='combo-dropdown-menu'><ul></ul><div class='loading'>" + gridBuilderGlobal.loadingIcon + "</div><div class='combo-status'><span class='record-count'>0</span>" + gridBuilderGlobal.dictionary.item + "</div></div><span></span>";
                    this.container.find("tbody tr.row-edit td").each(function (index, column) {
                        var $column = $(column);
                        if ($column.children().length > 0) {
                            var $child = $($column.children()[0]);
                            if ($child.attr("id")) {
                                $child.attr("data-edit-id", $child.attr("id"));
                                $child.removeAttr("id");
                            }
                        }
                        $column.attr("tabindex", 1000 + index);
                        var $select = $column.find("select");
                        if ($select.length === 1) {
                            $select.html("");
                            var outerHtml = $select[0].outerHTML.replaceAll("<select", "<div").replaceAll("</select>", "</div>");
                            $select = $(outerHtml);
                            $select.html(gridComboHtml);
                            if ($select.attr("data-grid-mask"))
                                $select.find(".combo-text").attr("data-grid-mask", $select.attr("data-grid-mask"));
                            else
                                $select.find(".combo-text").removeAttr("data-grid-mask");
                            $column.html($select);
                        }
                        if ($column.attr("disabled"))
                            $column.find("input").attr("disabled", "disabled");
                        else
                            $column.find("input").removeAttr("disabled");

                        var width = that.container.find("thead td:eq(" + index + ")").css("width");
                        $column.css({ "min-width": width, "width": width });
                    });


                }
                this.addFilterRow();
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function () {
                    var width = $(this).width();
                    var text = $(this).text();
                    $(this).html("");
                    $(this).append("<div style='min-width:" + (width - (that.editable ? 5 : 15)) + "px; width:" + (width - (that.editable ? 5 : 15)) + "px;' class='text' title='" + text + "'>" + text + "</div>");
                });

                if (this.editable && this.canModify) {
                    this.container.find("thead tr:not('.row-filter')").prepend("<td class='column-delete-row'></td>");
                    this.container.find("tbody tr.row-edit").prepend("<td tabindex='199999' class='column-delete-row'></td>");
                }

                if ($("#" + this.getId() + "popup.context-menu-container").length === 1) {
                    this.container.find("thead tr:not('.row-filter')").prepend("<td class='column-context-menu'></td>");
                    this.container.find("tbody tr.row-edit").prepend("<td tabindex='199998' class='column-context-menu'></td>");
                }
                this.container.find("thead tr:not('.row-filter')").prepend("<td class='column-select" + (!this.multiSelect ? " without-checked" : "") + "'>" + (this.multiSelect ? "<input type='checkbox' class='checkbox-control' />" : "") + "</td>");
                this.container.find("tbody tr.row-edit").prepend("<td class='column-select" + (!this.multiSelect ? " without-checked" : "") + "'></td>");

                if (this.expandable) {
                    this.container.find("thead tr:not('.row-filter')").prepend("<td class='column-expandable'></td>");
                    this.container.find("tbody tr.row-edit").prepend("<td class='column-expandable'></td>");
                }

                if (this.hasTag) {
                    this.container.find("thead tr:not('.row-filter') .column-select").after("<td class='column-tag'></td>");
                    this.container.find("tbody tr.row-edit .column-select").prepend("<td class='column-tag'></td>");
                }

                this.container.find("thead tr:not('.row-filter') td[data-id] .sort-count").remove();
                this.container.find("thead tr:not('.row-filter') td[data-id] .resize").remove();
                this.container.find("thead tr:not('.row-filter') td[data-id]").append("<div class='sort-no'></div>");
                this.container.find("thead tr:not('.row-filter') td[data-id]").append("<div class='resize'>&nbsp;</div>");

                if (this.sortByFields && this.sortByFields.split(",").length > 1) {
                    var $thead = this.container.find("thead");
                    $thead.find("td.arrow-down,td.arrow-up,td .sort-no").addClass("multiple");
                    this.sortByFields.split(",").forEach(function (fieldName, index) {
                        fieldName = fieldName.replace("[", "").replace("]", "").replace(" desc", "").replace(" asc", "").replace(" Desc", "").replace(" Asc", "");
                        $thead.find("tr:not('.row-filter') td[data-id='" + fieldName + "'] .sort-no").text(index + 1);
                    });
                }

                this.container.append("<div class='grid-loading'>" + gridBuilderGlobal.loadingIcon + "</div>");

                var $tableBody = this.container.find("table");
                $tableBody.addClass("table-body");
                if (this.grouping)
                    $tableBody.addClass("with-grouping");

                var $tableHead = $("<table>");
                $tableHead.addClass("table-header");
                if ($tableBody.hasClass("with-grouping"))
                    $tableHead.addClass("with-grouping");
                if ($tableBody.hasClass("with-header-grouping"))
                    $tableHead.addClass("with-header-grouping");
                if (this.editable)
                    $tableBody.addClass("without-footer");
                $tableHead.append(this.container.find("thead"));
                $tableBody.before($tableHead);

                if (this.container.find(".grid-header").length === 0) {

                    var $gridHeader = $("<div>");
                    $gridHeader.addClass("grid-header");
                    if ($tableBody.hasClass("with-grouping"))
                        $gridHeader.addClass("with-grouping");
                    if ($tableBody.hasClass("with-header-grouping"))
                        $gridHeader.addClass("with-header-grouping");
                    $gridHeader.append("<div class='grid-title'><span class='grid-caption'></span>(<span class='grid-title-count'>" + gridBuilderGlobal.dictionary.item + ":</span><span class='grid-count'>0</span>)</div>");
                    var $gridButtons = $("<div>");
                    $gridButtons.addClass("grid-header-buttons");

                    var $menu = $("<ul>");
                    if (!this.editable)
                        $menu.append("<li class='customize-field'><a><div>" + gridBuilderGlobal.customizeIcon + "</div>" + gridBuilderGlobal.dictionary.changeField + "</a></li>");
                    $menu.append("<li class='adjust-field'><a><div>" + gridBuilderGlobal.adjustIcon + "</div>" + gridBuilderGlobal.dictionary.autoAlignColumns + "</a></li>");
                    if (this.editable)
                        $menu.append("<li class='sample-excel'><a><div style='padding: 2px;'>" + gridBuilderGlobal.xlsxIcon + "</div>" + gridBuilderGlobal.dictionary.getExcelSample + "</a></li>");
                    if (this.exportExcel)
                        $menu.append("<li class='export-excel'><a><div style='padding: 2px;'>" + gridBuilderGlobal.xlsxIcon + "</div>" + gridBuilderGlobal.dictionary.excelOutput + " (xlsx)</a></li>");
                    if (this.editable) {
                        $menu.append("<li class='import-excel'><a><div style='padding: 2px;'>" + gridBuilderGlobal.xlsxIcon + "</div>" + gridBuilderGlobal.dictionary.importFromExcel + " (xlsx)</a></li>");
                        $menu.append("<li class='export-xml'><a><div style='padding: 2px;'>" + gridBuilderGlobal.exportIcon + "</div>" + gridBuilderGlobal.dictionary.fileOutputOffline + "</a></li>");
                        $menu.append("<li class='import-xml'><a><div style='padding: 2px;'>" + gridBuilderGlobal.importIcon + "</div>" + gridBuilderGlobal.dictionary.fileInputOffline + "</a></li>");
                    }
                    if (this.hasTag)
                        $menu.append("<li class='manage-tag'><a><div style='padding: 2px;'>" + gridBuilderGlobal.manageTagIcon + "</div>" + gridBuilderGlobal.dictionary.manageTags + "</a></li>");
                    var $menuManual = this.container.find(".dropdown-menu ul");
                    if ($menuManual.length === 1) {
                        $menu.append($menuManual.html());
                        $menuManual.parent().remove();
                    }

                    $gridButtons.append("<div class='container-more'><div class='ico-more dropdown-toggle' data-toggle='dropdown'>" + gridBuilderGlobal.moreIcon + "</div><ul class='dropdown-menu'>" + $menu.html() + "</ul></div>");
                    $gridButtons.append("<div class='ico-filter'>" + gridBuilderGlobal.filterIcon + "</div>");
                    if (!this.editable && !this.offlinePaging)
                        $gridButtons.append("<div class='ico-refresh'>" + gridBuilderGlobal.refreshIcon + "</div>");

                    if (this.hasTag) {
                        $gridButtons.append("<div class='ico-tag-related'>" + gridBuilderGlobal.relatedTagIcon + "</div>");
                        $gridButtons.append("<div class='ico-tag-filter'>" + gridBuilderGlobal.filterTagIcon + "</div>");
                    }
                    var $buttons = this.container.find(".buttons");
                    if ($buttons.length === 1)
                        $gridButtons.append($buttons.html());

                    $gridHeader.append($gridButtons);
                    $menu.remove();
                    $buttons.remove();

                    $tableHead.before($gridHeader);
                }
                var $groupHeader = null;
                var groupColumns = [];
                if ($(".table-header-grouping").length == 0)
                    groupColumns = this.container.find("thead tr:not('.row-filter') td[data-id][data-group]");
                if (groupColumns.length > 0) {
                    $groupHeader = $("<div></div>");
                    $groupHeader.addClass("table-header-grouping");
                    $groupHeader.append("<div class='column-select " + (this.multiSelect ? "" : "without-checked") + "'></div>");
                }
                if ($groupHeader) {
                    this.container.find(".grid-header").before($groupHeader);
                    if (groupColumns.length > 0)
                        $tableBody.addClass("with-header-grouping");
                    if ($tableBody.hasClass("with-header-grouping"))
                        $tableHead.addClass("with-header-grouping");
                    this.reGroupingHeader();
                }
                if (this.editable && this.canModify) {
                    this.container.find(".grid-header-buttons").append("<div class='container-button grid-button-new' onclick='$(\"#" + this.getId() + " .grid-empty svg\").trigger(\"click\")' style='position:absolute;width:100px;height:25px;top:3px;right: 119px;font-size:9pt;background-color:#e0e0e0 !important;'><button type='button' class='system-button-control grid-new-row text-ellipsis' style='width:100%;height:100%;' tabindex='-1'>" + imgNewRow + gridBuilderGlobal.dictionary.newRow + "</button></div>");
                }
                if (!this.editable && !this.noPaging && this.container.find(".grid-footer").length === 0) {
                    var $gridFooter = $("<div>");
                    $gridFooter.addClass("grid-footer");
                    $gridFooter.append("<div class='ico-prev'>" + gridBuilderGlobal.prevIcon + "</div><span class='page-no'> 1</span ><span>" + gridBuilderGlobal.dictionary.from + "</span><span class='page-end'>1</span><div class='ico-next'>" + gridBuilderGlobal.nextIcon + "</div><input type='text' placeholder='" + gridBuilderGlobal.dictionary.goto + "'><div class='ico-go'>" + gridBuilderGlobal.goIcon + "</div><div class='grid-selection-delete'></div><div class='grid-selection'></div>");
                    this.container.append($gridFooter);
                }
                if (this.groupingName) {
                    var $groupContainer = $("<div>");
                    $groupContainer.addClass("grouping");
                    this.groupingName.split(",").forEach(function (column) {
                        that.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                            if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase()) {
                                that.selectedHeader = $(cell);
                                that.dropColumn($groupContainer);
                            }
                        });

                    });
                }
                this.rebind();
            }
            jsGridView.prototype.reGroupingHeader = function () {
                var $groupHeader = $(".table-header-grouping");
                if ($groupHeader.length == 0)
                    return;
                var lastGroupName = "";
                $groupHeader.find(">div:not(.column-select)").remove();
                var groupColumns = this.container.find("thead tr:not('.row-filter') td[data-id][data-group]:not([hidden])");
                this.container.find("thead tr:not('.row-filter') td[data-id]:not([hidden])").each(function () {
                    if (groupColumns.length > 0) {
                        var groupName = $(this).attr("data-group");
                        if (groupName && groupName !== lastGroupName) {
                            var groupWidth = 0;
                            groupColumns.each(function (index, item) {
                                if ($(item).attr("data-group") === groupName)
                                    groupWidth += $(item).outerWidth();
                            });
                            $groupHeader.append("<div data-group=" + groupName + " style='min-width:" + groupWidth + "px;width:" + groupWidth + "px'>" + groupName + "</div>");
                            lastGroupName = groupName;
                        }
                    }
                });
            };

            jsGridView.prototype.getId = function () {
                return this.container.attr("id");
            };
            jsGridView.prototype.getTags = function () {
                return this.container.attr("data-tags");
            };
            jsGridView.prototype.loadRelatedTreeTag = async function () {
                var rowIndex = this.getActiveRowIndex();
                if (this.getActiveRowIndex() === -1) {
                    alert(gridBuilderGlobal.dictionary.noSelectedItem);
                    return;
                }
                var that = this;
                var $tree = this.tagRelatedTreeView();
                var jstree = $tree.jstree(true);
                if (this.getTreeTag) {

                    var keyFields = that.keyField.split(",");
                    var keyValues = [];
                    keyFields.forEach(function (item) {
                        keyValues.push(that.getCellValue(rowIndex, item));
                    });
                    var dataSet = await this.getTreeTag(that.entityName, keyFields, keyValues, "tag-related");
                    if (jstree) {
                        jstree.settings.core.data = dataSet;
                        jstree.refresh(false, true);
                    }
                    else {
                        $tree.jstree({
                            checkbox: {
                                tie_selection: false,
                                whole_node: false,
                                keep_selected_style: false
                            },
                            plugins: [
                                "checkbox"
                            ],
                            core: {
                                data: dataSet
                            }
                        }).bind("loaded.jstree",
                            function () {
                                jstree = $tree.jstree(true);
                                jstree.open_all();
                                that.tagRelatedContainer().toggle();
                            }).bind("refresh.jstree",
                                function () {
                                    if (jstree) {
                                        jstree.open_all();
                                    }
                                    that.tagRelatedContainer().toggle();
                                });
                        if (!dataSet || dataSet.length === 0)
                            that.tagRelatedContainer().toggle();
                    }
                }
                else
                    that.tagRelatedContainer().toggle();
            };
            jsGridView.prototype.loadFilterTreeTag = async function () {
                var that = this;
                function setTags(dataSet, tags) {
                    if (dataSet && dataSet.length > 0) {
                        dataSet.forEach(function (node) {
                            node.state = { checked: tags.includes(node.id.split(":")[0]) };
                            setTags(node.children, tags);
                        });
                    }
                }
                var $tree = this.tagFilterTreeView();
                var jstree = $tree.jstree(true);
                if (this.getTreeTag) {
                    var keyFields = that.keyField.split(",");
                    var dataSet = await this.getTreeTag(that.entityName, keyFields, null, "tag-filter");
                    if (dataSet && dataSet.length > 0) {
                        var tagAttr = this.getTags();
                        var tags = tagAttr ? tagAttr.split(",") : [];
                        setTags(dataSet[0].children, tags);
                    }
                    if (jstree) {
                        jstree.settings.core.data = dataSet;
                        jstree.refresh(false, true);
                    } else {
                        $tree.jstree({
                            checkbox: {
                                tie_selection: false,
                                whole_node: false,
                                keep_selected_style: false
                            },
                            plugins: [
                                "checkbox"
                            ],
                            core: {
                                data: dataSet
                            }
                        }).bind("loaded.jstree",
                            function () {
                                jstree = $tree.jstree(true);
                                jstree.open_all();
                                that.tagFilterContainer().toggle();
                            }).bind("refresh.jstree",
                                function () {
                                    if (jstree) {
                                        jstree.open_all();
                                    }
                                    that.tagFilterContainer().toggle();
                                });
                        if (!dataSet || dataSet.length === 0)
                            that.tagFilterContainer().toggle();
                    }
                }
                else
                    that.tagFilterContainer().toggle();
            };
            jsGridView.prototype.loadManageTreeTag = async function () {
                var that = this;
                var $tree = this.tagManageTreeView();
                var jstree = $tree.jstree(true);
                if (this.getTreeTag) {
                    var keyFields = that.keyField.split(",");
                    var dataSet = await this.getTreeTag(that.entityName, keyFields, null, "tag-manage");
                    if (jstree) {
                        jstree.settings.core.data = dataSet;
                        jstree.refresh();
                    } else {
                        $tree.jstree({
                            checkbox: {
                                tie_selection: false,
                                whole_node: false,
                                keep_selected_style: true
                            },
                            core: {
                                check_callback: true,
                                dblclick_toggle: false,
                                multiple: false,
                                data: dataSet
                            }
                        }).bind("loaded.jstree",
                            function () {
                                jstree = $tree.jstree(true);
                                jstree.open_all();
                                jstree.deselect_all();
                                that.tagManageContainer().toggle();
                            }).bind("refresh.jstree",
                                function () {
                                    if (jstree) {
                                        jstree.open_all();
                                        jstree.deselect_all();
                                    }
                                    that.tagManageContainer().toggle();
                                }).bind("dblclick.jstree",
                                    function (event) {
                                        var node = $(event.target).closest("li").attr("id");
                                        jstree.edit(node);
                                    });
                        if (!dataSet || dataSet.length === 0)
                            that.tagManageContainer().toggle();
                    }
                }
                else
                    that.tagFilterContainer().toggle();
            };

            jsGridView.prototype.rebind = function () {
                var that = this;

                this.offEvents();

                this.container.find("td.column-select .move").removeAttr("hidden");
                this.container.find(".grid-footer .ico-summery .dropdown-menu li").on("click", async function () {
                    var actionFooter = "";
                    var dataField = $(this).attr("data-id");
                    that.container.find(".sum-footer [data-mask='price']:not([hidden])").each(function () {
                        actionFooter += (actionFooter !== "" ? "," : "") + $(this).attr("data-id") + "=" + dataField;
                    });
                    if (actionFooter) {
                        var dataSet = await loadGrid(that.getId(), { emptyOldData: false, actionFooter: actionFooter });
                        var action = actionFooter.split(",")[0].split("=")[1].substring(0, 3);
                        that.container.find(".grid-footer .ico-summery span.dropdown-toggle").html("<img src='" + that.baseUrl + "img/grid/" + action + ".svg' />");
                        var fields = actionFooter.split(",");
                        for (var i = 0; i < fields.length; i++) {
                            var fieldName = fields[i].split("=")[0];
                            var fieldValue = dataSet[fieldName];
                            that.container.find(".sum-footer div[data-id='" + fieldName + "']").text(numberWithCommas(fieldValue));
                        }
                        that.container.find(".sum-footer").show();
                        that.container.find("table").addClass("with-sum-footer");
                    }
                });
                this.container.find("thead tr:not('.row-filter')").on("mousedown touchstart", "td[data-id] .resize", function (event) {
                    event.stopPropagation();
                    var element = $(this).parent("td");
                    var startOffset = that.isLeftToRight ? event.pageX - element[0].offsetWidth : event.pageX + element[0].offsetWidth;
                    that.container.find("thead").attr("data-resize", $(element).index());
                    that.container.find("thead").attr("data-offset", startOffset);
                });
                this.container.find("thead tr:not('.row-filter')").on("mouseup touchend", "td[data-id] .resize", function (event) {
                    event.stopPropagation();
                    that.container.find("thead").removeAttr("data-resize").removeAttr("data-offset");
                });
                this.container.find("thead tr:not('.row-filter')").on("click", "td[data-id] .resize", function (event) { event.stopPropagation(); });
                this.container.find("thead tr:not('.row-filter')").on("dblclick", "td[data-id] .resize", function () {
                    var cellIndex = $(this).closest("td").index();
                    var $cellText = $(this).closest("td").find(".text");
                    $cellText.css({ "min-width": "auto", "width": "auto" });
                    var maxWidth = $cellText.width() + 8;
                    that.container.find("tbody " + gridBuilderGlobal.gridBodyRowsFind + " td:nth-child(" + (cellIndex + 1) + ") .text").each(function () {
                        $(this).css({ "min-width": "auto", "width": "auto" });
                        if ($(this).width() > maxWidth)
                            maxWidth = $(this).width();
                    });
                    that.resizeColumn(cellIndex, maxWidth + (this.editable ? 5 : 15));
                });

                this.container.find(".grid-empty svg").on("click", function () {
                    that.addNewRow();
                });
                $("#" + this.getId() + "selection.context-menu-container").on("mousedown", function (event) { event.stopPropagation(); });
                $("#" + this.getId() + "selection.context-menu-container>div").on("click", async function (event) {
                    event.stopPropagation();
                    $(this).parent().hide();

                    var $checkedAll = that.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                    var checkState = !$checkedAll.prop("checked");
                    var dataValue = $(this).attr("data-value");
                    that.setCheckAllState(checkState, dataValue);
                });
                if ($("#" + this.getId() + "popup.context-menu-container").length === 1) {
                    $("#" + this.getId() + "popup.context-menu-container").on("mousedown", function (event) { event.stopPropagation(); });
                    this.container.find("tbody").on("mousedown", gridBuilderGlobal.gridBodyRowsFind + " td.column-context-menu", function (event) {
                        event.stopPropagation();
                        var rowIndex = that.getIndexRow($(this).closest("tr").index());
                        var $popupMenu = $("#" + $(that.container).attr("id") + "popup.context-menu-container");
                        var top;
                        if (event.clientY + $popupMenu.height() < $(document).height())
                            top = event.clientY;
                        else
                            top = $(document).height() - $popupMenu.height() - 20;

                        $popupMenu.attr("data-row-index", rowIndex);
                        $popupMenu.css({ top: top, left: event.clientX + (that.isLeftToRight ? 10 : -1 * $popupMenu.width() - 10) });
                        $popupMenu.show();
                    }).on("mouseup", gridBuilderGlobal.gridBodyRowsFind + " td.column-context-menu", function (event) {
                        event.stopPropagation();
                    });
                }
                this.container.find("thead tr.row-filter").on("click", "td .ico-filter", function (event) {
                    event.stopPropagation();
                    $(".grid-filter").css("top", $(this).offset().top + 27);
                    var left = $(this).offset().left - $(".grid-filter").width();
                    if (left < that.container.offset().left + $(".grid-filter").width())
                        left = $(this).offset().left;
                    $(".grid-filter").css("left", left + 150);
                    const $input = $(this).parent("td").find("input");
                    $(".grid-filter").attr("data-target", $(this).parent("td").index());
                    $(".grid-filter").attr("data-grid", that.getId());

                    const dataFilter = $input.attr("data-filter");
                    var dataType = $input.attr("data-type");
                    $(".grid-filter>div").each(function () {
                        if (!$(this).attr("data-type") || $(this).attr("data-type").split(",").includes(dataType))
                            $(this).show();
                        else
                            $(this).hide();
                    });
                    $(".grid-filter .grid-filter-img").html("");
                    $(".grid-filter>div[data-filter='" + dataFilter + "'] .grid-filter-img").html(gridBuilderGlobal.filterIcon);
                    $(".grid-filter").show();
                });
                this.container.find("thead tr.row-filter").on("change", "td input[type='text']", function () {
                    that.resetPaging();
                });
                //this.container.find("thead tr.row-filter").on("keydown", "td input[type='text']", function (event) {
                //    if (event.keyCode === gridBuilderGlobal.enterKey) {
                //        event.stopPropagation();
                //    }
                //});
                this.container.find(".grid-header .ico-filter").on("click", function () {
                    var hiddenRowFilter = that.container.find("thead tr.row-filter").is(":hidden");
                    var top = Number(that.container.find("table.table-body").css("top").replace("px", ""));
                    if (hiddenRowFilter) {
                        $(this).html(gridBuilderGlobal.unFilterIcon);
                        that.container.find("thead tr.row-filter").show();
                        that.container.find("table.table-body").css("top", (top + 31) + "px");
                    } else {
                        $(this).html(gridBuilderGlobal.filterIcon);
                        that.container.find("thead tr.row-filter").hide();
                        that.container.find("table.table-body").css("top", (top - 31) + "px");
                        if (that.getFilter() !== "") {
                            that.container.find("thead tr.row-filter input[type='text']").val("");
                            that.container.find("thead tr.row-filter input[type='text'][data-filter='null']").attr("data-filter", "contains");
                            that.container.find("thead tr.row-filter input[type='text'][data-filter='not-null']").attr("data-filter", "contains");
                            that.resetPaging();
                        }
                    }
                });
                this.container.find(".grid-header .ico-refresh").on("click", function () {
                    that.selectionViewMode = false;
                    that.reload("refresh");
                });
                this.container.find(".grid-header .ico-tag-related").on("mousedown", function (event) {
                    event.stopPropagation();
                }).on("click", async function () {
                    that.tagFilterContainer().hide();
                    that.tagManageContainer().hide();
                    if (that.tagRelatedContainer().is(":hidden"))
                        await that.loadRelatedTreeTag();
                    else
                        that.tagRelatedContainer().toggle();
                });
                this.tagRelatedContainer().find(".label-manage").on("click", async function () {
                    that.tagManageContainer().toggle();
                });
                this.tagRelatedContainer().find(".button-accept").on("click", async function () {
                    if (that.saveTagRelatedTree) {
                        if (that.getSelectedRowsCount() === 0 && that.getActiveRowIndex() === -1)
                            return;
                        var tags = [];
                        var jstree = that.tagRelatedTreeView().jstree(true);
                        jstree.get_checked().forEach(function (node) {
                            var id = Number(node.split(":")[0]);
                            if (id > 0)
                                tags.push(id);
                        });
                        var keyFields = that.keyField.split(",");
                        var keyValues = [];
                        if (that.multiSelect && that.getSelectedRowsCount() > 0) {
                            var temp = [];
                            var array = [];
                            keyFields.forEach(function (item) {
                                temp = that.getSelectedRowsCellValue(item);
                                array.push(temp);
                            });
                            for (var i = 0; i < array[0].length; i++) {
                                temp = [];
                                for (var j = 0; j < array.length; j++)
                                    temp.push(array[j][i]);

                                keyValues.push(temp);
                            }
                        }
                        else {
                            var array = [];
                            keyFields.forEach(function (item) {
                                array.push(that.getActiveRowCellValue(item));
                            });
                            keyValues.push(array);
                        }
                        await that.saveTagRelatedTree(that.entityName, keyFields, keyValues, tags);
                    }
                    that.tagRelatedContainer().hide();

                    that.selectionViewMode = false;
                    that.reload("assignTag");
                });
                this.tagRelatedContainer().find(".button-default").on("click", function () {
                    that.tagRelatedContainer().hide();
                });
                this.container.find(".grid-header .ico-tag-filter").on("mousedown", function (event) {
                    event.stopPropagation();
                }).on("click", async function () {
                    that.tagRelatedContainer().hide();
                    that.tagManageContainer().hide();
                    if (that.tagFilterContainer().is(":hidden"))
                        await that.loadFilterTreeTag();
                    else
                        that.tagFilterContainer().toggle();
                });
                this.tagFilterContainer().find(".button-accept").on("click", function () {
                    var tags = [];
                    var jstree = that.tagFilterTreeView().jstree(true);
                    jstree.get_checked().forEach(function (node) {
                        var id = Number(node.split(":")[0]);
                        if (id > 0)
                            tags.push(id);
                    });
                    tags = tags.join(",");
                    if (tags) {
                        that.container.find(".grid-header .ico-tag-filter svg").css("fill", "#d84315");
                        that.container.attr("data-tags", tags);
                        that.tagFilterContainer().hide();
                        that.selectionViewMode = false;
                        that.reload("filterTag");
                    }
                    else
                        that.tagFilterContainer().find(".button-clear").trigger("click");
                });
                this.tagFilterContainer().find(".button-clear").on("click", function () {
                    that.container.find(".grid-header .ico-tag-filter svg").css("fill", "#666666");
                    that.container.removeAttr("data-tags");
                    that.tagFilterContainer().hide();
                    that.selectionViewMode = false;
                    that.reload("clearTag");
                });
                this.tagFilterContainer().find(".button-cancel").on("click", function () {
                    that.tagFilterContainer().hide();
                });
                this.container.find(".grid-header .manage-tag").on("mousedown", function (event) {
                    event.stopPropagation();
                }).on("click", async function () {
                    that.tagManageContainer().hide();
                    that.tagManageContainer().hide();
                    if (that.tagManageContainer().is(":hidden"))
                        await that.loadManageTreeTag();
                    else
                        that.tagManageContainer().toggle();
                });
                this.tagManageContainer().find(".button-accept").on("click", function () {
                    if (that.saveTagManageTree) {
                        var jstree = that.tagManageTreeView().jstree(true);
                        that.saveTagManageTree(that.entityName, jstree.get_json()[0]);
                    }
                    that.tagManageContainer().hide();
                });
                this.tagManageContainer().find(".cancel").on("click", function () {
                    that.tagManageContainer().hide();
                });

                this.tagManageContainer().find(".create-tag").on("click", function () {
                    var jstree = that.tagManageTreeView().jstree(true);
                    var node = jstree.get_selected(true);
                    var tagExistsDepth = that.tagExistsDepth ? that.tagExistsDepth : -1;
                    if (node.length === 0 || node[0].original.depth < tagExistsDepth)
                        return;
                    node = node[0].id;
                    node = jstree.create_node(node);
                    if (node) {
                        jstree.edit(node);
                        jstree.deselect_all();
                        jstree.select_node(node);
                    }

                });
                this.tagManageContainer().find(".edit-tag").on("click", function () {
                    var jstree = that.tagManageTreeView().jstree(true);
                    var node = jstree.get_selected(true);
                    var tagExistsDepth = that.tagExistsDepth ? that.tagExistsDepth : -1;
                    if (node.length === 0 || node[0].original.depth <= tagExistsDepth)
                        return;
                    node = node[0].id;
                    jstree.edit(node);
                });
                this.tagManageContainer().find(".delete-tag").on("click", function () {
                    var jstree = that.tagManageTreeView().jstree(true);
                    var node = jstree.get_selected(true);
                    var tagExistsDepth = that.tagExistsDepth ? that.tagExistsDepth : -1;
                    if (node.length === 0 || node[0].original.depth <= tagExistsDepth)
                        return;
                    node = node[0].id;
                    jstree.delete_node(node);
                });

                this.container.find(".grid-footer .grid-selection").on("click", function () {
                    if ($(this).attr("data-view-all") === "true") {
                        that.resetPaging();
                    } else {
                        that.selectionViewMode = true;
                        that.container.find(".grid-footer .page-no").text("1");
                        that.reload("selectionViewMode");
                    }
                });
                this.container.find(".grid-footer .grid-selection-delete").on("click", function () {
                    that.selectionList = [];
                    that.resetPaging();
                });

                this.container.find(".grid-header .container-more .dropdown-menu li").on("click", function () {
                    var itemClass = $(this).attr("class");
                    if (itemClass !== "customize-field" && itemClass !== "import-excel" && itemClass !== "import-xml" && itemClass !== "export-excel" && itemClass !== "export-xml") {
                        if (that.actionMenuMoreClick)
                            that.actionMenuMoreClick(that.getId(), $(this).attr("class"), $(this).index());
                    }
                });


                this.container.find(".grid-header .customize-field").on("click", function () {
                    if (that.customizeFieldClick)
                        that.customizeFieldClick(that.getId());
                });
                this.container.find(".grid-header .adjust-field").on("click", function () {
                    that.showLoading();
                    setTimeout(function () {
                        that.container.find("thead tr:not('.row-filter') td[data-id] .resize").trigger("dblclick");
                        that.closeLoading();
                    }, 50);
                });
                this.container.find(".grid-header .ico-more").on("click", function (event) {
                    if (that.menuMoreClick) {
                        that.menuMoreClick(that.getId());
                    }
                });
                this.container.find(".grid-header .import-excel").on("click", function (event) {
                    if (that.editable && that.importClick) {
                        var isShortKey = event.altKey && event.shiftKey;
                        if ($("#import_excel_" + that.getId()).length === 0) {
                            var input = document.createElement("input");
                            $(input).attr("id", "import_excel_" + that.getId());
                            $(input).attr("name", "ImageFile");
                            $(input).attr("type", "file");
                            $(input).css("display", "none");
                            $(input).addClass("import-excel");
                            $(input).attr("data-target", that.getId());
                            $(input).attr("data-shot-key", isShortKey);
                            $("body").append(input);
                        }
                        else
                            $("#import_excel_" + that.getId()).attr("data-shot-key", isShortKey);
                        $("#import_excel_" + that.getId()).click();
                    }
                });
                this.container.find(".grid-header .sample-excel").on("click", function () {
                    if (that.editable && that.exportClick)
                        that.exportClick(that.getId(), "excelSample");
                });
                this.container.find(".grid-header .export-excel").on("click", function () {
                    if (that.exportClick)
                        that.exportClick(that.getId(), "excelOffline");
                });
                this.container.find(".grid-header .export-xml").on("click", function () {
                    if (that.editable) {
                        var parseXml;
                        that.showLoading();
                        if (typeof window.DOMParser !== "undefined") {
                            parseXml = function (xmlStr) {
                                return (new window.DOMParser()).parseFromString(xmlStr, "text/xml");
                            };
                        } else {
                            that.closeLoading();
                            throw new "No modern XML parser found.";
                        }
                        var xml = "<xml>";
                        that.getDataArray().data.forEach(function (item) {
                            if (item._status !== "deleted") {
                                xml += "<row>";
                                var columns = that.getColumns().split(",");
                                for (var i = 0; i < columns.length; i++) {
                                    var fieldName = columns[i];
                                    var cellValue = item[fieldName];
                                    if (cellValue)
                                        cellValue = cellValue.toString().split(" ").join("@");
                                    else
                                        cellValue = "";
                                    xml += "<" + fieldName + ">" + cellValue + "</" + fieldName + ">";
                                }
                                xml += "</row>";
                            }
                        });
                        xml += "</xml>";
                        var xmlDoc = parseXml(xml);
                        var rows = xmlDoc.getElementsByTagName("xml");
                        that.closeLoading();
                        window.location.href = "data:application/download," + rows[0].innerHTML;
                    }
                });
                this.container.find(".grid-header .import-xml").on("click", function () {
                    if (that.editable && that.importClick) {
                        if ($("#import_xml_" + that.getId()).length === 0) {
                            var input = document.createElement("input");
                            $("body").append(input);
                            $(input).attr("id", "import_xml_" + that.getId());
                            $(input).attr("type", "file");
                            $(input).attr("hidden", "hidden");
                            $(input).addClass("import-xml");
                            $(input).attr("data-target", that.getId());
                        }
                        $("#import_xml_" + that.getId()).click();
                    }
                });

                this.container.find(".grid-footer .ico-prev").on("click", function () {
                    var pageNo = Number($(this).closest(".grid-footer").find(".page-no").text());
                    that.goto(pageNo - 1);
                });
                this.container.find(".grid-footer .ico-next").on("click", function () {
                    var pageNo = Number($(this).closest(".grid-footer").find(".page-no").text());
                    that.goto(pageNo + 1);
                });
                this.container.find(".grid-footer .ico-go").on("click", function () {
                    var goto = Number($(this).closest(".grid-footer").find("input").val());
                    that.goto(goto);
                });
                this.container.on("mouseup touchend", function (event) {
                    that.cancelColumn();
                    that.cancelColumn();
                    that.endEditGrid();
                });
                //this.container.on("focus", function () {
                //    if (!$(this).find("thead").attr("data-resize") && that.getRowsCount() > 0) {
                //        if (that.editable) {
                //            if (that.getActiveCellIndex() === -1)
                //                that.setFocusRow(0, 0, true);
                //        } else {
                //            //var rowIndex = that.getActiveRowIndex();
                //            //if (rowIndex > -1)
                //            //    that.setActiveRowIndex(rowIndex);
                //        }
                //    }
                //});
                this.container.find(".sum-footer .sum-footer-item").on("click", function (event) {
                    event.stopPropagation();
                    if ($(this).attr("data-mask")) {
                        if ($(".sum-footer-menu").is(":hidden") ||
                            $(".sum-footer-menu").attr("data-target") !== $(this).attr("data-id")) {
                            var left = event.clientX - $(".sum-footer-menu").width();
                            if (left < that.container.offset().left + $(".sum-footer-menu").width())
                                left = event.clientX;

                            $(".sum-footer-menu").css({ top: $(this).offset().top - 104, left: left });
                            $(".sum-footer-menu").show();
                            $(".sum-footer-menu").attr("data-target", $(this).attr("data-id"));
                            $(".sum-footer-menu").attr("data-grid", that.getId());
                        } else
                            $(".sum-footer-menu").hide();
                    }

                });

                this.container.find("thead").on("mousemove", function (event) {
                    if ($(this).attr("data-resize")) {
                        var index = $(this).attr("data-resize");
                        var startOffset = Number($(this).attr("data-offset"));
                        var width = that.isLeftToRight ? event.pageX - startOffset : startOffset - event.pageX;
                        that.resizeColumn(index, width);
                    }
                });
                this.container.find("table.table-body").off("scroll").on("scroll", function () {
                    if (that.existScroll)
                        return;

                    if (that.isLeftToRight) {
                        var left = Math.abs($(this)[0].scrollLeft) * -1;
                        that.container.find("thead").css("margin-left", left);
                        that.container.find(".sum-footer").css("margin-left", left);
                        that.container.find(".table-header-grouping").css("margin-left", left);
                    }
                    else {
                        var right;
                        if (that.chromeOldVersion) {
                            right = $(this)[0].offsetWidth + $(this)[0].scrollLeft - 17 - $(this)[0].scrollWidth;
                        } else {
                            right = Math.abs($(this)[0].scrollLeft) * -1;
                        }
                        that.container.find("thead").css("margin-right", right);
                        that.container.find(".sum-footer").css("margin-right", right);
                        that.container.find(".table-header-grouping").css("margin-right", right);
                    }
                    if (that.editable && (that.manualScrollTop || that.lastStatus === "insert" || that.lastStatus === "delete" || that.lastStatus === "copyRow")) {
                        if (that.manualScrollTop && $(this).scrollTop() !== that.manualScrollTop) {
                            if (that.lastStatus === "ctrl-insert") {
                                that.existScroll = true;
                                setTimeout(function () { that.existScroll = false; that.lastStatus = null; }, 100);
                            }
                            $(this).scrollTop(that.manualScrollTop);
                        }
                        that.manualScrollTop = null;
                        that.lastStatus = null;
                        return;
                    }

                    if (that.editable && !that.workingScrollLazyLoading) {

                        var offlineJson = that.getOfflineRecordsExist();
                        var lastScroll = that.container.attr("data-last-scroll") ? Number(that.container.attr("data-last-scroll")) : 0;
                        var scrollTop = $(this).scrollTop();
                        var isScrollDown = scrollTop > lastScroll;
                        that.container.attr("data-last-scroll", scrollTop);

                        var startLazy = that.dataStartLazy;
                        var inserted = that.lastStatus === "ctrl-insert";
                        if (inserted) {

                            scrollTop = offlineJson.length * that.rowHeight;
                            if (scrollTop >= startLazy * that.rowHeight && scrollTop <= (startLazy + that.pageSize - 1) * that.rowHeight) {
                                that.lastStatus = null;
                                return;
                            }
                            that.manualScrollTop = scrollTop;
                            that.existScroll = true;
                            isScrollDown = scrollTop > lastScroll;
                            that.container.attr("data-last-scroll", scrollTop);
                            $(this).scrollTop(scrollTop);
                            setTimeout(function () { that.existScroll = false; }, 100);

                        }

                        var numberStartRecord = Math.ceil(scrollTop / that.rowHeight);
                        var numberEndRecord = Math.ceil(scrollTop / that.rowHeight + that.getAllowRowCount());
                        numberEndRecord = numberEndRecord > offlineJson.length ? offlineJson.length : numberEndRecord;

                        var fetchPage = isScrollDown ? numberEndRecord > startLazy + that.pageSize : numberStartRecord < startLazy;
                        if (fetchPage) {
                            that.workingScrollLazyLoading = true;
                            that.getRowsElement().remove();
                            that.showLoading();
                            if (that.resetTimeScroll) {
                                clearTimeout(that.resetTimeScroll);
                                that.resetTimeScroll = null;
                            }
                            that.resetTimeScroll = setTimeout(function () {
                                var start, end;

                                var oldStartLazy = startLazy;
                                scrollTop = inserted ? scrollTop : that.container.find("table.table-body").scrollTop();
                                numberStartRecord = Math.ceil(scrollTop / that.rowHeight);
                                startLazy = Math.floor(numberStartRecord / that.pageSize) * that.pageSize;
                                startLazy = startLazy > 0 ? startLazy : 0;
                                var limitRecord = startLazy + (oldStartLazy === startLazy ? that.pageSize : 0);
                                start = isScrollDown ? limitRecord : (oldStartLazy === startLazy ? startLazy - that.pageSize : startLazy);
                                start = start > 0 ? start : 0;
                                end = start + that.pageSize;
                                end = end === 0 ? that.pageSize : end;
                                var recordsJson = offlineJson.slice(start, end);
                                var html = that.convertJsonToHtml(recordsJson).Body;
                                that.container.find("tbody").append(html);
                                that.dataStartLazy = start;
                                that.setGridRowLazy(true);
                                that.checkedEmptyRows();
                                that.reOrderIndex();
                                if (isScrollDown) {
                                    if (!inserted) {
                                        if (that.getRowsCount() >= that.getAllowRowCount())
                                            scrollTop = start * that.rowHeight;
                                        else
                                            scrollTop = start * that.rowHeight;
                                    }
                                    that.manualScrollTop = scrollTop;
                                    that.container.attr("data-last-scroll", scrollTop);
                                    that.container.find("table.table-body").scrollTop(scrollTop);
                                } else {
                                    scrollTop = (end - that.getAllowRowCount()) * that.rowHeight;
                                    that.manualScrollTop = scrollTop;
                                    that.container.attr("data-last-scroll", scrollTop);
                                    that.container.find("table.table-body").scrollTop(scrollTop);
                                }
                                that.closeLoading();
                                that.dragJsGridView();
                                that.workingScrollLazyLoading = false;
                                if (inserted) {
                                    var $tr = $(that.getRowsElement()[that.getRowsCount() - 1]);
                                    var activeElements = $tr.children(gridBuilderGlobal.gridFocusColumnEditModeFind);
                                    if (activeElements.length > 0)
                                        $(activeElements[0]).trigger("dblclick");
                                }
                                if (that.pageChanged)
                                    that.pageChanged((start / that.pageSize) + 1);

                            },
                                100);
                        } else {
                            that.manualScrollTop = null;
                            that.lastStatus = null;
                        }
                    }
                });
                this.container.find("tbody").on("click", "tr span.grouping-expand", function () {
                    var dataValue = $(this).closest("tr").attr("data-value");
                    that.expandCollapseGrouping(dataValue);
                });
                this.container.find("tbody").on("click", "tr td .action-control", function () {
                    if (that.actionClick) {
                        var rowIndex = that.getIndexRow($(this).closest("tr").index());
                        var columnIndex = $(this).closest("td").index();
                        that.actionClick(rowIndex, columnIndex);
                    }
                });
                this.container.find("tbody").on("mouseenter", "tr td.column-tag", function (event) {
                    if ($(this).find("svg").length === 0)
                        return;
                    if (that.displayItemTags) {
                        var rowIndex = that.getIndexRow($(this).closest("tr").index());
                        var $column = $(this);
                        that.resetTimeDisplayItemTags = setTimeout(async function () {
                            var keyFields = that.keyField.split(",");
                            var keyValues = [];
                            keyFields.forEach(function (item) {
                                keyValues.push(that.getCellValue(rowIndex, item));
                            });
                            var dataSet;
                            if ($column.attr("data-tag"))
                                dataSet = $column.attr("data-tag").split(",");
                            else
                                dataSet = await that.displayItemTags(that.entityName, keyFields, keyValues);

                            var content = "<div class='grid-tag-assign-header'>برچسب‌های تخصیص داده شده:</div>";
                            dataSet.forEach(function (item) {
                                content += "<div style='margin-top:8px;padding-right:8px;'>" + item + "</div>";
                            });
                            $column.attr("data-tag", dataSet.join(","));
                            $(".grid-tag-assign").html(content);
                            $(".grid-tag-assign").css({ top: event.clientY, left: event.clientX - $(".grid-tag-assign").width() - 30 });
                            if (that.resetTimeDisplayItemTags)
                                $(".grid-tag-assign").show();
                        }, 100);
                    }
                }).on("mouseleave", "tr td.column-tag", function () {
                    if ($(this).find("svg").length === 0)
                        return;
                    clearTimeout(that.resetTimeDisplayItemTags);
                    that.resetTimeDisplayItemTags = null;
                    $(".grid-tag-assign").html("");
                    $(".grid-tag-assign").hide();
                });


                if (this.editable) {

                    this.container.on("keydown", function (event) {
                        if (that.canModify && event.ctrlKey && event.keyCode === gridBuilderGlobal.insertKey) {
                            event.stopPropagation();
                            that.addNewRow();
                        }
                    });
                    this.container.find("tbody").on("click", gridBuilderGlobal.gridBodyRowsFind + " td.column-delete-row", async function () {
                        const rowIndex = that.getIndexRow($(this).closest("tr").index());
                        that.deleteRow(rowIndex);
                    });
                    this.container.find("tbody").on("dblclick", gridBuilderGlobal.gridBodyRowsFind + " td", async function (event) {
                        event.stopPropagation();
                        var activeRowIndex = that.getActiveRowIndex();
                        if ($(this).hasClass("column-select") || $(this).hasClass("column-context-menu") || $(this).hasClass("column-delete-row") || $(this).parent().attr("data-edit") === "true") {
                            return;
                        }
                        that.endEditGrid();

                        var rowIndex = that.getIndexRow($(this).closest("tr").index());

                        $(this).parent().attr("data-edit", "true");
                        $(this).parent().find("td").each(function (cellIndex, cell) {
                            if ($(cell).hasClass("column-select") || $(cell).hasClass("column-context-menu") || $(cell).hasClass("column-delete-row") || $(cell).hasClass("extend-data"))
                                return;

                            $(cell).find(".text").hide();
                            var text = "";
                            var htmlValue = $(cell).find(".text").html();
                            if (htmlValue && htmlValue.trim()) {
                                var $cellHtml = $($.parseHTML(htmlValue.trim())[0]);
                                if ($cellHtml.is("span.checkbox-column"))
                                    text = $cellHtml.hasClass("checked");
                                else
                                    text = $(cell).find(".text").text().trim();
                            }

                            var element = $(that.container.find("tbody").find(".row-edit td")[cellIndex]).html();
                            $(cell).find(".edit").html(element);
                            if ($(cell).find(".edit").children().length > 0) {
                                var $child = $($(cell).find(".edit").children()[0]);
                                if ($child.attr("data-edit-id")) {
                                    $child.attr("id", $child.attr("data-edit-id"));
                                    $child.removeAttr("data-edit-id");
                                }
                            }
                            if ($(cell).find(".edit .system-combo-control").length === 1) {
                                var $combo = $(cell).find(".edit .system-combo-control");
                                $combo.attr("data-value", text);
                                $combo.find(".combo-text").val(text);
                                window[$combo.attr("id") + "Builder"] = null;
                                $combo.comboBuilder(true);
                            } else if ($(cell).find(".edit input").length === 1) {
                                var $input = $($(cell).find(".edit input")[0]);
                                if ($input.is("input[type='checkbox']")) {
                                    $input.prop("checked", text);
                                } else {
                                    var fieldName = that.getCellFieldName(cellIndex);
                                    var dataMask = that.getCellValue(rowIndex, "datamask_" + fieldName);
                                    if (dataMask)
                                        $input.attr("data-mask", dataMask);
                                    if ($input.attr("data-mask") === "price")
                                        text = numberNonCommas(text);

                                    $input.val(text);
                                }
                            }
                        });
                        if ($(this).attr("disabled") !== "disabled")
                            $(this).find(".edit input")[0].focus();

                        $(this).attr("data-active", "true");
                        if (that.setMaskEdit)
                            that.setMaskEdit();



                        $(this).parent().find("input").on("change", async function () {
                            var columnIndex = $(this).closest("td").index();
                            if ($(this).hasClass("combo-text")) {
                                var mask = $(this).attr("data-grid-mask");
                                if (mask && !$.isNumeric($(this).val())) {
                                    $(this).val("");
                                    return;
                                }
                            }
                            if (that.cellChanged)
                                await that.cellChanged(rowIndex, columnIndex);
                        });

                        if (activeRowIndex !== rowIndex) {
                            if (that.rowChanged) {
                                if (typeof that.rowChanged === "function")
                                    await that.rowChanged(rowIndex);
                                else {
                                    if (that.resetTimeFocus) {
                                        clearTimeout(that.resetTimeFocus);
                                        that.resetTimeFocus = null;
                                    }
                                    if (!that.resetTime) {
                                        that.resetTimeFocus = setTimeout(async function () {
                                            await eval(that.rowChanged);
                                        }, 100);
                                    }
                                }
                            }
                        }
                        if (that.startEditing)
                            await that.startEditing(rowIndex, that.getId());
                    });
                    this.container.find("tbody").on("mouseup", gridBuilderGlobal.gridBodyRowsFind + " td", function (event) {
                        event.stopPropagation();
                    });
                    this.container.find("tbody").on("mousedown", gridBuilderGlobal.gridBodyRowsFind + " td", async function (event) {
                        event.stopPropagation();
                        var activeRowIndex = that.getActiveRowIndex();
                        var columnIndex = $(this).index();
                        $(".combo-dropdown-menu").hide();

                        that.container.find("tbody tr td[data-active='true']").removeClass("active").removeAttr("data-active");
                        if ($(this).hasClass("column-select") || $(this).hasClass("column-context-menu") || $(this).hasClass("column-delete-row")) {
                            return;
                        }
                        if ($(this).parent().attr("data-edit") === "true" && ($(event.target).is("input") || $(event.target).attr("data-toggle") === "dropdown" || $(event.target).is("span.combo-caret"))) {
                            $(this).attr("data-active", "true");
                            return;
                        }
                        that.endEditGrid();
                        $(this).addClass("active").attr("data-active", "true");
                        var rowIndex = that.getIndexRow($(this).closest("tr").index());
                        if (activeRowIndex !== rowIndex) {
                            if (that.rowChanged) {
                                if (typeof that.rowChanged === "function")
                                    await that.rowChanged(rowIndex);
                                else {
                                    if (that.resetTimeFocus) {
                                        clearTimeout(that.resetTimeFocus);
                                        that.resetTimeFocus = null;
                                    }
                                    if (!that.resetTime) {
                                        that.resetTimeFocus = setTimeout(async function () {
                                            await eval(that.rowChanged);
                                        }, 100);
                                    }
                                }
                            }
                        }
                        if (that.cellClick)
                            await that.cellClick(rowIndex, columnIndex);
                    });
                    this.container.find("tbody").on("keydown", gridBuilderGlobal.gridBodyRowsFind + " td[data-active='true']", async function (event) {
                        event.stopPropagation();
                        var existEvent = false;

                        var $tr = $(this).closest("tr");
                        var rowIndex = that.getIndexRow($tr.index());
                        var columnIndex = $(this).index();
                        var $combo, comboDropdownId;
                        if (event.shiftKey && event.ctrlKey && event.keyCode === gridBuilderGlobal.insertKey) {
                            if (that.canModify) {
                                that.endEditGrid();
                                setTimeout(function () {
                                    that.copyRow(rowIndex);
                                }, 20);

                            }
                            existEvent = true;
                        } else if (event.ctrlKey && event.keyCode === gridBuilderGlobal.insertKey) {
                            if (that.canModify) {
                                that.addNewRow();
                            }
                            existEvent = true;
                        } else if (event.keyCode === gridBuilderGlobal.insertKey) {
                            if (that.canModify) {
                                that.addNewRow(rowIndex);
                            }
                            existEvent = true;
                        } else if (event.ctrlKey && event.keyCode === gridBuilderGlobal.deleteKey) {
                            if (that.canModify) {
                                that.deleteRow($tr);
                            }
                            existEvent = true;
                        } else if (event.keyCode === gridBuilderGlobal.f6Key && !that.shortKeys.includes(gridBuilderGlobal.f6Key.toString())) {
                            if (rowIndex > 0 && that.canModify) {
                                var columnValue = that.getCellValue(rowIndex - 1, columnIndex);
                                that.setCellValue(rowIndex, columnIndex, columnValue);
                                that.container.find("tbody").find("tr.row-edit td:eq(" + columnIndex + ") input[type='text']").trigger("change");
                            }
                            existEvent = true;
                        } else if (event.keyCode === gridBuilderGlobal.equalKey) {
                            if (that.canModify) {
                                var isPrice = that.getCellDataMask($(this).index()) === "price";
                                if (isPrice && that.openCalculator)
                                    that.openCalculator();
                            }
                            existEvent = true;
                        } else if (event.keyCode === gridBuilderGlobal.f5Key) {
                            existEvent = true;
                        } else if ($(event.target).is("input")) {
                            if (event.shiftKey && event.keyCode === gridBuilderGlobal.tabKey) {
                                if ($(this).find(".system-combo-control").length === 1) {
                                    $combo = $(this).find(".system-combo-control");
                                    comboDropdownId = $combo.attr("id") + "_dropdown";
                                    $("#" + comboDropdownId).hide();
                                }
                                that.setEditRow(rowIndex, columnIndex - 1, false);
                                existEvent = true;
                            }
                            else if (event.keyCode === gridBuilderGlobal.tabKey || event.keyCode === gridBuilderGlobal.enterKey) {
                                if ($(this).find(".system-combo-control").length === 1) {
                                    $combo = $(this).find(".system-combo-control");
                                    comboDropdownId = $combo.attr("id") + "_dropdown";
                                    $("#" + comboDropdownId).hide();
                                }
                                if (that.cellBeforeLostFocus)
                                    await that.cellBeforeLostFocus(rowIndex, columnIndex);

                                that.setEditRow(rowIndex, columnIndex + 1, true);
                                existEvent = true;
                            }
                            else if (event.keyCode === gridBuilderGlobal.escapeKey) {
                                that.endEditGrid();
                                $(this).addClass("active").attr("data-active", "true");
                                $(this).focus();
                                existEvent = true;
                            }
                        } else {
                            if (event.keyCode === gridBuilderGlobal.enterKey) {
                                if ($(this).attr("disabled") !== "disabled") {
                                    $(this).trigger("dblclick");
                                }
                                existEvent = true;
                            }
                            else if (event.keyCode === gridBuilderGlobal.deleteKey) {
                                if (that.canModify) {
                                    that.setCellValue(rowIndex, columnIndex, "");
                                    that.container.find("tbody").find("tr.row-edit td:eq(" + columnIndex + ") input[type='text']").trigger("change");
                                }
                                existEvent = true;
                            } else if (event.keyCode === gridBuilderGlobal.downKey || event.keyCode === gridBuilderGlobal.upKey) {
                                event.preventDefault();
                                var rowArray = null;
                                var $body = that.container.find("tbody");
                                if (event.keyCode === gridBuilderGlobal.downKey)
                                    rowArray = $tr.nextAll(gridBuilderGlobal.gridBodyRowsFind);
                                else if (event.keyCode === gridBuilderGlobal.upKey)
                                    rowArray = $tr.prevAll(gridBuilderGlobal.gridBodyRowsFind);
                                if (rowArray && rowArray.length > 0) {
                                    var $newRow = $(rowArray[0]);
                                    rowIndex = that.getIndexRow($newRow.index());
                                    that.setFocusRow(rowIndex, $(this).index(), false);
                                    var rowTop = $newRow.position().top;
                                    var rowBottom = rowTop + $newRow.height();
                                    var tableHeight = $body.height();
                                    var currentScroll = $body.scrollTop();
                                    if (rowTop < 0)
                                        $body.scrollTop(currentScroll + rowTop);
                                    else if (rowBottom > tableHeight) {
                                        var scrollAmount = rowBottom - tableHeight;
                                        $body.scrollTop(currentScroll + scrollAmount);
                                    }

                                    if (that.rowChanged) {
                                        if (typeof that.rowChanged === "function")
                                            await that.rowChanged(rowIndex);
                                        else {
                                            if (that.resetTimeFocus) {
                                                clearTimeout(that.resetTimeFocus);
                                                that.resetTimeFocus = null;
                                            }
                                            if (!that.resetTime) {
                                                that.resetTimeFocus = setTimeout(async function () {
                                                    await eval(that.rowChanged);
                                                },
                                                    100);
                                            }
                                        }
                                    }
                                }
                                existEvent = true;
                            }
                            else if (event.keyCode === gridBuilderGlobal.rightKey || (event.shiftKey && event.keyCode === gridBuilderGlobal.tabKey)) {
                                that.setFocusRow(rowIndex, columnIndex - 1, false);
                                existEvent = true;
                            } else if (event.keyCode === gridBuilderGlobal.leftKey || event.keyCode === gridBuilderGlobal.tabKey) {
                                that.setFocusRow(rowIndex, columnIndex + 1, true);
                                existEvent = true;
                            }
                        }
                        if (!existEvent && that.shortKeys.length > 0)
                            existEvent = that.eventPopupMenu(rowIndex, event);
                        if (existEvent)
                            event.preventDefault();

                        return existEvent ? false : true;
                    });
                }
                else {
                    if (this.grouping) {
                        this.container.find(".grouping").on("mouseup touchend", function (event) { that.dropColumn($(this), event); });
                        this.container.find(".grouping").on("click", ".img-close", function () {
                            var $li = $(this).closest("li");
                            var columnIndex = Number($li.attr("data-index"));
                            that.setColumnVisibility(columnIndex, false);
                            $li.remove();
                            if (that.container.find(".grouping-tags li").length === 1)
                                that.container.find(".grouping-tags li.grouping-drag-help").removeAttr("hidden");

                            that.resetPaging();
                        });
                    }
                    this.container.find("thead tr:not('.row-filter')").on("mousedown touchstart", "td[data-id]", function (event) {
                        that.selectColumn($(this), event);
                    });
                    this.container.find("thead tr:not('.row-filter')").on("mouseup touchend", "td[data-id]", function (event) {
                        that.dropColumn($(this), event);
                    });
                    this.container.find("thead tr:not('.row-filter')").on("click", "td[data-id]", function (event) {
                        if (!$(this).attr("data-drag") && !that.container.find("thead").attr("data-resize")) {
                            if ($(this).attr("data-id") && (that.grouping || !that.offlinePaging || that.offlinePagingSortable)) {
                                that.sort($(this), event);
                            }
                        }
                        that.container.find("thead").removeAttr("data-resize").removeAttr("data-offset");
                        that.container.find("thead td").removeAttr("data-drag");
                    });
                    this.container.find("tbody").on("click", gridBuilderGlobal.gridBodyRowsFind, async function () {
                        const activeRowIndex = that.container.find("tbody tr.active").index();
                        that.container.find("tbody tr.active").removeClass("active");
                        $(this).addClass("active");
                        var rowIndex = $(this).index();
                        if (that.rowChanged && activeRowIndex !== rowIndex) {
                            rowIndex = that.getIndexRow(rowIndex);
                            if (typeof that.rowChanged === "function")
                                await that.rowChanged(rowIndex);
                            else {
                                if (that.resetTimeFocus) {
                                    clearTimeout(that.resetTimeFocus);
                                    that.resetTimeFocus = null;
                                }
                                if (!that.resetTime) {
                                    that.resetTimeFocus = setTimeout(async function () {
                                        await eval(that.rowChanged);
                                    }, 100);
                                }
                            }
                        }
                        if (typeof setLevelInfoAsync === "function")
                            await setLevelInfoAsync(that.getId());
                    });
                    this.container.find("tbody").on("dblclick", gridBuilderGlobal.gridBodyRowsFind, function () {
                        var rowIndex = that.getIndexRow($(this).index());
                        if (that.dblClick)
                            that.dblClick(rowIndex);
                    });
                    if (this.multiSelect) {
                        this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']").on("click", async function (event) {
                            event.stopPropagation();
                            if (that.checkedRecordAll && $(this).prop("checked")) {
                                $(this).prop("checked", !$(this).prop("checked"));
                                var $popupMenu = $("#" + that.getId() + "selection.context-menu-container");
                                $popupMenu.css({ width: 140, top: $(this).offset().top, left: $(this).offset().left - 140 });
                                $popupMenu.show();
                            }
                            else {
                                var state = that.checkedRecordAll && $(this).attr("data-state") === "all" ? "all" : "current";
                                await that.setCheckAllState($(this).prop("checked"), state);
                            }
                        });
                        this.container.find("tbody").on("click", gridBuilderGlobal.gridBodyRowsFind + " td.column-select input[type='checkbox']", async function () {
                            if ($(this).prop("checked"))
                                $(this).closest("tr").addClass("selected");
                            else
                                $(this).closest("tr").removeClass("selected");

                            var trBody = that.getRowsElement();
                            const isCheckedAll = trBody.find("td.column-select input[type='checkbox']:not(:checked)").length === 0;
                            var $checkedAll = that.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                            $checkedAll.prop("checked", isCheckedAll);

                            var checkAllState = $checkedAll.attr("data-state") === "all";
                            if (checkAllState) {
                                trBody.find("td.column-select input[type='checkbox']").prop("checked", false);
                                that.container.find(".grid-footer .grid-selection-all").text("");
                                trBody.removeClass("selected");
                                $checkedAll.removeAttr("data-state");
                            }
                            else {
                                const rowIndex = that.getIndexRow($(this).closest("tr").index());
                                if (that.selectedChanged)
                                    that.selectedChanged(rowIndex, $(this).prop("checked"));
                                if (that.pgmSumChanged) {
                                    if (typeof that.pgmSumChanged === "function")
                                        await that.pgmSumChanged();
                                    else {
                                        //if (that.resetTime) {
                                        //    clearTimeout(that.resetTime);
                                        //    that.resetTime = null;
                                        //}
                                        //that.resetTime = setTimeout(async function () {
                                            await eval(that.pgmSumChanged);
                                        //    clearTimeout(that.resetTime);
                                        //    that.resetTime = null;
                                        //},
                                        //    500);
                                    }
                                }
                                if (that.keepSelection)
                                    that.changeSelection(rowIndex, $(this).prop("checked"));
                            }
                        });
                    }
                    if (this.expandable) {
                        this.container.find("tbody").on("click", gridBuilderGlobal.gridBodyRowsFind + " td.column-expandable", async function (event) {
                            event.preventDefault();
                            const rowIndex = $(this).closest("tr").index();
                            var $tr = that.container.find("tbody tr:eq(" + (rowIndex + 1) + ")");
                            var isExpand = $(this).hasClass("column-expand");
                            if (isExpand) {
                                $(this).removeClass("column-expand").addClass("column-collapse");
                                $tr.hide();
                            }
                            else {
                                $(this).removeClass("column-collapse").addClass("column-expand");
                                $tr.show();
                            }
                            if (that.expandChanged) {
                                that.expandChanged($tr.find("td:eq(0)"), that.getIndexRow(rowIndex), !isExpand);
                            }
                        });
                    }
                    this.container.find("tbody").on("keydown", gridBuilderGlobal.gridBodyRowsFind, async function (event) {
                        event.stopPropagation();
                        if (isShowLoading) {
                            return false;
                        }
                        var rowIndex;
                        if (event.keyCode === gridBuilderGlobal.downKey || event.keyCode === gridBuilderGlobal.upKey) {
                            event.preventDefault();
                            var $body = that.container.find("tbody");
                            var rowArray = null;
                            if (event.keyCode === gridBuilderGlobal.downKey)
                                rowArray = $(this).nextAll(gridBuilderGlobal.gridBodyRowsFind);
                            else if (event.keyCode === gridBuilderGlobal.upKey)
                                rowArray = $(this).prevAll(gridBuilderGlobal.gridBodyRowsFind);
                            if (rowArray && rowArray.length > 0) {
                                var $newRow = $(rowArray[0]);
                                $(this).removeClass("active");
                                $newRow.addClass("active");
                                $newRow.focus();
                                var rowTop = $newRow.position().top;
                                var rowBottom = rowTop + $newRow.height();
                                var tableHeight = $body.height();
                                var currentScroll = $body.scrollTop();
                                if (rowTop < 0)
                                    $body.scrollTop(currentScroll + rowTop);
                                else if (rowBottom > tableHeight) {
                                    var scrollAmount = rowBottom - tableHeight;
                                    $body.scrollTop(currentScroll + scrollAmount);
                                }
                                rowIndex = that.getIndexRow($newRow.index());

                                if (that.rowChanged) {
                                    if (typeof that.rowChanged === "function")
                                        await that.rowChanged(rowIndex);
                                    else {
                                        if (that.resetTimeFocus) {
                                            clearTimeout(that.resetTimeFocus);
                                            that.resetTimeFocus = null;
                                        }
                                        if (!that.resetTime) {
                                            that.resetTimeFocus = setTimeout(async function () {
                                                await eval(that.rowChanged);
                                            }, 100);
                                        }
                                    }
                                }
                            }
                        }
                        else if (event.keyCode === gridBuilderGlobal.enterKey) {
                            if (that.rowEnterPress) {
                                rowIndex = that.getIndexRow($(this).index());
                                that.rowEnterPress(rowIndex);
                            }

                        }
                    });
                }
                this.checkedEmptyRows();
                if (!this.grouping)
                    this.dragJsGridView();
            };
            jsGridView.prototype.setCheckAllState = async function (checkState, dataValue) {
                var that = this;

                var $checkedAll = that.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                $checkedAll.prop("checked", checkState);
                if (checkState && dataValue === "all") {
                    $checkedAll.attr("data-state", "all");
                    that.selectionList = [];
                    that.container.find(".grid-footer .grid-selection").text("");
                }
                else
                    $checkedAll.removeAttr("data-state");

                var trBody = that.getRowsElement();
                if (checkState) {
                    trBody.find("td.column-select input[type='checkbox']").prop("checked", true);
                    trBody.addClass("selected");
                } else {
                    trBody.find("td.column-select input[type='checkbox']").prop("checked", false);
                    trBody.removeClass("selected");
                }

                if (dataValue === "current") {
                    if (that.getRowsCount() > 0) {
                        if (that.selectedChanged)
                            that.selectedChanged(-1, checkState);

                        if (that.rowChanged) {
                            if (typeof that.rowChanged === "function")
                                await that.rowChanged(-1);
                            else {
                                if (that.resetTimeFocus) {
                                    clearTimeout(that.resetTimeFocus);
                                    that.resetTimeFocus = null;
                                }
                                if (!that.resetTime) {
                                    that.resetTimeFocus = setTimeout(async function () {
                                        await eval(that.rowChanged);
                                    }, 100);
                                }
                            }
                        }

                        if (typeof setLevelInfoAsync === "function")
                            await setLevelInfoAsync(that.getId());

                        if (that.pgmSumChanged) {
                            if (typeof that.pgmSumChanged === "function")
                                await that.pgmSumChanged();
                            else {
                                if (that.resetTime) {
                                    clearTimeout(that.resetTime);
                                    that.resetTime = null;
                                }
                                that.resetTime = setTimeout(async function () {
                                    await eval(that.pgmSumChanged);
                                    clearTimeout(that.resetTime);
                                    that.resetTime = null;
                                },
                                    500);
                            }
                        }
                        if (that.keepSelection)
                            that.changeSelection(-1, checkState);
                    }
                }
                else {
                    if (checkState)
                        that.container.find(".grid-footer .grid-selection-all").text(gridBuilderGlobal.dictionary.selectedItems + " (" + that.getRecordCount() + " " + gridBuilderGlobal.dictionary.item + ") ");
                }
                if (!checkState)
                    that.container.find(".grid-footer .grid-selection-all").text("");
            };
            jsGridView.prototype.tagRelatedContainer = function () {
                return this.container.find(".grid-tag-related");
            };
            jsGridView.prototype.tagFilterContainer = function () {
                return this.container.find(".grid-tag-filter");
            };
            jsGridView.prototype.tagManageContainer = function () {
                return this.container.find(".grid-tag-manage");
            };

            jsGridView.prototype.tagRelatedTreeView = function () {
                return this.tagRelatedContainer().find(".grid-tag-jstree");
            };
            jsGridView.prototype.tagFilterTreeView = function () {
                return this.tagFilterContainer().find(".grid-tag-jstree");
            };
            jsGridView.prototype.tagManageTreeView = function () {
                return this.tagManageContainer().find(".grid-tag-jstree");
            };


            jsGridView.prototype.guid = function () {
                function s4() {
                    return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
                }
                return s4() + s4() + "-" + s4() + "-" + s4() + "-" + s4() + "-" + s4() + s4() + s4();
            };
            jsGridView.prototype.addFilterRow = function () {
                var that = this;
                var $trFilter = this.container.find("thead tr.row-filter");
                if ($trFilter.length === 0) {
                    $trFilter = $("<tr>");
                    $trFilter.addClass("row-filter");
                    this.container.find("thead").append($trFilter);
                }
                else
                    $trFilter.empty();

                if (this.expandable)
                    $trFilter.append("<td></td>");
                $trFilter.append("<td></td>");
                if (this.hasTag)
                    $trFilter.append("<td></td>");
                if ($("#" + this.getId() + "popup.context-menu-container").length === 1)
                    $trFilter.append("<td></td>");
                if (this.editable && this.canModify)
                    $trFilter.append("<td></td>");

                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function () {
                    var columnIndex = $(this).index();
                    var cellHidden = $(this).attr("hidden") === "hidden";
                    var cellAlign = $(this).attr("data-align");
                    var width = $(this).css("width");
                    var dataType = "0";
                    var dataMask = "";
                    if ($(this).attr("data-mask") === "price") {
                        dataType = "1";
                        dataMask = "data-mask='num'";
                    } else if ($(this).attr("data-mask") === "date") {
                        dataType = "2";
                    }
                    var search = that.container.find("thead tr.row-filter td:eq(" + columnIndex + ") input").val();
                    var dataFilter = that.container.find("thead tr.row-filter td:eq(" + columnIndex + ") input").attr("data-filter");
                    search = search ? search : "";
                    dataFilter = dataFilter ? dataFilter : "contains";
                    $trFilter.append("<td " + (cellHidden ? "hidden='hidden'" : "") + " style='min-width:" + width + ";width:" + width + ";'><div class='ico-filter'>" + gridBuilderGlobal.filterIcon + "</div><input type='text' " + dataMask + " data-type='" + dataType + "' data-filter='" + dataFilter + "' value='" + search + "' style='" + (cellAlign ? "text-align:" + cellAlign + ";" + (cellAlign === "left" ? "direction:ltr;" : "") : "") + "' /></td>");
                });
                if (this.container.find("thead tr.row-filter").length === 1 && !this.container.find("thead tr.row-filter").is(":hidden"))
                    $trFilter.show();
            };
            jsGridView.prototype.isChromeOldVersion = function () {
                var navUserAgent = window.navigator.userAgent;
                var browserName = window.navigator.appName;
                var browserVersion = "" + Number(window.navigator.appVersion);
                var tempNameOffset, tempVersionOffset, tempVersion;

                if ((tempVersionOffset = navUserAgent.indexOf("Opera")) > -1) {
                    browserName = "Opera";
                    browserVersion = navUserAgent.substring(tempVersionOffset + 6);
                    if ((tempVersionOffset = navUserAgent.indexOf("Version")) > -1)
                        browserVersion = navUserAgent.substring(tempVersionOffset + 8);
                } else if ((tempVersionOffset = navUserAgent.indexOf("MSIE")) > -1) {
                    browserName = "Microsoft Internet Explorer";
                    browserVersion = navUserAgent.substring(tempVersionOffset + 5);
                } else if ((tempVersionOffset = navUserAgent.indexOf("Chrome")) > -1) {
                    browserName = "Chrome";
                    browserVersion = navUserAgent.substring(tempVersionOffset + 7);
                } else if ((tempVersionOffset = navUserAgent.indexOf("Safari")) > -1) {
                    browserName = "Safari";
                    browserVersion = navUserAgent.substring(tempVersionOffset + 7);
                    if ((tempVersionOffset = navUserAgent.indexOf("Version")) > -1)
                        browserVersion = navUserAgent.substring(tempVersionOffset + 8);
                } else if ((tempVersionOffset = navUserAgent.indexOf("Firefox")) > -1) {
                    browserName = "Firefox";
                    browserVersion = navUserAgent.substring(tempVersionOffset + 8);
                } else if ((tempNameOffset = navUserAgent.lastIndexOf(" ") + 1) < (tempVersionOffset = navUserAgent.lastIndexOf("/"))) {
                    browserName = navUserAgent.substring(tempNameOffset, tempVersionOffset);
                    browserVersion = navUserAgent.substring(tempVersionOffset + 1);
                    if (browserName.toLowerCase() === browserName.toUpperCase())
                        browserName = navigator.appName;
                }

                if ((tempVersion = browserVersion.indexOf(";")) !== -1)
                    browserVersion = browserVersion.substring(0, tempVersion);
                if ((tempVersion = browserVersion.indexOf(" ")) !== -1)
                    browserVersion = browserVersion.substring(0, tempVersion);

                return browserName === "Chrome" && Number(browserVersion.split(".")[0]) < 85;
            };
            jsGridView.prototype.getAllowRowCount = function () {
                var offlineJson = this.getOfflineRecordsExist();
                return Math.floor((this.container.find("table.table-body").height() - (offlineJson.length > this.getRowsCount() ? 14 : 0)) / this.rowHeight);
            };
            jsGridView.prototype.setGridRowLazy = function () {
                if (!this.editable)
                    return;

                var offlineJson = this.getOfflineRecordsExist();
                if (offlineJson.length > this.pageSize)
                    this.container.find("tbody").css({ "width": "", "height": (offlineJson.length * this.rowHeight) + "px" });
                else
                    this.container.find("tbody").css({ "width": "", "height": "" });

                if (this.getRowsCount() < this.getAllowRowCount()) {
                    var height = Math.round((this.dataStartLazy - (this.getAllowRowCount() - this.getRowsCount())) * this.rowHeight);
                    this.container.find("tbody .grid-row-lazy").height(height);
                } else
                    this.container.find("tbody .grid-row-lazy").height(this.dataStartLazy * this.rowHeight);
            };
            jsGridView.prototype.resizeColumn = function (columnIndex, width) {
                if (width < 50)
                    return;
                columnIndex++;
                this.container.find("table thead td:nth-child(" + columnIndex + ")").css({ "min-width": width + "px", "width": width + "px" });
                this.container.find("table thead td:nth-child(" + columnIndex + ") .text").css({ "min-width": (width - (this.editable ? 5 : 15)) + "px", "width": (width - (this.editable ? 5 : 15)) + "px" });
                this.container.find("table tbody " + gridBuilderGlobal.gridBodyRowsFind + " td:nth-child(" + columnIndex + ")").css({ "min-width": width + "px", "width": width + "px" });
                this.container.find("table tbody " + gridBuilderGlobal.gridBodyRowsFind + " td:nth-child(" + columnIndex + ") .text").css({ "min-width": (width - 1) + "px", "width": (width - 1) + "px" });
                this.container.find(".sum-footer div:nth-child(" + columnIndex + ")").css({ "min-width": width + "px", "width": width + "px" });
                if (!this.editable && !this.container.find(".grid-header .grid-header-buttons .container-more").hasClass("notify-change"))
                    this.container.find(".grid-header .grid-header-buttons .container-more").addClass("notify-change");

                if (this.columnHeaderGrouping) {
                    var groupName = this.container.find("table thead tr:not(.row-filter) td:eq(" + (columnIndex - 1) + ")").attr("data-group");
                    width = 0;
                    this.container.find("table thead tr:not(.row-filter) td[data-group='" + groupName + "']").each(function () {
                        width += Math.round(Number($(this).css("width").replace("px", "")));
                    });
                    this.container.find(".table-header-grouping div[data-group='" + groupName + "']").css({ "min-width": width + "px", "width": width + "px" });
                }
            };
            jsGridView.prototype.resetPaging = function () {
                this.selectionViewMode = false;
                if (this.offlinePaging)
                    this.filterRecordsJson = null;

                this.goto(1);
            };
            jsGridView.prototype.offEvents = function () {
                $("#" + this.getId() + "popup.context-menu-container").off("mousedown");
                $("#" + this.getId() + "selection.context-menu-container").off("mousedown");

                this.container.off("focus keydown mouseup mousedown touchstart touchend");
                this.container.find(".grid-footer .ico-summery .dropdown-menu li").off("click");
                this.container.find("thead tr.row-filter").off("click change keydown");
                this.container.find(".grid-header .ico-filter").off("click");
                this.container.find(".grid-header .ico-refresh").off("click");
                this.container.find(".grid-header .ico-tag-related").off("mousedown click");
                this.container.find(".grid-header .ico-tag-filter").off("mousedown click");
                this.container.find(".grid-header .manage-tag").off("mousedown click");

                this.tagRelatedContainer().find(".label-manage").off("click");
                this.tagRelatedContainer().find(".button-accept").off("click");
                this.tagRelatedContainer().find(".button-default").off("click");

                this.tagFilterContainer().find(".button-accept").off("click");
                this.tagFilterContainer().find(".button-clear").off("click");
                this.tagFilterContainer().find(".button-cancel").off("click");

                this.tagManageContainer().find(".button-accept").off("click");
                this.tagManageContainer().find(".button-default").off("click");
                this.tagManageContainer().find(".create-tag").off("click");
                this.tagManageContainer().find(".edit-tag").off("click");
                this.tagManageContainer().find(".delete-tag").off("click");

                this.container.find(".grid-footer .grid-selection").off("click");
                this.container.find(".grid-footer .grid-selection-delete").off("click");

                this.container.find(".grid-header .container-more .dropdown-menu li").off("click");
                this.container.find(".grid-header .customize-field").off("click");
                this.container.find(".grid-header .adjust-field").off("click");
                this.container.find(".grid-header .ico-more").off("click");
                this.container.find(".grid-header .import-excel").off("click");
                this.container.find(".grid-header .sample-excel").off("click");
                this.container.find(".grid-header .export-excel").off("click");
                this.container.find(".grid-header .export-xml").off("click");
                this.container.find(".grid-header .import-xml").off("click");

                this.container.find(".grid-footer .ico-prev").off("click");
                this.container.find(".grid-footer .ico-next").off("click");
                this.container.find(".grid-footer .ico-go").off("click");

                this.container.find(".sum-footer .sum-footer-item").off("click");
                this.container.find("thead").off("mousemove");
                this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']").off("click");
                this.container.find("thead tr:not('.row-filter')").off("click dblclick mousedown mouseup touchstart touchend");
                this.container.find("tbody").off("click dblclick keydown mousedown mouseup touchstart touchend");
                this.container.find(".grouping").off("mouseup touchend click");
                this.container.find(".grid-empty svg").off("click");
                this.container.find("td.column-select .move").attr("hidden", "hidden");
            };
            jsGridView.prototype.eventPopupMenu = function (rowIndex, event) {
                var existEvent = false;
                var that = this;
                this.shortKeys.forEach(function (item, index) {
                    if (existEvent || !item)
                        return;
                    var shortcut = "";
                    item.split("+").forEach(function (key) {
                        shortcut += (shortcut !== "" ? " && " : "") + (key === "ctrlkey" ? "event.ctrlKey" : (key === "shiftkey" ? "event.shiftKey" : "event.keyCode === " + key));
                    });
                    if (eval(shortcut)) {
                        const $popupMenu = $("#" + that.getId() + "popup.context-menu-container");
                        $popupMenu.attr("data-row-index", rowIndex);
                        $popupMenu.find(">div:eq(" + index + ")").trigger("mousedown");
                        $popupMenu.attr("keyboard", "1");
                        $popupMenu.find(">div:eq(" + index + ")").trigger("mouseup");

                        existEvent = true;
                    }
                });
                return existEvent;
            };
            jsGridView.prototype.setColumnVisibility = function (column, hidden) {
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                columnIndex++;
                if (hidden) {
                    this.container.find("thead tr:not('.row-filter') td:nth-child(" + columnIndex + ")").attr("hidden", "hidden");
                    this.container.find("thead tr.row-filter td:nth-child(" + columnIndex + ")").attr("hidden", "hidden");
                    this.container.find("tbody tr td:nth-child(" + columnIndex + ")").attr("hidden", "hidden");
                    this.container.find(".sum-footer div:nth-child(" + columnIndex + ")").attr("hidden", "hidden");

                } else {
                    this.container.find("thead tr:not('.row-filter') td:nth-child(" + columnIndex + ")").removeAttr("hidden");
                    this.container.find("thead tr.row-filter td:nth-child(" + columnIndex + ")").removeAttr("hidden");
                    this.container.find("tbody tr td:nth-child(" + columnIndex + ")").removeAttr("hidden");
                    this.container.find(".sum-footer div:nth-child(" + columnIndex + ")").removeAttr("hidden");
                }
                this.reGroupingHeader();
            };
            jsGridView.prototype.selectColumn = function (header, event) {
                if (this.columnHeaderGrouping)
                    return;
                var that = this;
                event.preventDefault();
                var userEvent = new UserEvent(event);
                this.selectedHeader = header;
                this.selectedHeaderOffset = userEvent.event.pageX;
                var sourceIndex = this.selectedHeader.index() + 1;
                var cells = [];

                this.container.find("tr td:nth-child(" + sourceIndex + ")").each(function (cellIndex, cell) {
                    cells[cells.length] = cell;
                });

                this.draggableContainer = $("<div/>");
                this.draggableContainer.addClass("js-grid-view-contents");
                this.draggableContainer.css({
                    position: "absolute",
                    left: userEvent.event.pageX + this.offsetX,
                    top: userEvent.event.pageY + this.offsetY
                });

                var dragTable = this.createDraggableTable(header);
                this.draggableContainer.append(dragTable);
                $("body").append(this.draggableContainer);
                this.container.on("mousemove touchmove", function (e) {
                    that.moveColumn($(header), e);
                });
                $(".js-grid-view-contents").on("mouseup touchend",
                    function () {
                        that.cancelColumn();
                    });
            };
            jsGridView.prototype.moveColumn = function (header, event) {
                event.preventDefault();
                if (this.selectedHeader !== null) {
                    var userEvent = new UserEvent(event);
                    this.draggableContainer.css({
                        left: userEvent.event.pageX + this.offsetX,
                        top: userEvent.event.pageY + this.offsetY
                    });
                    if (Math.abs(userEvent.event.pageX - this.selectedHeaderOffset) > 10) {
                        this.draggableContainer.show();
                        this.selectedHeader.attr("data-drag", "true");
                    }
                }
            };
            jsGridView.prototype.dropColumn = function (targetHeader, event) {
                var that = this;
                if (event)
                    event.preventDefault();
                if (!this.selectedHeader)
                    return;

                var imgClose = "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 24 24' version='1.1' class='img-close'><g><path  d='M 5.625 4.21875 L 4.21875 5.625 L 10.59375 12 L 4.21875 18.375 L 5.625 19.78125 L 12 13.40625 L 18.375 19.78125 L 19.78125 18.375 L 13.40625 12 L 19.78125 5.625 L 18.375 4.21875 L 12 10.59375 Z '></path></g></svg>";
                if (targetHeader.hasClass("grouping")) {
                    this.container.find(".grouping-tags").prepend("<li class='grouping-tag' data-id='" + this.selectedHeader.attr("data-id") + "' data-width='" + Math.round(Number(this.selectedHeader.css("width").replace("px", ""))) + "' data-index='" + this.selectedHeader.index() + "'><div class='img-drag'>" + gridBuilderGlobal.indicatorIcon + "</div><span>" + this.selectedHeader.text() + "</span>" + imgClose + "</li>");
                    this.setColumnVisibility(this.selectedHeader.index(), true);
                    this.container.find(".grouping-tags li.grouping-drag-help").attr("hidden", "hidden");
                    this.cancelColumn();
                    this.resetPaging();
                    return;
                }
                var sourceIndex = this.selectedHeader.index() + 1;
                var targetIndex = targetHeader.index() + 1;
                if (event) {
                    var userEvent = new UserEvent(event);
                    if (userEvent.isTouchEvent) {
                        targetHeader = $(document.elementFromPoint(userEvent.event.clientX, userEvent.event.clientY));
                        targetIndex = $(targetHeader).prevAll().length + 1;
                    }
                }
                if (sourceIndex !== targetIndex) {
                    var cells = [];
                    var cellFilter;
                    var cellFooter;
                    var tableColumns = this.container.find("thead tr:not('.row-filter') td:not('.extend-header')").length;
                    this.container.find("tbody tr td:nth-child(" + sourceIndex + ")").each(function (cellIndex, cell) {
                        cells[cells.length] = cell;
                        $(cell).remove();
                    });
                    this.container.find("thead tr.row-filter td:nth-child(" + sourceIndex + ")").each(function (cellIndex, cell) {
                        cellFilter = cell;
                        $(cell).remove();
                    });
                    this.container.find(".sum-footer div:nth-child(" + sourceIndex + ")").each(function (cellIndex, cell) {
                        cellFooter = cell;
                        $(cell).remove();
                    });
                    $(that.selectedHeader).remove();

                    if (targetIndex >= tableColumns) {
                        targetIndex = tableColumns - 1;
                        this.insertCells(cells, cellFilter, cellFooter, targetIndex, function (cell, element) {
                            $(cell).after(element);
                        });
                    }
                    else {
                        this.insertCells(cells, cellFilter, cellFooter, targetIndex, function (cell, element) {
                            $(cell).before(element);
                        });
                    }
                    if (!this.editable && !this.container.find(".grid-header .grid-header-buttons .container-more").hasClass("notify-change"))
                        this.container.find(".grid-header .grid-header-buttons .container-more").addClass("notify-change");
                    this.cancelColumn();
                    this.rebind();
                }
                else
                    this.cancelColumn();
            };
            jsGridView.prototype.cancelColumn = function () {
                this.container.off("mousemove touchmove");
                $(".js-grid-view-contents").remove();
                this.draggableContainer = null;
                this.selectedHeader = null;
                this.selectedHeaderOffset = null;
            };
            jsGridView.prototype.createDraggableTable = function (header) {
                var table = $("<table/>");
                var thead = $("<thead/>");
                var tr = $("<tr/>");
                var th = $("<td/>");
                $(table).css({ "background-color": "#eff2f5" });
                $(th).css({ "height": "24px", "display": "block", "padding-right": "4px" });
                $(table).width($(header).width());
                $(th).html($(header).html());
                $(tr).append(th);
                $(thead).append(tr);
                $(table).append(thead);
                return table;
            };
            jsGridView.prototype.insertCells = function (cells, cellFilter, cellFooter, columnIndex, callback) {
                var that = this;
                this.container.find("thead tr:not('.row-filter') td:nth-child(" + columnIndex + ")").each(function (cellIndex, cell) {
                    callback(cell, $(that.selectedHeader));
                });
                this.container.find("thead tr.row-filter td:nth-child(" + columnIndex + ")").each(function (cellIndex, cell) {
                    callback(cell, cellFilter);
                });
                this.container.find("tbody tr td:nth-child(" + columnIndex + ")").each(function (cellIndex, cell) {
                    callback(cell, $(cells[cellIndex]));
                });
                this.container.find(".sum-footer div:nth-child(" + columnIndex + ")").each(function (cellIndex, cell) {
                    callback(cell, cellFooter);
                });
            };
            jsGridView.prototype.sort = function (column, event) {
                var sorts = this.getSortFields();
                var isMultiple = false;
                var sortType = $(column).hasClass("arrow-up") ? "desc" : "asc";
                var $head = this.container.find("thead");
                $head.find("td.arrow-down,td.arrow-up,td .sort-no").removeClass("multiple");
                if (!event.ctrlKey) {
                    $head.find("td").removeClass("arrow-down arrow-up");
                    $head.find("td .sort-no").text("");
                } else if (!$(column).hasClass("arrow-down") && !$(column).hasClass("arrow-up")) {
                    if (sorts) {
                        $head.find("td.arrow-down .sort-no:empty,td.arrow-up .sort-no:empty").text("1");
                        var max = 0;
                        $head.find("td.arrow-down .sort-no,td.arrow-up .sort-no").each(function () {
                            if (Number($(this).text()) > max)
                                max = Number($(this).text());
                        });
                        $(column).find(".sort-no").text(max + 1);
                        isMultiple = true;
                    }
                } else {
                    isMultiple = sorts.split(",").length > 1;
                }
                $(column).removeClass("arrow-down arrow-up").addClass(sortType === "asc" ? "arrow-up" : "arrow-down");
                if (isMultiple)
                    $head.find("td.arrow-down,td.arrow-up,td .sort-no").addClass("multiple");
                this.selectionViewMode = false;
                if (!this.grouping && !this.offlinePagingSortable) {
                    this.reload("sort");
                    return;
                }
                var fieldName = $(column).attr("data-id");
                var isNumeric = $(column).attr("data-mask") === "num" || $(column).attr("data-mask") === "price";
                this.showLoading();
                var json = this.filterRecordsJson ? this.filterRecordsJson : this.offlineRecordsJson;

                json = isNumeric ? this.sortNumeric(json, fieldName, sortType === "desc") : this.sortString(json, fieldName, sortType === "desc");
                if (this.filterRecordsJson)
                    this.filterRecordsJson = json;
                else
                    this.offlineRecordsJson = json;

                this.reload("sort");
            };

            jsGridView.prototype.sortString = function (json, fieldName, descending) {
                return json.sort(function (a, b) {
                    if (descending)
                        return (b[fieldName] ? b[fieldName].toString() : "").localeCompare(a[fieldName] ? a[fieldName].toString() : "");
                    else
                        return (a[fieldName] ? a[fieldName].toString() : "").localeCompare(b[fieldName] ? b[fieldName].toString() : "");
                });
            };
            jsGridView.prototype.sortNumeric = function (json, fieldName, descending) {
                return json.sort(function (a, b) {
                    if (descending)
                        return numberNonCommas(b[fieldName]) - numberNonCommas(a[fieldName]);
                    else
                        return numberNonCommas(a[fieldName]) - numberNonCommas(b[fieldName]);
                });
            };

            jsGridView.prototype.arrayMove = function (fromIndex, toIndex) {
                if (!this.editable)
                    return;
                if (this.offlineRecordsJson) {
                    var element = this.offlineRecordsJson[fromIndex];
                    this.offlineRecordsJson.splice(fromIndex, 1);
                    this.offlineRecordsJson.splice(toIndex, 0, element);
                }
            }

            jsGridView.prototype.showLoading = function () {
                this.container.find(".grid-loading").css("display", "block");
            };
            jsGridView.prototype.closeLoading = function () {
                this.container.find(".grid-loading").css("display", "none");
            };
            jsGridView.prototype.goto = function (goto) {
                var end = Number(this.container.find(".grid-footer .page-end").text());
                if (this.noPaging || this.editable || goto >= 1 && goto <= end) {
                    this.selectionViewMode = false;
                    this.container.find(".grid-footer .page-no").text(goto);
                    this.reload("paging");
                }
            };
            jsGridView.prototype.reload = function (action) {
                if (this.offlinePaging) {
                    var that = this;
                    that.showLoading();
                    setTimeout(function () {
                        var data = that.getOfflineDataByPaging();
                        that.loadData(data, true, action);

                        that.container.find(".sum-footer .sum-footer-item[data-action]").each(function (index, item) {
                            $(".sum-footer-menu").attr("data-target", $(item).attr("data-id"));
                            $(".sum-footer-menu").attr("data-grid", that.getId());

                            $(".sum-footer-menu li[data-footer='" + $(item).attr("data-action") + "']").trigger("click");
                        });
                    }, 50);
                }
                else {
                    if (typeof loadGrid === "function") {
                        loadGrid(this.getId(), { emptyOldData: true, reloadAction: action });
                    }
                }
            };
            jsGridView.prototype.getOfflineRecordsExist = function () {
                var that = this;
                var offlineRecordsJson = this.offlineRecordsJson.filter(x => (that.withLogData ? x._status.newValue : x._status) !== "deleted");
                return offlineRecordsJson;
            };
            jsGridView.prototype.getIndexOfflineRecords = function (dataId) {
                var that = this;
                var rowIndex = this.offlineRecordsJson.findIndex(function (item) {
                    return (that.withLogData ? item.__uid.newValue : item.__uid).toString() === dataId;
                });
                return rowIndex;
            };
            jsGridView.prototype.addNewRow = function (beforeRowIndex) {
                if (!this.editable)
                    return;
                var that = this;
                var $grid = this.container;
                var $tr = $grid.find(".row-edit").clone();
                $tr.removeClass("row-edit");

                var uid = this.guid().split("-")[0];
                $tr.attr("data-id", uid);
                var radif = null;
                $tr.find("td").each(function (cellIndex, cell) {
                    var $cell = $(cell);
                    if (cellIndex === 0) {
                        $cell.html(gridBuilderGlobal.indicatorIcon);
                        if (that.multiSelect)
                            $cell.append("<input type='checkbox' class='checkbox-control'>");
                    }
                    else if ($cell.hasClass("column-context-menu") || $cell.hasClass("column-delete-row"))
                        $cell.html("");
                    else if (!$cell.hasClass("extend-data")) {
                        var width = $cell.width();
                        $cell.html("").append("<div class='text' style='min-width:" + (width - 1) + "px;width:" + (width - 1) + "px'></div>" + (that.editable ? "<div class='edit'></div>" : ""));
                        if ((that.getCellFieldName(cellIndex).toLowerCase() === "radif" || that.getCellFieldName(cellIndex).toLowerCase() === "index") && $cell.attr("disabled") === "disabled") {
                            radif = that.dataStartLazy + that.getRowsCount() + 1;
                            $cell.find(".text").text(radif);
                        }
                    }
                });

                var jsonRowIndex = null;
                if (beforeRowIndex !== null && beforeRowIndex !== undefined) {
                    that.lastStatus = "insert";
                    var $beforeRow = $grid.find("tbody tr:eq(" + this.getIndexTableRow(beforeRowIndex) + ")");
                    $tr.insertBefore($beforeRow);
                    this.reOrderIndex();
                    if (this.editable) {
                        var dataId = $beforeRow.attr("data-id");
                        jsonRowIndex = this.getIndexOfflineRecords(dataId);
                    }
                } else {
                    that.lastStatus = "ctrl-insert";
                    $grid.find("tbody").append($tr);
                    if (this.editable)
                        jsonRowIndex = this.offlineRecordsJson.length;
                }

                var obj = {};
                obj.__uid = this.withLogData ? { oldValue: uid, newValue: uid } : uid;
                obj._status = this.withLogData ? { oldValue: "inserted", newValue: "inserted" } : "inserted";
                this.offlineRecordsJson.splice(jsonRowIndex, 0, obj);
                if (this.editable) {
                    var offlineJson = this.getOfflineRecordsExist();
                    if (offlineJson.length - this.dataStartLazy >= this.pageSize)
                        $grid.find("tbody").find("tbody tr:last-child").remove();
                    this.setGridRowLazy();
                }

                this.checkedEmptyRows();
                this.dragJsGridView();
                var activeElements = $tr.children(gridBuilderGlobal.gridFocusColumnEditModeFind);
                if (activeElements.length > 0)
                    $(activeElements[0]).trigger("dblclick");

                this.setRecordCount();
            };

            jsGridView.prototype.mappingRows = function (dataSet) {
                if (!this.editable || !dataSet || dataSet.length === 0)
                    return null;
                var columns = this.getColumns().split(",");
                var captions = this.getColumnsCaption().split(",");
                var json = this.convertArabicToPersian(JSON.stringify(dataSet));
                var dataRows = JSON.parse(json);
                dataRows.forEach(function (item) {
                    captions.forEach(function (caption, captionIndex) {
                        if (item[caption] !== undefined) {
                            var columnName = columns[captionIndex];
                            item[columnName] = item[caption];
                            delete item[caption];
                        }
                    });
                });
                return dataRows;
            };

            jsGridView.prototype.copyRow = async function (rowIndex) {
                if (!this.editable)
                    return;
                var that = this;
                that.lastStatus = "copyRow";
                var $currentRow = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                var $newRow = $currentRow.clone();
                var uid = this.guid().split("-")[0];
                $newRow.attr("data-id", uid);
                $newRow.insertAfter($currentRow);

                var dataId = $currentRow.attr("data-id");
                var jsonRowIndex = this.getIndexOfflineRecords(dataId);

                var newJson = JSON.parse(JSON.stringify(this.offlineRecordsJson[jsonRowIndex]));
                newJson.__uid = this.withLogData ? { oldValue: uid, newValue: uid } : uid;
                newJson._status = this.withLogData ? { oldValue: "inserted", newValue: "inserted" } : "inserted";
                this.offlineRecordsJson.splice(jsonRowIndex + 1, 0, newJson);

                if (this.keyField) {
                    this.keyField.split(",").forEach(function (key) {
                        that.setCellValue(rowIndex + 1, key, "");
                    });
                }
                var offlineJson = this.getOfflineRecordsExist();
                if (offlineJson.length - this.dataStartLazy >= this.pageSize)
                    this.container.find("tbody").find("tbody tr:last-child").remove();
                this.setGridRowLazy();

                this.dragJsGridView();
                this.reOrderIndex();

                if (that.pgmSumChanged) {
                    if (typeof that.pgmSumChanged === "function")
                        await that.pgmSumChanged();
                    else {
                        if (that.resetTime) {
                            clearTimeout(that.resetTime);
                            that.resetTime = null;
                        }
                        that.resetTime = setTimeout(async function () {
                            await eval(that.pgmSumChanged);
                            clearTimeout(that.resetTime);
                            that.resetTime = null;
                        },
                            500);
                    }
                }

                that.setFocusRow(rowIndex + 1, 0, true);
                that.setRecordCount();
            };
            jsGridView.prototype.deleteRow = async function ($tr) {
                if (!this.editable)
                    return;
                var that = this;
                if ($.isNumeric($tr))
                    $tr = that.container.find("tbody tr:eq(" + that.getIndexTableRow($tr) + ")");
                if ($tr.length === 0)
                    return;
                that.lastStatus = "delete";
                var rowIndex = that.getIndexRow($tr.index());

                var dataId = $tr.attr("data-id");
                var jsonRowIndex = this.getIndexOfflineRecords(dataId);
                if (that.keyField) {
                    var keyValues = "";
                    that.keyField.split(",").forEach(function (key) {
                        var keyValue = that.withLogData ? (that.offlineRecordsJson[jsonRowIndex][key] ? that.offlineRecordsJson[jsonRowIndex][key].newValue : "") : that.offlineRecordsJson[jsonRowIndex][key];
                        keyValues += (keyValue ? keyValue : "");
                    });
                    if (keyValues) {
                        that.withLogData ? that.offlineRecordsJson[jsonRowIndex]._status.newValue = "deleted" : that.offlineRecordsJson[jsonRowIndex]._status = "deleted";
                    }
                    else
                        that.offlineRecordsJson.splice(jsonRowIndex, 1);
                }
                else
                    that.offlineRecordsJson.splice(jsonRowIndex, 1);


                var html;
                var indexRowFocus = -1;
                var indexCell = that.getActiveCellIndex();
                if ($tr.next().length === 1)
                    indexRowFocus = rowIndex;
                else if ($tr.prev().length === 1)
                    indexRowFocus = rowIndex - 1;
                that.container.find($tr).remove();

                var offlineJson = that.getOfflineRecordsExist();
                if (offlineJson.length > that.dataStartLazy + that.pageSize) {
                    var array = [];
                    array.push(offlineJson[that.dataStartLazy + that.pageSize]);
                    html = that.convertJsonToHtml(array).Body;
                    that.container.find("tbody").append(html);
                    indexRowFocus++;
                }
                else if (that.getRowsCount() === 0 && offlineJson.length > 0) {
                    that.lastStatus = null;
                    that.manualScrollTop = null;
                }
                that.setGridRowLazy();

                that.checkedEmptyRows();
                that.reOrderIndex();

                if (that.pgmSumChanged) {
                    if (typeof that.pgmSumChanged === "function")
                        await that.pgmSumChanged();
                    else {
                        if (that.resetTime) {
                            clearTimeout(that.resetTime);
                            that.resetTime = null;
                        }
                        that.resetTime = setTimeout(async function () {
                            await eval(that.pgmSumChanged);
                            clearTimeout(that.resetTime);
                            that.resetTime = null;
                        },
                            500);
                    }
                }
                if (indexRowFocus > -1)
                    that.setFocusRow(indexRowFocus, indexCell);
                else
                    that.container.focus();

                that.setRecordCount();
            };
            jsGridView.prototype.clearRows = function () {
                if (!this.editable)
                    return;
                var that = this;
                if (that.keyField) {
                    var deletedIndex = [];
                    that.offlineRecordsJson.forEach(function (item) {
                        var keyValues = "";
                        that.keyField.split(",").forEach(function (key) {
                            var keyValue = that.withLogData ? (item[key] ? item[key].newValue : "") : item[key];
                            keyValues += (keyValue ? keyValue : "");
                        });
                        if (keyValues) {
                            that.withLogData ? item._status.newValue = "deleted" : item._status = "deleted";
                        } else
                            deletedIndex.push(item);
                    });
                    deletedIndex.forEach(function (item) {
                        that.offlineRecordsJson = that.offlineRecordsJson.filter(x => x !== item);
                    });

                } else
                    this.offlineRecordsJson = [];

                that.getRowsElementForDelete().remove();
                this.setRecordCount();
                this.container.find(".grid-header .grid-count").text("0");
                this.container.find(".grid-footer .page-end").text("1");
                this.container.find(".grid-footer .page-no").text("1");
                this.checkedEmptyRows();
            };
            jsGridView.prototype.getSortFields = function () {
                var result = [];
                this.container.find("thead td.arrow-down,thead td.arrow-up").each(function (cellIndex, cell) {
                    result.push({ number: Number($(cell).find(".sort-no").text()), field: "[" + $(cell).attr("data-id") + "]" + ($(cell).hasClass("arrow-down") ? " desc" : " asc") });
                });
                result = this.sortNumeric(result, "number").map(function (item) { return item.field; });
                return result.join();
            };
            jsGridView.prototype.getFilter = function () {
                var that = this;
                var filter = "";
                this.container.find("thead tr:not('.row-filter') td").each(function (index, column) {
                    if ($(column).attr("data-id")) {
                        var input = $(that.container.find("thead tr.row-filter td")[index]).find("input[type='text']");
                        if (input.length === 1) {
                            if ($(input).attr("data-filter") === "null" || $(input).attr("data-filter") === "not-null" || input.val().trim() !== "")
                                filter += (filter === "" ? "" : "~") + $(column).attr("data-id") + "^" + $(input).val().trim() + "^" + $(input).attr("data-filter") + "^" + $(input).attr("data-type");
                        }
                    }
                });
                return filter;
            };
            jsGridView.prototype.getAllColumns = function () {
                var columns = [];
                this.container.find("thead tr:not('.row-filter') td").each(function (cellIndex, cell) {
                    if ($(cell).attr("data-id"))
                        columns.push($(cell).attr("data-id"));
                    else if ($(cell).hasClass("extend-header")) {
                        var extend = $(cell).text().split("|");
                        columns = columns.concat(extend);
                    }
                });
                return columns.join(",");
            };
            jsGridView.prototype.getColumns = function () {
                var columns = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    columns.push($(cell).attr("data-id"));
                });
                return columns.join(",");
            };
            jsGridView.prototype.getColumnsExtend = function () {
                var columns = [];
                var $extend = this.container.find("thead tr:not('.row-filter') td.extend-header");
                if ($extend.length === 1)
                    columns = $extend.text().split("|");
                return columns.join(",");
            };
            jsGridView.prototype.getColumnsMask = function () {
                var masks = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    var type = $(cell).attr("data-mask") ? $(cell).attr("data-mask") : "string";
                    masks.push(type);
                });
                return masks.join(",");
            };
            jsGridView.prototype.getColumnsComma = function () {
                var columns = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    if ($(cell).attr("data-mask") === "price")
                        columns.push($(cell).attr("data-id"));
                });
                return columns.join(",");
            };
            jsGridView.prototype.getColumnsDisabled = function () {
                var columns = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    if ($(cell).attr("disabled") === "disabled")
                        columns.push($(cell).attr("data-id"));
                });
                return columns.join(",");
            };
            jsGridView.prototype.getColumnsVisibility = function () {
                var visibility = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    visibility.push(($(cell).attr("hidden") === "hidden" ? "0" : "1"));
                });
                return visibility.join(",");
            };
            jsGridView.prototype.getColumnsCaption = function () {
                var captions = [];
                this.container.find("thead tr:not('.row-filter') td[data-id] .text").each(function (cellIndex, cellChild) {
                    captions.push($(cellChild).text());
                });
                return captions.join(",");
            };
            jsGridView.prototype.getColumnsWidth = function () {
                var widths = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    widths.push(Math.round(Number($(cell).css("width").replace("px", ""))));
                });
                return widths.join(",");
            };
            jsGridView.prototype.getColumnsType = function () {
                var types = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    types.push($(cell).attr("data-type") ? $(cell).attr("data-type") : "text");
                });
                return types.join(",");
            };
            jsGridView.prototype.getColumnsColor = function () {
                var types = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    types.push($(cell).attr("data-color") ? $(cell).attr("data-color") : "");
                });
                return types.join(",");
            };
            jsGridView.prototype.getColumnsAlign = function () {
                var types = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    types.push($(cell).attr("data-align") ? $(cell).attr("data-align") : "");
                });
                return types.join(",");
            };
            jsGridView.prototype.getColumnsTypeImage = function () {
                var types = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    types.push($(cell).attr("data-type-src") ? $(cell).attr("data-type-src") : "");
                });
                return types.join(",");
            };
            jsGridView.prototype.setColumnCaption = function (column, caption) {
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                this.container.find("thead tr:not('.row-filter') td:eq(" + columnIndex + ") .text").text(caption);
            };

            jsGridView.prototype.getColumnsGrouping = function () {
                var grouping = [];
                if (this.grouping) {
                    this.container.find(".grouping-tags [data-id]").each(function (cellIndex, item) {
                        grouping.push($(item).attr("data-id"));
                    });
                    return grouping.reverse().join(",");
                }
                return this.groupingName;
            };
            jsGridView.prototype.getVisibleCaptions = function () {
                var captions = [];
                this.container.find("thead tr:not('.row-filter') td[data-id] .text").each(function (cellIndex, cellChild) {
                    if (!$(cellChild).closest("td").attr("hidden"))
                        captions.push($(cellChild).text());
                });
                return captions.join(",");
            };
            jsGridView.prototype.getVisibleColumns = function () {
                var columns = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    if (!$(cell).attr("hidden"))
                        columns.push($(cell).attr("data-id"));
                });
                return columns.join(",");
            };
            jsGridView.prototype.getVisibleWidths = function () {
                var widths = [];
                this.container.find("thead tr:not('.row-filter') td[data-id]").each(function (cellIndex, cell) {
                    if (!$(cell).attr("hidden"))
                        widths.push(Math.round(Number($(cell).css("width").replace("px", ""))));
                });
                return widths.join(",");
            };
            jsGridView.prototype.generateColumns = function (columns, captions, widths, commas) {
                var $header = this.container.find("thead tr:not('.row-filter')");
                $header.find("td:not(.column-select):not(.column-tag):not(.extend-header)").remove();
                var columnsArray = columns.split(",");
                var captionsArray = captions.split(",");
                var widthsArray = widths.split(",");
                var commasArray = commas.split(",");
                columnsArray.forEach(function (item, index) {
                    $header.find("td.extend-header").before(`<td data-id="${columnsArray[index]}" style="min-width:${widthsArray[index]}px;width:${widthsArray[index]}px;" ${(commasArray[index] === "1" ? "data-mask='price'" : "")}"><div class="text" style="min-width:${(Number(widthsArray[index]) - 15)}px;width:${(Number(widthsArray[index]) - 15)}px;" title="${captionsArray[index]}">${captionsArray[index]}</div><div class="resize">&nbsp;</div></td>`);
                });
                this.addFilterRow();
            };
            jsGridView.prototype.customizeColumns = function (columns, captions, widths, commas) {
                if (this.editable)
                    return;
                if (!columns || !captions || !widths || columns.split(",").length !== captions.split(",").length || captions.split(",").length !== widths.split(",").length)
                    return;
                var newColumnsArray = columns.split(",");
                var captionsArray = captions.split(",");
                var widthsArray = widths.split(",");
                var commasArray = [];
                if (commas)
                    commasArray = commas.split(",");
                else
                    widthsArray.forEach(function () { commasArray.push("0") });
                var gridColumnArray = this.getColumns().split(",");
                this.showLoading();
                var $extendHeader = this.container.find("thead tr:not('.row-filter') td.extend-header");
                var $rowFilter = this.container.find("thead tr.row-filter");
                var $sumFooter = this.container.find(".sum-footer");
                var extendedFieldArray = $extendHeader.text().split("|");
                var that = this;
                newColumnsArray.forEach(function (column, columnIndex) {
                    var width = Number(widthsArray[columnIndex]);
                    var extendedFieldIndex = extendedFieldArray.indexOf(column);
                    var fieldIndex = that.container.find("thead tr:not('.row-filter') td[data-id='" + column + "']").index();
                    var isComma = commasArray[columnIndex] === "1";
                    var $tdHead = that.container.find("thead tr:not('.row-filter') td:eq(" + fieldIndex + ")");
                    var isDiff = $tdHead.attr("data-mask") !== "price";
                    that.getRowsElement().each(function (rowIndex) {
                        var fieldValue = that.getCellValue(rowIndex, fieldIndex >= 0 ? fieldIndex : column);
                        var booleanType = fieldValue === "true" || fieldValue === "false";
                        if (booleanType)
                            fieldValue = "<span class='checkbox-column" + (fieldValue.toString().toLowerCase() === "true" ? " checked" : "") + "'></span>";
                        else if (isComma)
                            fieldValue = numberWithCommas(fieldValue);
                        if (!gridColumnArray.includes(column)) {
                            var $newColumn = $("<td style='min-width: " + width + "px; width: " + width + "px;'><div class='text' style='min-width: " + (width - 15) + "px; width: " + (width - 15) + "px;' " + (booleanType ? "" : "title='" + fieldValue + "'") + ">" + fieldValue + "</div></td>");
                            var $extendedData = that.container.find("tbody tr:eq(" + that.getIndexTableRow(rowIndex) + ") td.extend-data");
                            $newColumn.insertBefore($extendedData);

                            var extendedValueArray = $extendedData.text().split("|");
                            extendedValueArray.splice(extendedFieldIndex, 1);
                            $extendedData.text(extendedValueArray.join("|"));
                        }
                        else {
                            if (isComma && isDiff) {
                                var rowIndexHtml = that.getIndexTableRow(rowIndex);
                                that.container.find("tbody tr:eq(" + rowIndexHtml + ") td:eq(" + fieldIndex + ") .text").html(fieldValue);
                                that.container.find("tbody tr:eq(" + rowIndexHtml + ") td:eq(" + fieldIndex + ") .text").attr("title", (booleanType ? "" : fieldValue));
                                $tdHead.attr("data-mask", "price");
                                $rowFilter.find("td:eq(" + fieldIndex + ") input").attr("data-mask", "num").attr("data-type", "1");
                                $sumFooter.find("div[data-id='" + column + "']").attr("data-mask", "price");
                            }
                        }
                    });
                    if (!gridColumnArray.includes(column)) {
                        var $newHeaderColumn = $("<td data-id='" + column + "' style='min-width:" + width + "px; width:" + width + "px;'" + (isComma ? " data-mask='price' " : "") + "><div style='min-width:" + (width - 15) + "px; width:" + (width - 15) + "px;' class='text' title='" + captionsArray[columnIndex] + "'>" + captionsArray[columnIndex] + "</div><div class='resize'>&nbsp;</div></td>");
                        $newHeaderColumn.insertBefore($extendHeader);
                        extendedFieldArray.splice(extendedFieldIndex, 1);
                        $extendHeader.text(extendedFieldArray.join("|"));
                        $rowFilter.append("<td style='min-width:" + width + "px;width:" + width + "px;'><div class='ico-filter'>" + gridBuilderGlobal.filterIcon + "</div><input type='text' " + (isComma ? " data-mask='num' " : "") + "data-type='" + (isComma ? "1" : "0") + "' data-filter='contains'></td>");
                        $sumFooter.append("<div data-id='" + column + "' style='min-width:" + width + "px;width:" + width + "px;'" + (isComma ? " data-mask='price' " : "") + ">&nbsp;</div>");
                    }
                });
                gridColumnArray.forEach(function (column) {
                    if (!newColumnsArray.includes(column)) {
                        var fieldIndex = that.container.find("thead tr:not('.row-filter') td[data-id='" + column + "']").index();
                        that.getRowsElement().each(function (rowIndex) {
                            var rowIndexHtml = that.getIndexTableRow(rowIndex);
                            var value = that.getCellValue(rowIndex, column);
                            var $extendedData = that.container.find("tbody tr:eq(" + rowIndexHtml + ") td.extend-data");

                            var extendedValueArray = $extendedData.text().split("|");
                            extendedValueArray.push(value);
                            $extendedData.text(extendedValueArray.join("|"));
                            that.container.find("tbody tr:eq(" + rowIndexHtml + ") td:eq(" + fieldIndex + ")").remove();
                        });
                        that.container.find("thead tr:not('.row-filter') td:eq(" + fieldIndex + ")").remove();
                        extendedFieldArray.push(column);
                        $extendHeader.text(extendedFieldArray.join("|"));
                        $rowFilter.find("td:eq(" + fieldIndex + ")").remove();
                        $sumFooter.find("div[data-id='" + column + "']").remove();
                    }
                });

                gridColumnArray = this.getColumns().split(",");
                newColumnsArray.forEach(function (column, columnIndex) {
                    var sourceHeader = that.container.find("thead tr:not('.row-filter') td[data-id='" + column + "']");
                    var sourceWidth = sourceHeader[0].offsetWidth;
                    var sourceCaption = sourceHeader.find(".text").text();
                    var gridColumnIndex = gridColumnArray.indexOf(column);
                    if (gridColumnIndex !== columnIndex) {
                        that.selectedHeader = sourceHeader;
                        var targetHeader = that.container.find("thead tr:not('.row-filter') td[data-id='" + gridColumnArray[columnIndex] + "']");
                        that.dropColumn(targetHeader);
                        gridColumnArray = that.getColumns().split(",");
                    }
                    if (widthsArray[columnIndex] !== sourceWidth) {
                        var cellIndex = that.getCellIndex(column);
                        that.resizeColumn(cellIndex, widthsArray[columnIndex]);
                    }
                    if (captionsArray[columnIndex] !== sourceCaption) {
                        sourceHeader.find(".text").text(captionsArray[columnIndex]);
                        sourceHeader.find(".text").attr("title", captionsArray[columnIndex]);
                    }
                });
                if (!this.editable)
                    this.container.find(".grid-header .grid-header-buttons .container-more").removeClass("notify-change");
                this.closeLoading();
            };
            jsGridView.prototype.getRowsElement = function (onlyRowsSelected) {
                var rowsElement = this.container.find("tbody " + gridBuilderGlobal.gridBodyRowsFind + (onlyRowsSelected ? ".selected" : ""));
                return rowsElement;
            };
            jsGridView.prototype.getRowsElementForDelete = function () {
                var rowsElement = this.container.find("tbody " + gridBuilderGlobal.gridBodyRowsDeleteFind);
                return rowsElement;
            };
            jsGridView.prototype.getCurrentPageNumber = function () {
                return Number(this.container.find(".grid-footer .page-no").text());
            };
            jsGridView.prototype.getRowsCount = function () {
                var rowCount = this.getRowsElement().length;
                return rowCount;
            };
            jsGridView.prototype.getIndexRow = function (index) {
                return (this.editable ? (index - (this.canModify ? 3 : 2)) : index) / (this.expandable ? 2 : 1);
            };
            jsGridView.prototype.getIndexTableRow = function (index) {
                return (this.editable ? index + (this.canModify ? 3 : 2) : index) * (this.expandable ? 2 : 1);
            };
            jsGridView.prototype.getActiveRowIndex = function () {
                var activeRowIndex = -1;
                var $popupMenu = $("#" + this.getId() + "popup.context-menu-container");
                if ($popupMenu && $popupMenu.attr("data-row-index")) {
                    activeRowIndex = Number($popupMenu.attr("data-row-index"));
                    return activeRowIndex;
                }
                else if (this.editable) {
                    if (this.container.find("tbody tr[data-edit='true']").length > 0) {
                        activeRowIndex = this.container.find("tbody tr[data-edit='true']").index();
                    }
                    if (activeRowIndex === -1) {
                        activeRowIndex = this.container.find("tbody tr td[data-active='true']").closest("tr").index();
                        if (activeRowIndex === -1)
                            return activeRowIndex;
                    }
                } else {
                    activeRowIndex = this.container.find("tbody tr.active").index();
                    if (activeRowIndex === -1)
                        return activeRowIndex;
                }
                return this.getIndexRow(activeRowIndex);
            };
            jsGridView.prototype.setActiveRowIndex = async function (index) {
                if (this.editable)
                    return;
                var activeRowIndex = this.getActiveRowIndex();
                var that = this;
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(index) + ")");
                if ($tr.length === 0)
                    return;
                $tr.focus();
                if (activeRowIndex === index)
                    return;
                this.container.find("tbody tr.active").removeClass("active");
                $tr.addClass("active");

                if (this.rowChanged) {
                    if (typeof this.rowChanged === "function")
                        await this.rowChanged(index);
                    else {
                        if (that.resetTimeFocus) {
                            clearTimeout(that.resetTimeFocus);
                            that.resetTimeFocus = null;
                        }
                        if (!that.resetTime) {
                            that.resetTimeFocus = setTimeout(async function () {
                                await eval(that.rowChanged);
                            }, 100);
                        }
                    }
                }

                if (typeof setLevelInfoAsync === "function")
                    await setLevelInfoAsync(that.getId());
            };
            jsGridView.prototype.getActiveCellIndex = function () {
                return this.container.find("tbody tr td[data-active='true']").index();
            };
            jsGridView.prototype.getActiveRowCellValue = function (column) {
                var rowIndex = this.getActiveRowIndex();
                var fieldValue = this.getCellValue(rowIndex, column);
                return fieldValue;
            };
            jsGridView.prototype.setActiveRowCellValue = function (column, value) {
                var rowIndex = this.getActiveRowIndex();
                this.setCellValue(rowIndex, column, value);
            };
            jsGridView.prototype.getSelectedRowsCellValue = function (column) {
                if (this.editable)
                    return "";
                var that = this;
                var result = [];
                this.container.find("tbody tr.selected").each(function (index, row) {
                    result.push(that.getCellValue(that.getIndexRow($(row).index()), column));
                });
                return result;
            };
            jsGridView.prototype.getSelectedRowsIndex = function () {
                if (this.editable)
                    return "";
                var that = this;
                var result = [];
                this.container.find("tbody tr.selected").each(function (index, row) {
                    result.push(that.getIndexRow($(row).index()));
                });
                return result;
            };
            jsGridView.prototype.getSelectedRowsCount = function () {
                if (this.editable)
                    return 0;
                var count = this.container.find("tbody tr.selected").length;
                return count;
            };
            jsGridView.prototype.getSelectedRowsHtml = function () {
                if (this.editable)
                    return "";
                var selectedRows = this.container.find("tbody tr.selected");
                return selectedRows;
            };
            jsGridView.prototype.loadData = async function (dataList, emptyOldData, reloadAction) {
                var json = this.convertArabicToPersian(JSON.stringify(dataList));
                var dataSet = JSON.parse(json);
                var that = this;
                if (dataSet && Array.isArray(dataSet) && dataSet.length > 0 && (dataSet[0][Object.keys(dataSet[0])[0]] == null || dataSet[0][Object.keys(dataSet[0])[0]].oldValue === undefined)) {
                    var columnNames = that.getColumns().split(",");
                    var columnCaptions = that.getColumnsCaption().split(",");
                    dataSet.forEach(function (item) {
                        if (that.withLogData) {
                            for (var key in item) {
                                var index = columnNames.findIndex(x => x === key);
                                item[key] = { oldValue: item[key], newValue: item[key], caption: index > -1 ? columnCaptions[index] : key }
                            }
                        }
                        if (!item.__uid) {
                            var uid = that.guid().split("-")[0];
                            item.__uid = that.withLogData ? { oldValue: uid, newValue: uid } : uid;
                        }
                        if (!item._status)
                            item._status = that.withLogData ? { oldValue: "inserted", newValue: "inserted" } : "inserted";
                    });
                }
                var data;
                if (that.groupingName && Array.isArray(dataSet)) {
                    this.filterRecordsJson = null;
                    this.offlineRecordsJson = dataSet;
                    dataSet = that.getOfflineDataByPaging();
                }
                if (dataSet.Body || dataSet.Body === "")
                    data = dataSet;
                else {
                    if (!reloadAction && this.container.attr("data-auto-column") === "true" && this.container.find("thead tr:not('.row-filter') td[data-id]").length <= 1) {
                        this.container.find("thead tr:not('.row-filter') td[data-id]").remove();
                        if (dataSet.length > 0) {
                            var width = (100 - (that.editable ? 5 : 15));
                            Object.keys(dataSet[0]).forEach(function (item) {
                                if (item !== "__rowno_" && item !== "__rc") {
                                    that.container.find("thead tr:not('.row-filter') td.extend-header").before("<td data-id='" + item + "' style='min-width:100px;width:100px;'><div class='text' style='min-width:" + width + "px;width:" + width + "px;' title='" + item + "'>" + item + "</div></td>");
                                }
                            });
                        }
                        this.addFilterRow();
                        this.rebind();
                    }
                    data = this.convertJsonToHtml(dataSet);
                }

                if (data.Body || data.Body === "") {
                    this.container.find("table").removeClass("with-sum-footer");
                    this.container.find(".grid-footer .ico-summery").hide();
                    if (!this.grouping)
                        this.container.find(".sum-footer").hide();
                    var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                    this.container.find(".grid-footer .ico-summery span.dropdown-toggle").html("<img src='" + this.baseUrl + "img/grid/summery.svg' />");
                    $checkedAll.prop("checked", false);
                    this.container.find(".grid-footer .grid-selection").removeAttr("data-view-all");
                    this.container.find(".grid-footer .grid-selection-delete ").html("");
                    this.container.find(".grid-header").removeClass("selection-filter");
                    this.container.find(".grid-header .grid-title .grid-title-count").text(gridBuilderGlobal.dictionary.item + ":");
                    if (this.selectionList.length === 0)
                        this.container.find(".grid-footer .grid-selection").text("");
                    else
                        this.container.find(".grid-footer .grid-selection").text(gridBuilderGlobal.dictionary.viewSelected + " (" + this.selectionList.length + " " + gridBuilderGlobal.dictionary.item + ") ");

                    if (emptyOldData === undefined || emptyOldData === "")
                        emptyOldData = true;

                    if (data.reloadData === undefined)
                        data.reloadData = true;

                    if (!this.editable || emptyOldData) {
                        if (this.editable && data.reloadData) {
                            this.clearRows();
                        } else
                            this.getRowsElementForDelete().remove();
                    }

                    if (!this.editable && this.offlinePaging && data.reloadData) {
                        this.container.find("thead tr.row-filter input[type='text']").val("");
                        this.filterRecordsJson = null;
                        this.offlineRecordsJson = data.BodyJson;
                    }
                    else if (this.editable && data.BodyJson) {
                        this.filterRecordsJson = null;
                        this.offlineRecordsJson = this.offlineRecordsJson.concat(data.BodyJson);
                        if (data.BodyJson.length > 0 && data.BodyJson[0].radif) {
                            this.offlineRecordsJson.forEach(function (item, index) {
                                that.withLogData ? item.radif.newValue = index + 1 : item.radif = index + 1;
                            });
                        }
                    }
                    this.container.find("tbody").append(data.Body);
                    if (this.editable && data.BodyJson && data.BodyJson.length > 0 && (data.BodyJson[0].radif || data.BodyJson[0].index || data.BodyJson[0].Index)) {
                        that.reOrderIndex();
                    }
                    if (data.TotalRecord > 0 && !this.editable) {
                        if (!data.ExtendHeader)
                            data.ExtendHeader = "";
                        if (!data.DefaultExtendHeader)
                            data.DefaultExtendHeader = "";
                        this.defaultExtendedColumns = data.DefaultExtendHeader.split("|").join(",");
                        this.container.find("thead tr:not('.row-filter') td.extend-header").html(data.ExtendHeader);
                    }
                    var selectedRowsCount = this.getSelectedRowsCount();
                    if (this.selectionViewMode) {
                        this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']").prop("checked", true);
                        this.container.find(".grid-footer .grid-selection").attr("data-view-all", "true");
                        this.container.find(".grid-footer .grid-selection").text(gridBuilderGlobal.dictionary.viewAll);
                        this.container.find(".grid-footer .grid-selection-delete").html(gridBuilderGlobal.dictionary.deleteSelected);
                        this.container.find(".grid-header").addClass("selection-filter");
                        this.container.find(".grid-header .grid-title .grid-title-count").text(gridBuilderGlobal.dictionary.selected + ":");
                    }
                    else if (this.multiSelect) {
                        var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                        var isCheckedAll = $checkedAll.attr("data-state") === "all" || (selectedRowsCount > 0 && this.getRowsCount() === selectedRowsCount);
                        $checkedAll.prop("checked", isCheckedAll);
                    }

                    if (data.TotalRecord || data.TotalRecord === 0)
                        this.container.find(".grid-header .grid-count").text(data.TotalRecord);
                    if (data.PageNumber)
                        this.container.find(".grid-footer .page-no").text(data.PageNumber);
                    if (data.TotalPage)
                        this.container.find(".grid-footer .page-end").text(data.TotalPage);
                    if (!this.grouping) {
                        if (!this.offlinePaging && data.SumFooter)
                            this.container.find(".grid-footer .ico-summery").show();
                    }

                    if ($checkedAll.attr("data-state") === "all")
                        this.container.find(".grid-footer .grid-selection-all").text(gridBuilderGlobal.dictionary.selectedItems + " (" + this.getRecordCount() + " " + gridBuilderGlobal.dictionary.item + ") ");

                    this.dragJsGridView();
                    this.checkedEmptyRows();
                    if (!((!this.editable || emptyOldData) && this.enabled))
                        this.setEnabled(this.enabled);

                    var types = data.ColumnsType ? data.ColumnsType.split(",") : null;
                    this.container.find("thead tr.row-filter td input[type='text']").each(function (index, input) {
                        var $input = $(input);
                        var columnIndex = $input.closest("td").index();
                        if ($input.length === 1) {
                            if (types && $input.attr("data-type") !== "2") {
                                $input.attr("data-type", types[index]);
                                if ($input.attr("data-type") === "1") {
                                    $input.attr("data-mask", "num");
                                    var $column = that.container.find("thead tr:not('.row-filter') td:eq(" + columnIndex + ")");
                                    if (!$column.attr("data-mask")) {
                                        $column.attr("data-mask", "num");
                                        if (that.grouping) {
                                            var dataId = $column.attr("data-id");
                                            var $footerItem = that.container.find(".sum-footer .sum-footer-item[data-id='" + dataId + "']");
                                            if (!$footerItem.attr("data-mask")) {
                                                $footerItem.attr("data-mask", "num");
                                                $footerItem.text(".....");
                                            }
                                        }
                                    }
                                } else
                                    $input.removeAttr("data-mask");
                            }
                        }
                    });

                    if (typeof setLevelInfoAsync === "function")
                        await setLevelInfoAsync(this.getId());

                    if (that.rowChanged) {
                        if (typeof that.rowChanged === "function")
                            await that.rowChanged(that.getActiveRowIndex());
                        else {
                            await eval(that.rowChanged);
                        }
                    }
                    //(data.reloadData || selectedRowsCount > 0) && 
                    if (that.pgmSumChanged) {
                        if (typeof that.pgmSumChanged === "function")
                            await that.pgmSumChanged();
                        else
                            await eval(that.pgmSumChanged);
                    }

                    if (!this.editable && data.TotalRecord === 0) {
                        var sumWidth = 0;
                        this.container.find("thead tr:not(.row-filter) td").each(function () {
                            sumWidth += this.offsetWidth;
                        });
                        this.container.find("tbody").css({ "width": sumWidth + "px", "height": "1px" });
                    }
                    else {
                        if (this.editable && data.TotalRecord > this.pageSize) {
                            this.container.find("tbody").css({ "width": "", "height": (data.TotalRecord * that.rowHeight) + "px" });
                        } else
                            this.container.find("tbody").css({ "width": "", "height": "" });
                    }
                }

                this.closeLoading();
                if (that.afterLoaded)
                    that.afterLoaded();
            };
            jsGridView.prototype.sleep = function (ms) {
                return new Promise(resolve => setTimeout(resolve, ms));
            };
            jsGridView.prototype.convertArabicToPersian = function (text) {
                if (!text)
                    return "";
                text = text.toString().replaceAll(String.fromCharCode(1610), String.fromCharCode(1740)).replaceAll(String.fromCharCode(1603), String.fromCharCode(1705));
                return text;
            };
            jsGridView.prototype.isCheckedAllRecords = function () {
                var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                return this.multiSelect && $checkedAll.prop("checked") && $checkedAll.attr("data-state") === "all";
            }
            jsGridView.prototype.getOfflineDataByPaging = function () {
                var that = this;
                function getKeyValues(data) {
                    var keyValues = "";
                    that.keyField.split(",").forEach(function (item) {
                        keyValues += that.withLogData ? (data[item].newValue ? data[item].newValue.toString() : "") : (data[item] ? data[item].toString() : "");
                    });
                    return keyValues;
                }
                var filter = this.getFilter();
                var groupItems = [];
                var columnsGrouping = this.getColumnsGrouping();
                if (columnsGrouping !== "")
                    groupItems = columnsGrouping.split(",");

                if (!this.filterRecordsJson) {
                    var resultJson = this.getOfflineRecordsExist();
                    if (filter !== "") {
                        var arrayColumnFilter = filter.split("~");
                        arrayColumnFilter.forEach(function (search) {
                            var parameter = search.split("^")[0];
                            var values = that.convertArabicToPersian(search.split("^")[1].replaceAll("'", "")).toLowerCase().split("|");
                            const type = search.split("^")[2];
                            switch (type) {
                                case "equals":
                                    resultJson = resultJson.filter(x => values.includes(that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase()));
                                    break;
                                case "not-equal":
                                    resultJson = resultJson.filter(x => !values.includes(that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase()));
                                    break;
                                case "contains":
                                    resultJson = resultJson.filter(x => values.filter(value => that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase().includes(value)).length > 0);
                                    break;
                                case "not-contains":
                                    resultJson = resultJson.filter(x => values.filter(value => that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase().includes(value)).length === 0);
                                    break;
                                case "starts-with":
                                    resultJson = resultJson.filter(x => values.filter(value => that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase().startsWith(value)).length > 0);
                                    break;
                                case "ends-with":
                                    resultJson = resultJson.filter(x => values.filter(value => that.convertArabicToPersian(that.withLogData ? x[parameter].newValue : x[parameter]).trim().toLowerCase().endsWith(value)).length > 0);
                                    break;
                                case "less":
                                    resultJson = resultJson.filter(x => values.filter(value => Number(that.withLogData ? x[parameter].newValue : x[parameter]) < Number(value)).length > 0);
                                    break;
                                case "less-equal":
                                    resultJson = resultJson.filter(x => values.filter(value => Number(that.withLogData ? x[parameter].newValue : x[parameter]) <= Number(value)).length > 0);
                                    break;
                                case "greater":
                                    resultJson = resultJson.filter(x => values.filter(value => Number(that.withLogData ? x[parameter].newValue : x[parameter]) > Number(value)).length > 0);
                                    break;
                                case "greater-equal":
                                    resultJson = resultJson.filter(x => values.filter(value => Number(that.withLogData ? x[parameter].newValue : x[parameter]) >= Number(value)).length > 0);
                                    break;
                            }

                        });
                    }
                    if (groupItems.length > 0) {
                        var result = resultJson.groupByJson(groupItems);
                        var groupRecords = [];
                        result.forEach(function (itemGroup) {
                            groupRecords = groupRecords.concat(itemGroup);
                        });
                        resultJson = groupRecords;
                    }
                    this.filterRecordsJson = resultJson;
                }
                var recordsJson;
                var start = 0;
                var end = 0;
                if (this.selectionViewMode) {
                    recordsJson = this.filterRecordsJson.filter(x => this.selectionList.includes(getKeyValues(x)));
                }
                else if (this.noPaging || this.editable) {
                    recordsJson = this.filterRecordsJson;
                }
                else {
                    start = (this.getCurrentPageNumber() - 1) * this.pageSize;
                    end = start + this.pageSize;
                    recordsJson = this.filterRecordsJson.slice(start, end);
                }
                var data = this.convertJsonToHtml(recordsJson);
                var recordsHtml = data.Body;
                var body = "";
                if (!this.selectionViewMode && groupItems.length > 0) {
                    var i;
                    var $trSummery;
                    var oldCategory = [];
                    var records = $(recordsHtml);
                    var recordIndex = 0;
                    recordsJson.forEach(function (groupRecord, groupIndex) {
                        var groupTrs = [];
                        var category = [];
                        groupItems.forEach(function (column, index) {
                            var groupValue = groupRecord[column];
                            category.push(groupValue);
                            groupTrs.push("<tr data-state='open' data-parent-value='" + category.slice(0, category.length - 1).join(",") + "' data-value='" + category.join(",") + "' class='header-grouping'><td colspan='100' class='group-by-" + (index + 1) + "'><span class='grouping-expand'> - </span>" + groupValue + "</td></tr>");
                        });
                        if (oldCategory.length > 0) {
                            for (i = 0; i < category.length; i++) {
                                if (oldCategory[i] !== category[i]) {
                                    if (that.grouping && groupIndex > 0) {
                                        $trSummery = $(records[groupIndex]).clone();
                                        $trSummery.attr("data-parent-value", oldCategory.join(","));
                                        $trSummery.find("td:first-child").html("");
                                        $trSummery.find("td .text").html("...");
                                        $trSummery.find("td .text").removeAttr("title");
                                        $trSummery.removeClass("row-hover").addClass("row-summery");
                                        body += $trSummery[0].outerHTML;
                                    }
                                    for (var j = i; j < category.length; j++)
                                        body += groupTrs[j];
                                    break;
                                }
                            }
                        } else {
                            for (i = 0; i < category.length; i++)
                                body += groupTrs[i];
                        }
                        $(records[recordIndex]).attr("data-parent-value", category.join(","));
                        $(records[recordIndex]).attr("data-index", start);
                        body += records[recordIndex].outerHTML;
                        if (this.expandable) {
                            $(records[recordIndex + 1]).attr("data-parent-value", category.join(","));
                            $(records[recordIndex + 1]).attr("data-index", start++);
                            body += records[recordIndex + 1].outerHTML;
                            recordIndex += 2;
                        }
                        else
                            recordIndex++;

                        oldCategory = category;
                    });
                    if (this.grouping && this.getCurrentPageNumber() * this.pageSize > this.filterRecordsJson.length) {
                        $trSummery = $(records[recordsJson.length - 1]).clone();
                        $trSummery.attr("data-parent-value", oldCategory.join(","));
                        $trSummery.find("td:first-child").html("");
                        $trSummery.find("td .text").html("...");
                        $trSummery.find("td .text").removeAttr("title");
                        $trSummery.removeClass("row-hover").addClass("row-summery");
                        body += $trSummery[0].outerHTML;
                    }
                }
                else
                    body = recordsHtml;
                var totalRecord = this.selectionViewMode ? recordsJson.length : this.filterRecordsJson.length;
                var pageNumber = this.selectionViewMode ? 1 : this.getCurrentPageNumber();
                var totalPage = this.selectionViewMode ? 1 : Math.ceil(totalRecord / this.pageSize);
                var data = { Body: body, ExtendHeader: data.ExtendHeader, DefaultExtendHeader: data.DefaultExtendHeader, reloadData: false, TotalRecord: totalRecord, PageNumber: pageNumber, TotalPage: totalPage };
                return data;
            };
            jsGridView.prototype.checkedEmptyRows = function () {
                if (!this.editable || !this.canModify)
                    return;
                if (this.getRowsCount() === 0)
                    this.container.find(".grid-empty").show();
                else
                    this.container.find(".grid-empty").hide();
            };
            jsGridView.prototype.expandCollapseGrouping = function (dataValue) {
                var $tr = this.container.find("tbody tr[data-value='" + dataValue + "']");
                if ($tr.attr("data-state") === "open") {
                    $tr.find("span.grouping-expand").html(" + ");
                    $tr.attr("data-state", "close");
                    this.container.find("tbody tr[data-parent-value*='" + dataValue + "']").attr("hidden", "hidden");

                    if (this.container.find("tbody tr.row-hover:not([hidden])").length === 0) {
                        this.container.find("tbody tr.header-grouping td").css("width", "100vw");
                    }
                } else {
                    $tr.find("span.grouping-expand").html(" - ");
                    $tr.attr("data-state", "open");
                    this.container.find("tbody tr[data-parent-value='" + dataValue + "']").removeAttr("hidden");
                    var $subGroups = this.container.find("tbody tr.header-grouping[data-parent-value*='" + dataValue + "']");
                    for (var i = 0; i < $subGroups.length; i++) {
                        if ($($subGroups[i]).attr("data-state") === "open")
                            this.container.find("tbody tr[data-parent-value='" + $($subGroups[i]).attr("data-value") + "']").removeAttr("hidden");
                        else
                            return;
                    }
                    this.container.find("tbody tr.header-grouping td").css("width", "auto");
                }
            };
            jsGridView.prototype.getExportDataArray = function () {
                if (!this.editable)
                    return null;
                var that = this;
                var dataSet = this.getOfflineRecordsExist();
                if (dataSet.length > 0) {
                    var dataRows = JSON.parse(JSON.stringify(dataSet));
                    var columns = this.getColumns().split(",");
                    var captions = this.getColumnsCaption().split(",");
                    dataRows.forEach(function (item) {
                        for (var field in item) {
                            if (!columns.includes(field))
                                delete item[field];
                        }
                        columns.forEach(function (columnName, columnIndex) {
                            if (item[columnName]) {
                                var caption = captions[columnIndex];
                                item[caption] = that.withLogData ? item[columnName].newValue : item[columnName];
                                delete item[columnName];
                            }
                        });
                    });
                    return dataRows;
                }
                return dataSet;

            };
            jsGridView.prototype.getDataArray = function (withDataLog) {
                if (!this.offlinePaging)
                    return null;
                var result = this.offlineRecordsJson;
                if (this.withLogData && !withDataLog) {
                    result = JSON.parse(JSON.stringify(this.offlineRecordsJson));
                    result.forEach(function (item) {
                        for (var field in item)
                            item[field] = item[field].newValue;
                    });
                }
                const info = {};
                info["name"] = this.getId();
                info["entity"] = this.container.attr("data-entity");
                info["keyField"] = this.keyField;
                info["data"] = result;
                return info;

            };
            jsGridView.prototype.aggregateColumn = function (column, action, json) {
                if (!this.offlinePaging)
                    return 0;
                var result = 0;
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }

                if (columnIndex > -1) {
                    var fieldName = this.getCellFieldName(columnIndex);
                    var dataMask = this.getCellDataMask(columnIndex);
                    var isNumeric = dataMask === "price" || dataMask === "num";
                    var resultJson = json ? json : (this.filterRecordsJson ? this.filterRecordsJson : this.offlineRecordsJson);
                    switch (action) {
                        case "sum":
                            result = resultJson.sum(fieldName);
                            result = numberWithCommas(result);
                            break;
                        case "avg":
                            result = resultJson.avg(fieldName, true);
                            result = numberWithCommas(result);
                            break;
                        case "min":
                            if (isNumeric) {
                                result = resultJson.min(fieldName);
                                result = numberWithCommas(result);
                            }
                            else
                                result = ".....";
                            break;
                        case "max":
                            if (isNumeric) {
                                result = resultJson.max(fieldName);
                                result = numberWithCommas(result);
                            }
                            else
                                result = ".....";
                            break;
                        case "none":
                            result = ".....";
                            break;
                    }
                    if (!json)
                        result = this.getSummeryText(action, result);
                }
                return result;
            };
            jsGridView.prototype.getSummeryText = function (action, result) {
                switch (action) {
                    case "sum":
                    case "avg":
                        if (action === "avg")
                            result = "<div class='aggregate-title'>میانگین</div><div class='aggregate-action'>" + result + "</div>";
                        else
                            result = "<div class='aggregate-title'>مجموع</div><div class='aggregate-action'>" + result;
                        break;
                    case "min":
                        result = "<div class='aggregate-title'>کمترین</div><div class='aggregate-action'>" + result;
                        break;
                    case "max":
                        result = "<div class='aggregate-title'>بیشترین</div><div class='aggregate-action'>" + result;
                        break;
                    case "none":
                        result = ".....";
                        break;
                }
                return result;
            }
            jsGridView.prototype.getSumColumn = function (column, onlyRowsSelected) {
                var that = this;
                var result = 0;
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1) {
                    if (onlyRowsSelected && this.getSelectedRowsCount() === 0) {
                        onlyRowsSelected = false;
                    }

                    if (this.offlineRecordsJson.length > 0 && !onlyRowsSelected) {
                        var fieldName = this.getCellFieldName(columnIndex);
                        var dataId = "";
                        var $row = this.container.find("tbody tr[data-edit='true']");
                        if ($row.length === 1)
                            dataId = $row.attr("data-id");

                        var offlineRecordsJson = this.filterRecordsJson ? this.filterRecordsJson : this.getOfflineRecordsExist();
                        offlineRecordsJson.forEach(function (row) {
                            if ((that.withLogData ? row.__uid.newValue : row.__uid) === dataId) {
                                var $column = $row.find("td:eq(" + columnIndex + ")");
                                result += numberNonCommas($column.find(".edit input[type='text']").val(), 0);
                            } else {
                                var value = that.withLogData ? (row[fieldName] ? row[fieldName].newValue : "") : row[fieldName];
                                result += numberNonCommas(value, 0);
                            }
                        });
                    } else {
                        this.getRowsElement(onlyRowsSelected).each(function (rowIndex, row) {
                            var $column = $(row).find("td:eq(" + columnIndex + ")");
                            if ($(row).attr("data-edit") === "true")
                                result += numberNonCommas($column.find(".edit input[type='text']").val(), 0);
                            else
                                result += numberNonCommas($column.find(".text").text(), 0);
                        });
                    }
                }
                return result;
            };
            jsGridView.prototype.getAllDataColumn = function (column, defaultValue) {
                var result = "";
                var that = this;
                this.getRowsElement().each(function (rowIndex) {
                    var value = that.getCellValue(rowIndex, column);
                    result += (rowIndex === 0 ? "" : ",") + (value ? value : (defaultValue !== undefined ? defaultValue : "null"));
                });
                return result;
            };
            jsGridView.prototype.getCellValue = function (rowIndex, column) {
                if (rowIndex === -1)
                    return "";
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                if ($tr.length === 0)
                    return "";
                if (column.toString().toLowerCase() === "__uid")
                    return $tr.attr("data-id") ? $tr.attr("data-id") : "";
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }

                if (columnIndex > -1) {
                    var isPrice = this.getCellDataMask(columnIndex) === "price";
                    var result = "";
                    var $cell = $tr.find("td:eq(" + columnIndex + ")");
                    if ($cell.closest("tr").attr("data-edit") === "true" && $cell.find(".edit input").length === 1) {
                        if ($cell.find(".edit input[type='text']").length === 1)
                            result = $cell.find(".edit input[type='text']").val();
                        else if ($cell.find(".edit input[type='checkbox']").length === 1)
                            result = $cell.find(".edit input[type='checkbox']").prop("checked");
                    } else {
                        var htmlValue = $cell.find(".text").html();
                        if (htmlValue && htmlValue.trim()) {
                            var $cellHtml = $($.parseHTML(htmlValue.trim())[0]);
                            if ($cellHtml.is("span.checkbox-column"))
                                result = $cellHtml.hasClass("checked");
                            else
                                result = $cell.find(".text").text();
                        }
                    }
                    return isPrice ? numberNonCommas(result, 0) : result;
                }
                else {
                    var extendedFields = this.container.find("thead td.extend-header");
                    if (extendedFields.length === 0)
                        return "";
                    if ($.isNumeric(column))
                        return "";
                    var fieldIndex = -1;
                    extendedFields.text().split("|").forEach(function (cell, index) {
                        if (cell.toLowerCase() === column.toLowerCase())
                            fieldIndex = index;
                    });
                    if (fieldIndex === -1)
                        return "";
                    var $extendedValue = $tr.find("td:eq(" + extendedFields.index() + ")");
                    if ($extendedValue.length === 0)
                        return "";
                    var value = $extendedValue.html().split("|")[fieldIndex];
                    return value;
                }
            };
            jsGridView.prototype.setCellValue = function (rowIndex, column, value) {
                if (rowIndex === -1)
                    return;
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                if ($tr.length === 0)
                    return;
                var columnIndex = -1, fieldName;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                var oldValue = "";
                var isPrice = false;
                if (columnIndex > -1) {
                    var $cell = $tr.find("td:eq(" + columnIndex + ")");
                    if ($cell.length === 0)
                        return;


                    fieldName = this.getCellFieldName(columnIndex);
                    isPrice = this.getCellDataMask(columnIndex) === "price";

                    oldValue = this.getCellValue(rowIndex, columnIndex).toString();
                    oldValue = (isPrice && oldValue ? numberNonCommas(oldValue) : oldValue).toString();

                    var newValue = isPrice && value ? numberWithCommas(value) : value;
                    if ($cell.closest("tr").attr("data-edit") === "true" && $cell.find(".edit input").length === 1) {
                        if ($cell.find(".edit input[type='text']").length === 1)
                            $cell.find(".edit input[type='text']").val(newValue);
                        else
                            $cell.find(".edit input[type='checkbox']").prop("checked", newValue);
                    } else {
                        var htmlValue = $cell.find(".text").html();
                        if (htmlValue && htmlValue.trim()) {
                            var $cellHtml = $($.parseHTML(htmlValue.trim())[0]);
                            if ($cellHtml.is("span.checkbox-column"))
                                newValue = "<span class='checkbox-column" + (value ? " checked" : "") + "'></span>";
                        }
                        $cell.find(".text").html(newValue);
                    }
                } else {
                    var extendedFields = this.container.find("thead td.extend-header");
                    if (extendedFields.length === 0)
                        return;
                    if ($.isNumeric(column))
                        return;
                    var fieldIndex = -1;
                    extendedFields.text().split("|").forEach(function (cell, index) {
                        if (cell.toLowerCase() === column.toLowerCase()) {
                            fieldIndex = index;
                            fieldName = cell;
                        }
                    });
                    if (fieldIndex === -1)
                        return;
                    var $extendedValue = $tr.find("td:eq(" + extendedFields.index() + ")");
                    if ($extendedValue.length === 0)
                        return;

                    var extendedValueArray = $extendedValue.html().split("|");
                    extendedValueArray[fieldIndex] = value;
                    $extendedValue.html(extendedValueArray.join("|"));
                }
                if (this.offlinePaging && fieldName) {
                    var dataId = $tr.attr("data-id");
                    var jsonRowIndex = this.getIndexOfflineRecords(dataId);
                    var editedValue = value !== "" ? (isPrice ? numberNonCommas(value) : value) : null;

                    if (this.withLogData) {
                        if (this.offlineRecordsJson[jsonRowIndex][fieldName] === undefined)
                            this.offlineRecordsJson[jsonRowIndex][fieldName] = { oldValue: null, newValue: null };
                    }
                    this.withLogData ? this.offlineRecordsJson[jsonRowIndex][fieldName].newValue = editedValue : this.offlineRecordsJson[jsonRowIndex][fieldName] = editedValue;

                    value = (isPrice ? numberNonCommas(value, 0) : (value !== null && value !== undefined ? value : "")).toString();

                    var $element = this.getCellEditorTemplate(columnIndex);
                    if ($element) {
                        if ($element.hasClass("combo-text"))
                            $element = $element.closest(".system-combo-control");
                        if ($element && oldValue !== value) {
                            if ($element.attr("onchange"))
                                eval($element.attr("onchange"));
                            if (this.cellChanged)
                                this.cellChanged(rowIndex, columnIndex);
                        }
                    }
                }
            };
            jsGridView.prototype.getCellIndex = function (columnName) {
                var columnIndex = -1;
                this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                    if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === columnName.toLowerCase())
                        columnIndex = index;
                });
                return columnIndex;
            };
            jsGridView.prototype.getCellEditor = function (column) {
                if (!this.editable)
                    return null;
                var rowIndex = this.getActiveRowIndex();
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                if ($tr.length === 0 || $tr.attr("data-edit") !== "true")
                    return null;
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1) {
                    var $cell = $tr.find("td:eq(" + columnIndex + ")");
                    if ($cell.find(".edit input").length === 1) {

                        if ($cell.find(".edit .system-combo-control").length === 1)
                            return $cell.find(".edit .system-combo-control .combo-text");
                        else if ($cell.find(".edit input[type='text']").length === 1)
                            return $cell.find(".edit input[type='text']");
                        else
                            return $cell.find(".edit input[type='checkbox']");
                    }
                }
                return null;
            };
            jsGridView.prototype.getCellEditorTemplate = function (column) {
                if (!this.editable)
                    return null;

                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1) {
                    var $element = this.container.find("tbody tr.row-edit td:eq(" + columnIndex + ") input");
                    return $element.length === 1 ? $element : null;
                }
                return null;
            };
            jsGridView.prototype.getCellFieldName = function (columnIndex) {
                return this.container.find("thead tr:not('.row-filter') td:eq(" + columnIndex + ")").attr("data-id");
            };
            jsGridView.prototype.getCellCaption = function (columnIndex) {
                return this.container.find("thead tr:not('.row-filter') td:eq(" + columnIndex + ")").text().trim();
            };
            jsGridView.prototype.getCellDataMask = function (column) {
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1)
                    return this.container.find("thead tr:not('.row-filter') td:eq(" + columnIndex + ")").attr("data-mask");
                return "";
            };
            jsGridView.prototype.setVisibleColumn = function (column, isVisible) {
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1) {
                    if (isVisible) {
                        this.container.find("table thead tr:not('.row-filter') td:eq(" + columnIndex + ")").removeAttr("hidden");
                        this.container.find("thead tr.row-filter").find("td:eq(" + columnIndex + ")").removeAttr("hidden");
                        this.container.find(".sum-footer").find("div:eq(" + columnIndex + ")").removeAttr("hidden");
                        this.container.find("tbody tr").each(function (rowIndex, row) {
                            $(row).find("td:eq(" + columnIndex + ")").removeAttr("hidden");
                        });
                    } else {
                        this.container.find("table thead tr:not('.row-filter') td:eq(" + columnIndex + ")").attr("hidden", "hidden");
                        this.container.find("thead tr.row-filter").find("td:eq(" + columnIndex + ")").attr("hidden", "hidden");
                        this.container.find(".sum-footer").find("div:eq(" + columnIndex + ")").attr("hidden", "hidden");
                        this.container.find("tbody tr").each(function (rowIndex, row) {
                            $(row).find("td:eq(" + columnIndex + ")").attr("hidden", "hidden");
                        });
                    }
                    this.reGroupingHeader();
                }
            };
            jsGridView.prototype.setEnableColumn = function (column, isEnable) {
                if (!this.editable)
                    return;
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }
                if (columnIndex > -1) {
                    if (isEnable) {
                        this.container.find("tbody tr.row-edit").each(function (rowIndex, row) {
                            $(row).find("td:eq(" + columnIndex + ")").removeAttr("disabled");
                            $(row).find("td:eq(" + columnIndex + ") input[type='text']").removeAttr("disabled");
                        });
                    } else {
                        this.container.find("tbody tr.row-edit").each(function (rowIndex, row) {
                            $(row).find("td:eq(" + columnIndex + ")").attr("disabled", "disabled");
                            $(row).find("td:eq(" + columnIndex + ") input[type='text']").attr("disabled", "disabled");
                        });
                    }
                }
            };
            jsGridView.prototype.setEnabledCellEditor = function (column, isEnable) {
                var $element = this.getCellEditor(column);
                if ($element) {
                    var $cell = $element.closest("td");
                    if (isEnable) {
                        $cell.removeAttr("disabled");
                        $element.removeAttr("disabled");
                    }
                    else {
                        $cell.attr("disabled", "disabled");
                        $element.attr("disabled", "disabled");
                    }
                }
            };
            jsGridView.prototype.isEnabledCellEditor = function (column) {
                var $element = this.getCellEditor(column);
                if ($element) {
                    var $cell = $element.closest("td");
                    return $cell.attr("disabled") !== "disabled";
                }
            };

            jsGridView.prototype.isEditMode = function () {
                if (!this.editable)
                    return false;
                var $tr = this.container.find("tbody tr[data-edit='true']");
                return $tr.length === 1;
            };

            jsGridView.prototype.isRowEditMode = function (rowIndex) {
                if (rowIndex < 0 || !this.editable)
                    return false;
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                return $tr.length === 1 && $tr.attr("data-edit") === "true";
            };

            jsGridView.prototype.removeColumn = function (column) {
                var columnArray = column.toString().split(",");
                var container = this.container;
                columnArray.forEach(function (item) {
                    var columnIndex = -1;
                    if ($.isNumeric(item))
                        columnIndex = Number(item);
                    else {
                        container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                            if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === item.toLowerCase())
                                columnIndex = index;
                        });
                    }
                    if (columnIndex > -1) {
                        container.find("table thead tr:not('.row-filter') td:eq(" + columnIndex + ")").remove();
                        container.find("thead tr.row-filter").find("td:eq(" + columnIndex + ")").remove();
                        container.find(".sum-footer").find("div:eq(" + columnIndex + ")").remove();
                        container.find("tbody tr").each(function (rowIndex, row) {
                            $(row).find("td:eq(" + columnIndex + ")").remove();
                        });
                    }
                });
            };
            jsGridView.prototype.setEditRow = function (rowIndex, column, isNext) {
                if (rowIndex < 0 || !this.editable)
                    return;
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                if ($tr.length === 0)
                    return;
                if (column === null || column === undefined)
                    column = 0;
                var activeElements;
                var $cell = null;
                var that = this;
                var columnIndex = -1;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }

                if (columnIndex > -1)
                    $cell = $tr.find("td:eq(" + columnIndex + ")");

                if (($cell === null || $cell.length === 0) && isNext) {
                    that.addNewRow();
                    return;
                }
                if ($cell && $cell.length === 1) {
                    if ($cell.hasClass("column-select") || $cell.hasClass("column-context-menu") || $cell.hasClass("column-delete-row") || $cell.is(":hidden") || $cell.attr("disabled") === "disabled" || $cell.hasClass("extend-data")) {
                        if (isNext !== null && isNext !== undefined) {
                            if (isNext) {
                                activeElements = $cell.nextAll(gridBuilderGlobal.gridFocusColumnEditModeFind);
                                if (activeElements.length > 0)
                                    $cell = $(activeElements[0]);
                                else if ($tr.next().length === 1) {
                                    rowIndex = that.getIndexRow($tr.next().index());
                                    that.setEditRow(rowIndex, 0, isNext);
                                    return;
                                } else {
                                    if (that.canModify)
                                        that.addNewRow();
                                    else {
                                        var tabIndex = that.container.attr("tabindex");
                                        if (tabIndex) {
                                            $("[tabindex='" + (Number(tabIndex) + 1) + "']").focus();
                                        }
                                    }
                                    return;
                                }
                            } else {
                                activeElements = $cell.prevAll(gridBuilderGlobal.gridFocusColumnEditModeFind);
                                if (activeElements.length > 0)
                                    $cell = $(activeElements[0]);
                                else
                                    $cell = null;
                            }
                        }
                        else
                            $cell = null;
                    }
                    if ($tr.attr("data-edit") === "true") {
                        $tr.find("td").removeClass("active").removeAttr("data-active");
                        $cell.attr("data-active", "true");
                        setTimeout(function () { $cell.find(".edit input")[0].focus(); }, 100);
                    }
                    else
                        $cell.trigger("dblclick");
                }
            };
            jsGridView.prototype.setFocusRow = async function (rowIndex, column, isNext) {
                if (rowIndex < 0 || !this.editable)
                    return;
                var $tr = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ")");
                if ($tr.length === 0 || $tr.attr("data-edit") === "true")
                    return;
                if (column === null || column === undefined)
                    column = 0;
                var activeElements;
                var columnIndex = -1;
                var $cell = null;
                if ($.isNumeric(column))
                    columnIndex = Number(column);
                else {
                    this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                        if ($(cell).attr("data-id") && $(cell).attr("data-id").toLowerCase() === column.toLowerCase())
                            columnIndex = index;
                    });
                }

                var that = this;
                if (columnIndex > -1)
                    $cell = $tr.find("td:eq(" + columnIndex + ")");

                if ($cell && $cell.length === 1) {
                    if ($cell.hasClass("column-select") || $cell.hasClass("column-context-menu") || $cell.hasClass("column-delete-row") || $cell.is(":hidden") || $cell.attr("disabled") === "disabled" || $cell.hasClass("extend-data")) {
                        if (isNext !== null && isNext !== undefined) {
                            if (isNext) {
                                activeElements = $cell.nextAll(gridBuilderGlobal.gridFocusColumnEditModeFind);
                                if (activeElements.length > 0)
                                    $cell = $(activeElements[0]);
                                else
                                    $cell = null;

                            } else {
                                activeElements = $cell.prevAll(gridBuilderGlobal.gridFocusColumnEditModeFind);
                                if (activeElements.length > 0)
                                    $cell = $(activeElements[0]);
                                else
                                    $cell = null;
                            }
                        }
                        else
                            $cell = null;
                    }
                    if ($cell && $cell.length === 1) {
                        var activeRowIndex = this.getActiveRowIndex();
                        that.container.find("tbody tr td").removeClass("active").removeAttr("data-active");
                        $cell.addClass("active").attr("data-active", "true");
                        $cell.focus();
                        if (activeRowIndex !== rowIndex) {
                            if (this.rowChanged) {
                                if (typeof this.rowChanged === "function")
                                    await this.rowChanged(rowIndex);
                                else {
                                    if (that.resetTimeFocus) {
                                        clearTimeout(that.resetTimeFocus);
                                        that.resetTimeFocus = null;
                                    }
                                    if (!that.resetTime) {
                                        that.resetTimeFocus = setTimeout(async function () {
                                            await eval(that.rowChanged);
                                        }, 100);
                                    }
                                }
                            }
                        }
                    }
                }
            };
            jsGridView.prototype.onOpenCalculator = function (callback) {
                this.openCalculator = callback;
            };
            jsGridView.prototype.onRowEnterPress = function (callback) {
                this.rowEnterPress = callback;
            };
            jsGridView.prototype.onRowChanged = function (callback) {
                this.rowChanged = callback;
            };
            jsGridView.prototype.onCellChanged = function (callback) {
                this.cellChanged = callback;
            };
            jsGridView.prototype.onPageChanged = function (callback) {
                this.pageChanged = callback;
            };
            jsGridView.prototype.onCellClick = function (callback) {
                this.cellClick = callback;
            };
            jsGridView.prototype.onCellBeforeLostFocus = function (callback) {
                this.cellBeforeLostFocus = callback;
            };
            jsGridView.prototype.onActionClick = function (callback) {
                this.actionClick = callback;
            };
            jsGridView.prototype.onDblClick = function (callback) {
                this.dblClick = callback;
            };
            jsGridView.prototype.onPgmSumChanged = async function (callback) {
                this.pgmSumChanged = callback;
            };
            jsGridView.prototype.onSelectedChanged = function (callback) {
                this.selectedChanged = callback;
            };
            jsGridView.prototype.onAfterLoaded = function (callback) {
                this.afterLoaded = callback;
            };
            jsGridView.prototype.onSetMaskEdit = function (callback) {
                this.setMaskEdit = callback;
            };
            jsGridView.prototype.onGetComboData = function (callback) {
                this.getComboData = callback;
            };
            jsGridView.prototype.onImportClick = function (callback) {
                this.importClick = callback;
            };
            jsGridView.prototype.onExportClick = function (callback) {
                this.exportClick = callback;
            };
            jsGridView.prototype.onExpandChanged = function (callback) {
                this.expandChanged = callback;
            };
            jsGridView.prototype.onStartEditing = function (callback) {
                this.startEditing = callback;
            };
            jsGridView.prototype.onCustomizeFieldClick = function (callback) {
                this.customizeFieldClick = callback;
            };
            jsGridView.prototype.onGetTreeTag = function (callback) {
                this.getTreeTag = callback;
            };
            jsGridView.prototype.onSaveTagRelatedTree = function (callback) {
                this.saveTagRelatedTree = callback;
            };
            jsGridView.prototype.onSaveTagManageTree = function (callback) {
                this.saveTagManageTree = callback;
            };
            jsGridView.prototype.onDisplayItemTags = function (callback) {
                this.displayItemTags = callback;
            };
            jsGridView.prototype.onMenuMoreClick = function (callback) {
                this.menuMoreClick = callback;
            };
            jsGridView.prototype.onActionMenuMoreClick = function (callback) {
                this.actionMenuMoreClick = callback;
            };




            jsGridView.prototype.onDragRowChanged = function (callback) {
                this.dragRowChanged = callback;
            };
            jsGridView.prototype.setSelected = function (rowIndex) {
                if (!this.multiSelect)
                    return;
                if (rowIndex === -1) {
                    var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                    if (!$checkedAll.prop("checked"))
                        $checkedAll.trigger("click");
                }
                else {
                    var $checkBox = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ") td.column-select  input[type='checkbox']");
                    if (!$checkBox.prop("checked"))
                        $checkBox.trigger("click");
                }
            };
            jsGridView.prototype.setUnselected = function (rowIndex) {
                if (!this.multiSelect)
                    return;
                if (rowIndex === -1) {
                    var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                    if ($checkedAll.prop("checked"))
                        $checkedAll.trigger("click");
                    else {
                        this.container.find("tbody tr td.column-select input[type='checkbox']:checked").each(function () {
                            $(this).trigger("click");
                        });
                    }
                }
                else {
                    var $checkBox = this.container.find("tbody tr:eq(" + this.getIndexTableRow(rowIndex) + ") td.column-select  input[type='checkbox']");
                    if ($checkBox.prop("checked"))
                        $checkBox.trigger("click");
                }
            };
            jsGridView.prototype.setRecordCount = function () {
                var rowCount;
                if (this.editable) {
                    var offlineJson = this.getOfflineRecordsExist();
                    rowCount = offlineJson.length;
                }
                else
                    rowCount = this.getRowsCount();

                this.container.find(".grid-header .grid-title .grid-count").text(rowCount);
            };
            jsGridView.prototype.getRecordCount = function () {
                return this.container.find(".grid-header .grid-title .grid-count").text();
            };
            jsGridView.prototype.getCaption = function () {
                return this.container.find(".grid-header .grid-title .grid-caption").text();
            };
            jsGridView.prototype.setCaption = function (caption) {
                this.container.find(".grid-header .grid-title .grid-caption").text(caption);
            };
            jsGridView.prototype.setEnabled = function (enabled) {
                this.enabled = enabled;

                if (this.enabled) {
                    this.container.find("tbody tr").removeClass("disabled");
                    if (this.editable)
                        this.container.find("tbody tr td").css("outline-width", "1px");
                    this.rebind();
                } else {
                    this.container.find("tbody tr").addClass("disabled");
                    this.container.find("tbody tr td").css("outline-width", "0");
                    this.container.find("tbody tr.active").removeClass("active");
                    this.container.find(".grid-empty").hide();
                    this.offEvents();
                }
            };
            jsGridView.prototype.reOrderIndex = function () {
                if (!this.editable)
                    return;
                var that = this;
                var $trs = this.getRowsElement();
                var cellIndex = -1;
                this.container.find("thead tr:not('.row-filter') td").each(function (index, cell) {
                    if ($(cell).attr("data-id") && ($(cell).attr("data-id").toLowerCase() === "radif" || $(cell).attr("data-id").toLowerCase() === "index"))
                        cellIndex = index;
                });
                if ($trs.length > 0 && cellIndex > -1) {
                    $trs.each(function (rowsIndex, row) {
                        var $cell = $(row).find("td:eq(" + cellIndex + ")[disabled='disabled']");
                        if ($cell.length === 0)
                            return;
                        $cell.find(".text").text(that.dataStartLazy + rowsIndex + 1);
                    });
                    this.offlineRecordsJson.forEach(function (item, itemIndex) {
                        if (item.radif !== undefined)
                            that.withLogData ? item.radif.newValue = itemIndex + 1 : item.radif = itemIndex + 1;
                        else if (item.index !== undefined)
                            that.withLogData ? item.index.newValue = itemIndex + 1 : item.index = itemIndex + 1;
                        else if (item.Index !== undefined)
                            that.withLogData ? item.Index.newValue = itemIndex + 1 : item.Index = itemIndex + 1;
                    });
                }
            };
            jsGridView.prototype.dragJsGridView = function () {
                var that = this;
                var startIndex;
                var jsonStartIndex;
                this.getRowsElement().draggable({
                    helper: "clone",
                    handle: ".move",
                    containment: 'parent',
                    cursorAt: { left: 0 },
                    start: function (ev, ui) {
                        startIndex = $(ev.target).index();
                        jsonStartIndex = that.getIndexOfflineRecords($(ev.target).attr("data-id"));
                        var $draggingElement = $(ui.helper);
                        $draggingElement.css({ "width": that.container.width() + "px", left: 0 });
                    }
                }).droppable({
                    tolerance: "intersect",
                    hoverClass: "ui-draggable-activeHover",
                    drop: function (event, ui) {
                        var $newRow = $(ui.draggable);
                        var $currentRow = $(this);
                        var isSuccess = false;
                        if ($newRow.position().top < $currentRow.position().top) {
                            if ($newRow.insertAfter) {
                                isSuccess = true;
                                $newRow.insertAfter($currentRow);
                            }
                        } else if ($currentRow && $currentRow.insertBefore) {
                            isSuccess = true;
                            $newRow.insertBefore($currentRow);
                        }
                        var jsonEndIndex = that.getIndexOfflineRecords($currentRow.attr("data-id"));
                        if (isSuccess) {
                            startIndex = that.getIndexRow(startIndex);
                            var endIndex = that.getIndexRow($newRow.index());
                            that.arrayMove(jsonStartIndex, jsonEndIndex);
                            that.reOrderIndex();
                            if (that.dragRowChanged) {
                                that.dragRowChanged(startIndex, endIndex);
                            }
                        }
                    }
                });
            };
            jsGridView.prototype.endEditGrid = function () {
                var that = this;
                this.container.find("thead").removeAttr("data-resize").removeAttr("data-offset");
                this.container.find("thead td").removeAttr("data-drag");
                this.container.find("tbody tr td").removeClass("active").removeAttr("data-active");
                this.container.find("tbody tr[data-edit='true'] " + gridBuilderGlobal.gridFocusColumnFind).each(function (cellIndex, cell) {
                    var htmlText = "";
                    var value = "";

                    var dataId = $(cell).closest("tr").attr("data-id");
                    var jsonRowIndex = that.getIndexOfflineRecords(dataId);

                    var fieldName = that.getCellFieldName($(cell).index());
                    if (fieldName) {
                        var isComma = false;
                        if ($(cell).find(".edit .system-combo-control").length === 1) {
                            htmlText = $(cell).find(".edit .system-combo-control .combo-text").val();
                            value = htmlText;
                            var comboId = $(cell).find(".edit .system-combo-control").attr("id");
                            window[comboId + "Builder"] = null;

                        } else {
                            var elementArray = $(cell).find(".edit input");
                            if (elementArray.length > 0) {
                                var $element = $(elementArray[0]);
                                htmlText = $element.is("input[type='text']") ? $element.val() : "<span class='checkbox-column" + ($element.prop("checked") ? " checked" : "") + "'></span>";
                                value = $element.is("input[type='text']") ? $element.val() : $element.prop("checked");

                                var dataMask = $element.attr("data-mask");
                                if (dataMask === "price") {
                                    isComma = true;
                                    value = numberNonCommas(value);
                                    htmlText = numberWithCommas(value);
                                }
                                else if (dataMask === "hour-time") {
                                    value = htmlText = numberToHourMinute(value);
                                }
                            }
                        }
                        var editedValue = value !== "" ? value : null;

                        if (that.withLogData) {
                            if (that.offlineRecordsJson[jsonRowIndex][fieldName] === undefined)
                                that.offlineRecordsJson[jsonRowIndex][fieldName] = { oldValue: null, newValue: null };
                        }
                        that.withLogData ? that.offlineRecordsJson[jsonRowIndex][fieldName].newValue = editedValue : that.offlineRecordsJson[jsonRowIndex][fieldName] = editedValue;

                        $(cell).find(".text").html(htmlText);
                        $(cell).find(".text").attr("title", (isComma ? htmlText : value));
                        $(cell).find(".text").show();
                        //setTimeout(function () {
                        $(cell).find(".edit").html("");
                        //}, 10);
                    }
                });
                this.container.find("tbody tr[data-edit='true']").removeAttr("data-edit");
                this.container.closest("body").find(".combo-dropdown-body").remove();
            };
            jsGridView.prototype.hideContextMenu = function () {
                var $popupMenu = $("#" + this.getId() + "popup.context-menu-container");
                $popupMenu.removeAttr("data-row-index");
                $popupMenu.hide();
            };
            jsGridView.prototype.changeSelection = function (rowIndex, checked) {
                if (!this.keepSelection)
                    return;
                var that = this;
                var keyField = this.keyField.split(",");
                var keys = [];
                var keyValues = "";
                if (rowIndex === -1) {
                    that.getRowsElement().each(function (rowIndex) {
                        keyValues = "";
                        keyField.forEach(function (item) {
                            keyValues += that.getCellValue(rowIndex, item);
                        });
                        keys.push(keyValues);
                    });
                } else {
                    keyValues = "";
                    keyField.forEach(function (item) {
                        keyValues += that.getCellValue(rowIndex, item);
                    });
                    keys.push(keyValues);
                }

                if (checked) {
                    keys = keys.filter(x => !this.selectionList.includes(x));
                    this.selectionList = this.selectionList.concat(keys);
                } else
                    this.selectionList = this.selectionList.filter(x => !keys.includes(x));

                if (this.container.find(".grid-footer .grid-selection").attr("data-view-all") !== "true") {
                    if (this.selectionList.length === 0)
                        this.container.find(".grid-footer .grid-selection").text("");
                    else
                        this.container.find(".grid-footer .grid-selection").text(gridBuilderGlobal.dictionary.viewSelected + " (" + this.selectionList.length + " " + gridBuilderGlobal.dictionary.item + ") ");
                }
            };
            jsGridView.prototype.convertJsonToHtml = function (dataSet) {
                var activeRowIndex = this.getActiveRowIndex();
                var pageNumber = this.getCurrentPageNumber();
                var commaCols = this.getColumnsComma().split(",");
                var readOnlyCols = this.getColumnsDisabled().split(",");
                var fields = this.getColumns().split(",");
                var cellVisibility = this.getColumnsVisibility().split(",");
                var columnWidths = this.getColumnsWidth().split(",");
                var columnTypes = this.getColumnsType().split(",");
                var columnTypesSrc = this.getColumnsTypeImage().split(",");
                var columnColors = this.getColumnsColor().split(",");
                var columnsAlign = this.getColumnsAlign().split(",");

                activeRowIndex = activeRowIndex < 0 ? 0 : activeRowIndex;
                if (this.grouping || this.editable)
                    activeRowIndex = -1;
                else if (activeRowIndex === -1)
                    activeRowIndex = 0;

                var maxRecordInPage;
                if (this.selectionViewMode || this.noPaging) {
                    if (!this.editable)
                        activeRowIndex = 0;
                    maxRecordInPage = !dataSet ? 0 : dataSet.length;
                }
                else
                    maxRecordInPage = this.pageSize;
                var tBody = [];
                var gridStructure = { ExtendHeader: null, DefaultExtendHeader: null, ColumnsType: null, SumFooter: false, PageNumber: 1, TotalRecord: 0, TotalPage: 1, BodyJson: [] };

                var that = this;
                if (dataSet && dataSet.length > 0) {
                    var field;
                    var otherFields = [];
                    var defaultOtherFields = [];
                    if (this.editable) {
                        otherFields = this.container.find("thead tr:not('.row-filter') td.extend-header").text().split("|");
                    } else {
                        for (field in dataSet[0]) {
                            if (!fields.includes(field))
                                otherFields.push(field);
                            if (this.defaultColumns && !this.defaultColumns.includes(field))
                                defaultOtherFields.push(field);
                        }
                        gridStructure.ExtendHeader = otherFields.join("|");
                        gridStructure.DefaultExtendHeader = defaultOtherFields.join("|");
                    }
                    var hasColorColumn = dataSet[0].color !== undefined;
                    var maxRecords = dataSet.length > maxRecordInPage ? maxRecordInPage : dataSet.length;

                    var $checkedAll = this.container.find("thead tr:not('.row-filter') td.column-select input[type='checkbox']");
                    var checkAllState = $checkedAll.prop("checked") && $checkedAll.attr("data-state") === "all";
                    var rowIndexType = dataSet.length > 1 ? 1 : 0;
                    for (var rowIndex = 0; rowIndex < maxRecords; rowIndex++) {
                        var $trBody = $("<tr>");
                        if (!this.editable)
                            $trBody.attr("tabindex", 10000 + rowIndex);


                        $trBody.attr("data-id", this.withLogData ? dataSet[rowIndex].__uid.newValue : dataSet[rowIndex].__uid);
                        if (this.grouping)
                            $trBody.attr("data-index", rowIndex);

                        var isSelectedRow = false;
                        if (!this.selectionViewMode && this.selectionList.length > 0) {

                            var keyValues = "";
                            this.keyField.split(",").forEach(function (item) {
                                keyValues += that.withLogData ? (dataSet[rowIndex][item].newValue ? dataSet[rowIndex][item].newValue.toString() : "") : (dataSet[rowIndex][item] ? dataSet[rowIndex][item].toString() : "");
                            });
                            if (this.selectionList.includes(keyValues))
                                isSelectedRow = true;
                        }
                        else if (checkAllState)
                            isSelectedRow = true;

                        var columnBuilder = [];
                        var className = (this.editable ? "" : " row-hover") + (rowIndex === activeRowIndex ? " active" : "") + (this.selectionViewMode || isSelectedRow ? " selected" : "");
                        $trBody.addClass(className);
                        if (hasColorColumn) {
                            var color = this.withLogData ? (dataSet[rowIndex].color ? dataSet[rowIndex].color.newValue : null) : dataSet[rowIndex].color;
                            if (color)
                                $trBody.attr("style", "background-color:" + color + ";");
                        }
                        var extendedColumn = 1;
                        if (this.expandable) {
                            extendedColumn++;
                            columnBuilder.push("<td class='column-expandable column-collapse'>" + gridBuilderGlobal.leftIcon + "</td>");
                        }
                        columnBuilder.push("<td class='column-select" + (!this.multiSelect ? " without-checked" : "") + "'>" + (!this.grouping ? gridBuilderGlobal.indicatorIcon : "") + (this.multiSelect ? "<input type='checkbox' " + (this.selectionViewMode || isSelectedRow ? " checked='checked'" : "") + " class='checkbox-control' />" : "") + "</td>");
                        if (this.hasTag) {
                            extendedColumn++;
                            var stickerCount = Number(this.withLogData ? (dataSet[rowIndex].stickercount ? dataSet[rowIndex].stickercount.newValue : (dataSet[rowIndex].StickerCount ? dataSet[rowIndex].StickerCount.newValue : "0"))
                                : (dataSet[rowIndex].stickercount ? dataSet[rowIndex].stickercount : (dataSet[rowIndex].StickerCount ? dataSet[rowIndex].StickerCount : "0")));
                            columnBuilder.push("<td class='column-tag'>" + (stickerCount > 0 ? gridBuilderGlobal.tagIcon : "") + "</td>");
                        }
                        if ($("#" + this.getId() + "popup.context-menu-container").length === 1) {
                            extendedColumn++;
                            columnBuilder.push("<td tabindex='199998' class='column-context-menu'></td>");
                        }
                        if (this.editable && this.canModify) {
                            extendedColumn++;
                            columnBuilder.push("<td tabindex='199999' class='column-delete-row'></td>");
                        }
                        var tabIndex = 200000;
                        for (var j = 0; j < fields.length; j++) {
                            var minWidth = columnWidths[j];
                            var cellHidden = cellVisibility[j] === "0";
                            var colType = columnTypes[j];
                            var colTypeSrc = columnTypesSrc[j];
                            var colColor = columnColors[j];
                            var colAlign = columnsAlign[j];
                            var color = this.withLogData ? (dataSet[rowIndex][fields[j] + "_color"] ? dataSet[rowIndex][fields[j] + "_color"].newValue : null) : dataSet[rowIndex][fields[j] + "_color"];

                            var fieldValue = this.withLogData ? (dataSet[rowIndex][fields[j]] && dataSet[rowIndex][fields[j]].newValue !== null && dataSet[rowIndex][fields[j]].newValue !== undefined ? dataSet[rowIndex][fields[j]].newValue : "")
                                : (dataSet[rowIndex][fields[j]] !== null && dataSet[rowIndex][fields[j]] !== undefined ? dataSet[rowIndex][fields[j]] : "");

                            var maskField = "datamask_" + fields[j];
                            var maskFieldValue = this.withLogData ? (dataSet[rowIndex][maskField] && dataSet[rowIndex][maskField].newValue !== null && dataSet[rowIndex][maskField].newValue !== undefined ? dataSet[rowIndex][maskField].newValue : "")
                                : (dataSet[rowIndex][maskField] !== null && dataSet[rowIndex][maskField] !== undefined ? dataSet[rowIndex][maskField] : "");

                            var isComma = commaCols.includes(fields[j]) || maskFieldValue === "price";
                            var isReadOnly = readOnlyCols.includes(fields[j]);
                            var booleanType = this.withLogData ? (dataSet[rowIndex][fields[j]] && typeof dataSet[rowIndex][fields[j]].newValue === "boolean") : (typeof dataSet[rowIndex][fields[j]] === "boolean");
                            var isEditableReadOnly = this.editable ? this.container.find("tbody tr.row-edit td:eq(" + (j + extendedColumn) + ")").attr("disabled") === "disabled" : false;

                            var value = "";
                            if (booleanType)
                                value = "<span class='checkbox-column" + (fieldValue.toString().toLowerCase() === "true" ? " checked" : "") + "'></span>";
                            else if (colType === "link") {
                                if (fieldValue)
                                    value = "<span class='action-control link-control'>" + fieldValue + "</span>";
                            }
                            else if (colType === "image") {
                                if (colTypeSrc)
                                    value = "<img class='action-control' src='" + colTypeSrc + "' />";
                                else if (fieldValue)
                                    value = "<img class='action-control' src='" + fieldValue + "' />";
                            }
                            else if (isComma) {
                                var decimalCount = this.withLogData ? dataSet[rowIndex]["currencydecimalcount"] ? dataSet[rowIndex]["currencydecimalcount"].newValue : (dataSet[rowIndex]["CurrencyDecimalCount"] ? dataSet[rowIndex]["CurrencyDecimalCount"].newValue : null)
                                    : dataSet[rowIndex]["currencydecimalcount"] ? dataSet[rowIndex]["currencydecimalcount"] : (dataSet[rowIndex]["CurrencyDecimalCount"] ? dataSet[rowIndex]["CurrencyDecimalCount"] : null);
                                value = numberWithCommas(fieldValue, decimalCount);
                            }
                            else
                                value = fieldValue;

                            columnBuilder.push("<td " + (cellHidden ? "hidden='hidden'" : "") + (this.editable ? " tabindex='" + (tabIndex + j) + "'" : "")
                                + " style='" + (colColor ? "background-color:#" + colColor + ";" : "") + (color ? "color:#" + color + ";" : "") + "min-width:" + minWidth + "px;width:" + minWidth + "px;'" + (isReadOnly || isEditableReadOnly ? " disabled='disabled' " : "") + "><div class='text" + (booleanType ? " text-center" : "")
                                + "' style='min-width:" + (Number(minWidth) - 1) + "px;width:" + (Number(minWidth) - 1) + "px;" + (colAlign ? "text-align:" + colAlign + ";" + (colAlign === "left" ? "direction:ltr;" : "") : "") + "' title='" + (isComma ? value : fieldValue.toString().replaceAll("'", "").replaceAll("\"", "").replaceAll(">", "")) + "'>"
                                + (booleanType || colType === "link" || colType === "image" ? value : value.toString().replaceAll("'", "").replaceAll("\"", "").replaceAll(">", "").replaceAll("<", ""))
                                + "</div>" + (this.editable ? "<div class='edit" + (booleanType ? " text-center" : "") + "' ></div>" : "") + "</td>");
                        }
                        var otherValues = [];
                        otherFields.forEach(function (column) {
                            if (dataSet[rowIndex][column] !== null && dataSet[rowIndex][column] !== undefined)
                                otherValues.push(that.withLogData ? dataSet[rowIndex][column].newValue : dataSet[rowIndex][column]);
                            else
                                otherValues.push("");
                        });
                        columnBuilder.push("<td class='extend-data'>" + otherValues.join("|") + "</td>");

                        $trBody.html(columnBuilder.join(""));
                        tBody.push($trBody[0].outerHTML);
                        if (this.expandable)
                            tBody.push("<tr class='row-expandable'><td colspan='1000'></td></tr>");
                    }

                    if (!this.editable) {
                        var types = "";
                        fields.forEach(function (column) {
                            types += (types.length > 0 ? "," : "") +
                                (that.withLogData ? (dataSet[rowIndexType][column] && typeof dataSet[rowIndexType][column].newValue === "number" ? "1" : "0") : (typeof dataSet[rowIndexType][column] === "number" ? "1" : "0"));
                        });
                        var totalRecord = this.withLogData ? dataSet[0]["__rc"] ? dataSet[0]["__rc"].newValue : (dataSet[0]["__Rc"] ? dataSet[0]["__Rc"].newValue : (dataSet[0]["__RC"] ? dataSet[0]["__RC"].newValue : dataSet.length))
                            : dataSet[0]["__rc"] ? dataSet[0]["__rc"] : (dataSet[0]["__Rc"] ? dataSet[0]["__Rc"] : (dataSet[0]["__RC"] ? dataSet[0]["__RC"] : dataSet.length));
                        gridStructure.ColumnsType = types;
                        gridStructure.SumFooter = commaCols.length > 0;
                        gridStructure.PageNumber = pageNumber === 0 ? 1 : pageNumber;
                        gridStructure.TotalRecord = totalRecord;
                        gridStructure.TotalPage = Math.ceil(gridStructure.TotalRecord / (maxRecordInPage * 1.0));
                        if (this.offlinePaging)
                            gridStructure.BodyJson = dataSet;
                    } else {
                        gridStructure.BodyJson = dataSet;
                        gridStructure.TotalRecord = dataSet.length;
                    }
                }

                gridStructure.Body = tBody.join("");
                return gridStructure;
            };
            return jsGridView;
        })();
        if (window[$(this).attr("id") + "Builder"])
            return window[$(this).attr("id") + "Builder"];

        window[$(this).attr("id") + "Builder"] = {};
        window[$(this).attr("id") + "Builder"] = new JsGridView(this, option);
        return window[$(this).attr("id") + "Builder"];
    }
});
jQuery.fn.extend({
    comboBuilder: function () {
        var JsCombo = (function () {
            function jsCombo(target) {
                this.container = target;
                this.selectedText = "";
                this.attrs = {};
                this.resetTime = null;
                this.rebind();
            }
            jsCombo.prototype.showDropdown = function () {
                var that = this;
                if (!$(that.container).find("input[type='text']").prop("disabled")) {
                    var comboDropdownWidth;
                    var gridBuilder = $("#" + that.container.closest(".grid").attr("id")).gridBuilder();
                    if (that.getDropDown().length === 0) {
                        var $combo = $(that.container).find(".combo-dropdown-menu");
                        comboDropdownWidth = $combo.width();
                        $combo.attr("id", that.getId() + "_dropdown");
                        $combo.addClass("combo-dropdown-body");
                        $("body").append($combo.detach());
                        that.getDropDown().on("mousedown mouseup", function (event) { event.stopPropagation(); });
                        that.getDropDown().on("click", "li", async function () {
                            var value = $(this).attr("data-code");
                            that.container.attr("data-value", value);
                            that.val(value);
                            var rowIndex = gridBuilder.getActiveRowIndex();
                            var columnIndex = $("#" + that.getId()).closest("td").index();

                            if (gridBuilder.async || that.container.find(".combo-text").attr("data-running-event") !== "true") {

                                if (gridBuilder.cellBeforeLostFocus)
                                    await gridBuilder.cellBeforeLostFocus(rowIndex, columnIndex);

                                if (gridBuilder.cellChanged) {
                                    if (!gridBuilder.async)
                                        that.container.find(".combo-text").attr("data-running-event", "true");
                                    await gridBuilder.cellChanged(rowIndex, columnIndex);
                                }
                                if (that.container.attr("onchange")) {
                                    if (!gridBuilder.async)
                                        that.container.find(".combo-text").attr("data-running-event", "true");
                                    await eval(that.container.attr("onchange"));
                                }
                                gridBuilder.setEditRow(rowIndex, columnIndex + 1, true);
                            }
                            that.getDropDown().closest(".combo-dropdown-menu").hide();

                        });
                    } else
                        comboDropdownWidth = that.getDropDown().closest(".combo-dropdown-menu").width();

                    var $comboDropdown = that.getDropDown().closest(".combo-dropdown-menu");
                    var top = that.container.offset().top + that.container.height();
                    var spaceUp = top - $comboDropdown.height() - $(window).scrollTop();
                    var spaceDown = $(window).scrollTop() +
                        $(window).height() -
                        (top + $comboDropdown.height());

                    if (spaceDown < 0 && (spaceUp >= 0 || spaceUp > spaceDown))
                        top = that.container.offset().top - $comboDropdown.height() - 6;

                    $comboDropdown.css({
                        position: "absolute",
                        width: that.container.width(),
                        left: that.container.offset().left - (gridBuilder.isLeftToRight ? 0 : (comboDropdownWidth > that.container.width() ? comboDropdownWidth - that.container.width() : 0)),
                        top: top,
                        display: "block"
                    });

                    that.search(false);
                }
            };
            jsCombo.prototype.rebind = function () {
                var that = this;
                $(this.container).find("[data-toggle='dropdown'],[data-bs-toggle='dropdown']").off("click").on("click", function () { that.showDropdown(); });
                $(this.container).find(".combo-text").off("keydown keyup change");
                $(this.container).find(".combo-text").on("keydown", function (event) {
                    var menuItems = that.getDropDown().find("li:not([hidden])");
                    var $liActive = menuItems.filter(".active");
                    if (event.ctrlKey && event.keyCode === gridBuilderGlobal.downKey) {
                        $(that.container).find("[data-toggle='dropdown'],[data-bs-toggle='dropdown']").trigger("click");
                    }
                    else if (event.keyCode >= 37 && event.keyCode <= 40) {
                        if (menuItems.length === 0 || that.getDropDown().is(":hidden")) {
                            event.stopPropagation();
                            return;
                        }
                        if (event.keyCode === gridBuilderGlobal.downKey) {
                            if ($liActive.length === 0) {
                                $(menuItems[0]).addClass("active");
                                that.val($(menuItems[0]).attr("data-code"));
                                event.stopPropagation();
                            } else if (menuItems.index($liActive) < menuItems.length - 1) {
                                $liActive.removeClass("active");
                                var $nextItem = $(menuItems[menuItems.index($liActive) + 1]);
                                $nextItem.addClass("active");
                                that.val($nextItem.attr("data-code"));
                                event.stopPropagation();
                            }

                        } else if (event.keyCode === gridBuilderGlobal.upKey) {
                            if (menuItems.index($liActive) > 0) {
                                $liActive.removeClass("active");
                                var $prevItem = $(menuItems[menuItems.index($liActive) - 1]);
                                $prevItem.addClass("active");
                                that.val($prevItem.attr("data-code"));
                                event.stopPropagation();
                            }
                        }
                    }
                    else if ((event.keyCode === gridBuilderGlobal.enterKey || event.keyCode === gridBuilderGlobal.tabKey) && !that.getDropDown().is(":hidden")) {
                        if ($liActive.length === 1) {
                            $liActive.trigger("click");
                            event.stopPropagation();
                        }
                    } else if (event.keyCode === gridBuilderGlobal.escapeKey) {
                        if (!that.getDropDown().is(":hidden")) {
                            that.getDropDown().parent().hide();
                            that.getDropDown().closest(".combo-dropdown-menu").hide();
                            that.val(that.container.attr("data-value"));
                            event.stopPropagation();
                            setTimeout(function () { that.container.find(".combo-text").focus(); }, 100);
                        }
                    }
                    that.container.attr("data-key-down", event.keyCode);
                });
                $(this.container).find(".combo-text").on("keyup", function (event) {
                    if (event.keyCode >= 37 && event.keyCode <= 40)
                        return;
                    var value = $(this).val();
                    if (that.selectedText === value)
                        return;
                    that.selectedText = value;
                    that.getDropDown().find("li.active").removeClass("active");

                    if (!that.getDropDown().is(":hidden"))
                        that.search(true);
                });
            };
            jsCombo.prototype.getId = function () {
                return this.container.attr("id");
            };
            jsCombo.prototype.getDropDown = function () {
                return $("#" + this.getId() + "_dropdown").find("ul");
            };
            jsCombo.prototype.val = function (value) {
                if (typeof value === "undefined")
                    return this.container.attr("data-value");
                var $dropdown = this.getDropDown();
                $dropdown.find("li.active").removeClass("active");
                if (value || value === "") {
                    $dropdown.find("li[data-code='" + value + "']").addClass("active");
                    this.setScrollToActive();
                }
                var text = !value ? "" : value;
                this.container.find(".combo-text").val(text);
                return undefined;
            };
            jsCombo.prototype.loadData = function (dataSet) {
                var data = this.convertJsonToHtml(dataSet);
                var $dropdown = $("#" + this.getId() + "_dropdown");
                $dropdown.find("ul").html(data.Body);
                $dropdown.find(".record-count").text(data.TotalRecord);
                $dropdown.find(".loading").hide();
            };
            jsCombo.prototype.search = function (typing) {
                this.container.find(".combo-text").focus();
                var value = this.container.find(".combo-text").val();
                var isOnline = this.container.attr("data-online") === "true";
                var $ul = this.getDropDown();
                var $liActive = $ul.find("li:not([hidden]).active");
                var that = this;
                if (isOnline) {
                    $liActive.removeClass("active");
                    if (this.resetTime) {
                        clearTimeout(this.resetTime);
                    }
                    var $comboDropdown = $ul.closest(".combo-dropdown-menu");
                    $comboDropdown.find("li").remove();
                    $comboDropdown.find(".loading").show();

                    var gridBuilder = $("#" + that.container.closest(".grid").attr("id")).gridBuilder();
                    if (typing) {
                        this.resetTime = setTimeout(function () {
                            if (gridBuilder.getComboData) {
                                gridBuilder.getComboData(that.container, value);
                            }
                        }, 500);
                    } else {
                        if (gridBuilder.getComboData) {
                            gridBuilder.getComboData(that.container, "");
                        }
                    }
                } else {
                    $liActive.removeClass("active");
                    $ul.find("li").each(function (index, item) {
                        if (value === "" || $(item).html().includes(value)) {
                            $(item).removeAttr("hidden");
                        } else
                            $(item).attr("hidden", "hidden");
                    });
                    this.container.find(".combo-count").text($ul.find("li:not([hidden])").length);
                    this.container.find(".loading").hide();
                }
            };
            jsCombo.prototype.setScrollToActive = function () {
                var $ul = this.getDropDown();
                var $liActive = $ul.find("li.active");
                $ul.scrollTop(0);
                if ($liActive.length > 0)
                    $ul.scrollTop($liActive.offset().top - $ul.offset().top);
            };
            jsCombo.prototype.findValueOfProperty = function (obj, propertyName) {
                var valueArray = Object.keys(obj).reduce((result, key) => {
                    if (key.toLowerCase() === propertyName.toLowerCase())
                        result.push(obj[key]);
                    return result;
                }, []);
                return valueArray.length === 1 ? valueArray[0] : null;
            }
            jsCombo.prototype.convertJsonToHtml = function (dataSet) {
                var that = this;
                var items = [];
                var comboStructure = { Body: "", TotalRecord: 0 };
                var textWithCode = this.container.attr("data-lookup") === "true";
                var dataExtend = this.container.attr("data-extend");
                var defaultValue = this.container.attr("data-value");
                for (var i = 0; i < dataSet.length; i++) {
                    var code = this.findValueOfProperty(dataSet[i], "Code");
                    var name = this.findValueOfProperty(dataSet[i], "Name");

                    code = (code === null ? "" : code).toString();
                    name = (name === null ? "" : name).toString();

                    var extendAttr = [];
                    if (dataExtend) {
                        dataExtend.split("|").forEach(function (fieldName) {
                            var value = that.findValueOfProperty(dataSet[i], fieldName);
                            value = (value === null ? "" : value).toString();
                            extendAttr.push(fieldName + "='" + value + "'");
                        });

                    }
                    var activeItem = false;
                    if (defaultValue.toLowerCase() === code.toLowerCase()) {
                        activeItem = true;
                    }
                    items.push("<li data-code='" + code + "' " + (activeItem ? "class='active'" : "") + " " + extendAttr.join(" ") + ">" + (textWithCode ? code + " " : "") + name + "</li>");
                }
                var totalRecord = dataSet.length;
                if (dataSet.length > 0) {
                    var rc = this.findValueOfProperty(dataSet[0], "__Rc");
                    if (rc !== null)
                        totalRecord = rc;
                }

                comboStructure.Body = items.join("");
                comboStructure.TotalRecord = totalRecord;

                return comboStructure;
            };
            return jsCombo;
        })();
        if (window[$(this).attr("id") + "Builder"])
            return window[$(this).attr("id") + "Builder"];
        window[$(this).attr("id") + "Builder"] = new JsCombo(this);
        return window[$(this).attr("id") + "Builder"];
    }
});

function setCalculator(value) {
    value = Math.round(value);
    const $cell = $(".grid tbody tr td[data-active='true']");
    if ($cell.find(".edit input[type='text']").length === 1) {
        $cell.find(".edit input[type='text']").val(value);
        $cell.find(".edit input[type='text']").focus();
    }
    else {
        $cell.find(".text").text(value);
        $cell.focus();
    }
}
$(document).ready(function () {
    $("body").append("<div class='grid-tag-assign'></div>" +
        "<div class='grid-filter'>" +
        "<div data-filter='null'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.null + "</div></div>" +
        "<div data-filter='not-null'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.notNull + "</div></div>" +
        "<div data-filter='equals'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.equal + "</div></div>" +
        "<div data-filter='not-equal'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.notEqual + "</div></div>" +
        "<div data-filter='starts-with'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.startWith + "</div></div>" +
        "<div data-filter='ends-with'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.endWith + "</div></div>" +
        "<div data-filter='contains'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.contain + "</div></div>" +
        "<div data-filter='not-contains'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.notContain + "</div></div>" +
        "<div data-type='1,2' data-filter='less'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.less + "</div></div>" +
        "<div data-type='1,2' data-filter='less-equal'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.lessEqual + "</div></div>" +
        "<div data-type='1,2' data-filter='greater'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.greater + "</div></div>" +
        "<div data-type='1,2' data-filter='greater-equal'><div class='grid-filter-img'></div><div>" + gridBuilderGlobal.dictionary.greaterEqual + "</div></div>" +
        "</div>");

    $(document).on("change", "input[type='file'].import-excel, input[type='file'].import-xml", function (event) {
        var type = $(this).hasClass("import-excel") ? "importExcel" : "importXml";
        var isShortKey = $(this).attr("data-shot-key") === "true";
        var gridId = $(this).attr("data-target");
        var gridBuilder = $("#" + gridId).gridBuilder();
        if (this.files.length > 0 && gridBuilder.importClick) {
            var file = event.target.files[0];
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function () {
                gridBuilder.importClick(gridId, type, reader.result, isShortKey);
            };
        }
    });
    $(document).on("mouseup", function (event) {
        $(".grid").each(function (index, element) {
            var elementBuilder = $(element).gridBuilder();
            var $popupMenu = $("#" + elementBuilder.getId() + "popup.context-menu-container");
            var rowIndex = $popupMenu.attr("data-row-index") ? Number($popupMenu.attr("data-row-index")) : -1;
            if (elementBuilder.isEditMode() && !elementBuilder.isRowEditMode(rowIndex))
                elementBuilder.endEditGrid();
            if (rowIndex > -1) {
                elementBuilder.hideContextMenu();
                if ($popupMenu.attr("keyboard") === "1")
                    $popupMenu.removeAttr("keyboard");
                else
                    elementBuilder.setFocusRow(rowIndex, 0, true);
            } else
                elementBuilder.container.find("tbody td.active").removeClass("active").removeAttr("data-active");
        });
    }).on("mousedown", function () {
        $(".sum-footer-menu").hide();
        $(".grid-filter").hide();
        $(".context-menu-container").hide();
        $(".combo-dropdown-menu").hide();
        $(".grid-tag-related").hide();
        $(".grid-tag-filter").hide();
        $(".grid-tag-manage").hide();
    });
    $(".grid-filter>div").on("mousedown", function (event) {
        event.stopPropagation();
    }).on("click", function (event) {
        event.stopPropagation();
        $(this).find(".grid-filter-img").html(gridBuilderGlobal.filterIcon);

        var columnIndex = $(".grid-filter").attr("data-target");
        var gridId = $(".grid-filter").attr("data-grid");
        var elementBuilder = $("#" + gridId).gridBuilder();

        var $input = elementBuilder.container.find("thead tr.row-filter td:eq(" + columnIndex + ")").find("input");
        $input.attr("data-filter", $(this).attr("data-filter"));

        $(".grid-filter").hide();
        if (elementBuilder.getFilter() !== "")
            elementBuilder.resetPaging();
    });
    $(".sum-footer-menu li").on("mousedown", function (event) {
        event.stopPropagation();
    }).on("click", function (event) {
        event.stopPropagation();
        var action = $(this).attr("data-footer");
        var columnName = $(this).closest(".sum-footer-menu").attr("data-target");
        var gridName = $(this).closest(".sum-footer-menu").attr("data-grid");
        var elementBuilder = $("#" + gridName).gridBuilder();
        var result = elementBuilder.aggregateColumn(columnName, action);
        elementBuilder.container.find(".sum-footer div[data-id='" + columnName + "']").html(result);
        if (action !== "none")
            elementBuilder.container.find(".sum-footer div[data-id='" + columnName + "']").attr("data-action", action);
        else
            elementBuilder.container.find(".sum-footer div[data-id='" + columnName + "']").removeAttr("data-action");

        var groupItems = [];
        var columnsGrouping = elementBuilder.getColumnsGrouping();
        if (columnsGrouping !== "")
            groupItems = columnsGrouping.split(",");
        if (groupItems.length > 0) {
            var json = elementBuilder.filterRecordsJson ? elementBuilder.filterRecordsJson : elementBuilder.offlineRecordsJson;
            elementBuilder.container.find(".sum-footer.with-grouping>div").each(function (columnIndex, summeryItem) {
                if ($(summeryItem).attr("data-action")) {
                    elementBuilder.container.find("tbody tr.row-summery").each(function (rowIndex, row) {
                        var resultJson = json;
                        var values = $(row).attr("data-parent-value").split(",");
                        groupItems.forEach(function (parameter, parameterIndex) {
                            resultJson = resultJson.filter(x => (x[parameter] ? x[parameter].toString() : "") === values[parameterIndex]);
                        });
                        result = elementBuilder.aggregateColumn(columnIndex, action, resultJson);
                        $(row).find("td:eq(" + columnIndex + ")").attr("data-action", $(summeryItem).attr("data-action"));
                        $(row).find("td:eq(" + columnIndex + ") .text").text(result);
                    });
                }

            });
        }
        $(".sum-footer-menu").hide();
    });
    $(".grid-tag-related,.grid-tag-filter,.grid-tag-manage").on("mousedown", function (event) {
        event.stopPropagation();
    });
});
