Show Posts

This section allows you to view all posts made by this member. Note that you can only see posts made in areas you currently have access to.


Messages - Punit

Pages: [1] 2 3 4
1
Dear Team,

I am encountering an issue while copying and pasting decimal values from Excel into pqGrid (version 11).

In my Excel sheet, the values are in decimal format. However, when I copy these values and paste them into pqGrid, they appear as #VALUE! instead of the expected numeric or string values.

Here are the details:

pqGrid version: v11
Column dataType: string
Expected behavior: Decimal values should paste correctly as-is (regardless of format subtype)
Actual behavior: Pasted values are converted to #VALUE!

Additionally, I tested the same functionality using pqGrid version 10, and the copy-paste behavior works correctly there without any issues.

For your reference, I have also uploaded a StackBlitz project demonstrating the issue in pqGrid v11.

[ Url removed due to inclusion of SDK source files. ]

Could you please help identify the cause of this behavior and suggest a solution ?

2
From our side, the pqGrid column data type is set to string.

Could you please confirm if it is possible to convert (copied from Excel in Indian number format)  the pasted values into string during the paste process??

3
I am facing an issue while copying values from Excel and pasting them into pqGrid.

Issue Description:

When I copy a number in Indian format from Excel (e.g., 3,69,92,674.00) and paste it into pqGrid, the value is getting converted to #VALUE! instead of the correct numeric value.

Current Implementation:

I have implemented the following pqGrid events to track the pasted data:

paste: function (evt, ui) {
},

beforePaste: function (evt, ui) {
    console.log("Before Paste (raw data): ", ui.clipboardData);
    console.log("Parsed rows: ", ui.rows);
},

change: function (evt, ui) {
    if (ui.source === 'paste') {
        console.log("After Paste (final data): ", ui.updateList);

        ui.updateList.forEach(row => {
            console.log("Row Data:", row.newRow);
        });
    }
}

In all console logs (paste, beforePaste, and change events), the value is already coming as #VALUE!.
The actual Excel value (3,69,92,674.00) is not being received at any stage.

Kindly suggest the resolution for this issue.

4
When I copy data from Excel in Indian number format and paste it into pqGrid, it doesn’t work. The Indian number format is not supported

5
When data is copied from Excel and pasted into pqGrid, it is displayed as ‘#VALUE!

beforeValidate: function (evt, ui) {
  if (ui.source === "paste") {
    const grid = this;

    // Block all new row additions on paste
    ui.addList.length = 0;

    // Loop through updated rows
    ui.updateList.forEach(({ newRow, rowData }) => {
      for (const dataIndx in newRow) {
        if (!newRow.hasOwnProperty(dataIndx)) continue;

        const col = grid.getColumn({ dataIndx });
        console.log(col, "=rowData-paste");

        const elementType = rowData?.ElementType;
        let val = newRow[dataIndx];

        console.log(val, "=paste-value");
        // output #VALUE!
      }
    });
  }
}

6
Help for ParamQuery Pro / Calculation Refresh Issue on Scroll In React
« on: March 25, 2026, 06:28:11 pm »
When we have large data, the calculation doesn’t update properly after changing a value. It only updates after scrolling up and then back down

I added a value, and it is shown in screenshot_5. The calculated data is displayed in screenshot_6. After deleting the value, it is shown in screenshot_8, but the calculation is not update and is still displayed in screenshot_7

7
Help for ParamQuery Pro / Re: TreeView Text Alignment Requirement
« on: February 06, 2026, 11:28:30 am »
Hello,

I am using pqGrid version 10.1.0.

I have attached two screenshots for reference. Screenshot1 shows the grid with wrapped text, and Screenshot2 shows the grid without wrapped text. I would like to use the layout without wrapped text (as shown in Screenshot2).

8
Help for ParamQuery Pro / TreeView Text Alignment Requirement
« on: February 04, 2026, 06:16:26 pm »
Hi Team,

In the TreeView, I have removed the wrap text option. After doing this, the text alignment is not starting from the required position.

The requirement is that the specific text in the TreeView should start exactly from its defined node starting point. Currently, once wrap text is removed, the text shifts and does not align properly with the TreeView structure.

Let me know if you have any solution.

Thanks & Regards,

9
Help for ParamQuery Pro / Scroll Issue PqGrid in React
« on: December 04, 2025, 10:37:53 pm »
Scrolling not working , when React function  in useState update.

10
Help for ParamQuery Pro / Decimal value paste issue
« on: December 04, 2025, 04:07:20 pm »
We copied data from an Excel sheet and pasted it into PQGrid in React.
Cell values such as:

108,196,453   , (7,797,168)
80,275,926   , 106,509,820
188,472,379  , 98,712,652


are pasted correctly into the grid cells.(Excel sheet to pqGrid)

However, decimal values like 0.06 are not being pasted into the cells, although the value is printed in the console during the paste event (#value showing in console).

The issue occurs even though PQGrid has been properly integrated into the React project.

Below is the code that handles the paste validation and formatting logic.

  beforeValidate: function (evt, ui) {
        const { updateList } = ui;

        if (ui.source === "paste") {
          const grid = this;

          // only keep updates to existing rows, ignore rows flagged as newRow:true

          if (ui.source === "paste") {
            ui.addList.length = 0; // Block all new row additions on paste
          }

          console.log(ui ,"ui-paste data")

             if (!modifiedRowsRef.current) {
              modifiedRowsRef.current = {};
            }

          const changedCols = [...new Set(
            updateList?.flatMap(item => Object.keys(item.newRow))
          )];

            console.log(updateList , "updateList")

          for (let i = 0; i < updateList.length; i++) {
            const { newRow, rowData } = updateList;
           // console.log(newRow , "newRow")
           //  console.log(rowData , "rowData")
            const rowId = rowData?.Id;

            for (const dataIndx in newRow) {
              if (!newRow.hasOwnProperty(dataIndx)) continue;

              const col = grid.getColumn({ dataIndx });
           //  console.log(rowData , "=rowData-paste")
              const elementType = rowData?.ElementType
              let val = newRow[dataIndx];
              console.log(  newRow[dataIndx] , "=paste-11")
           
             if (rowData?.isReadOnly === true || rowData?.IsAbstract === true || elementType == "xbrli:booleanItemType") {
           
              newRow[dataIndx] =  "";
              continue;
            }

         
              // Only apply for monetary/decimal types
              if (
                elementType !== "xbrli:monetaryItemType" &&
                elementType !== "xbrli:decimalItemType"

              ) {

                if (rowId !== null && rowId !== "" && rowId !== undefined) {
                const columnIndex = Number(dataIndx.replace(/[^\d]/g, "")); // Extract last number from col name
                if (!modifiedRowsRef.current[rowId]) {
                  modifiedRowsRef.current[rowId] = [];
                }
                modifiedRowsRef.current[rowId].push(columnIndex);
                modifiedRowsRef.current[rowId] = [...new Set(modifiedRowsRef.current[rowId])];
              }

                continue;
              }


              if (val === "" || val === null) {
                newRow[dataIndx] = "";
                continue;
              }

           

              // If object → extract value
              if (typeof val === "object" && val !== null) {

                val = val.text || val.value || "";
              }

           

              val = String(val).trim();
              let str = String(val).trim();
              if (!str) {
                newRow[dataIndx] = "";
                continue;
              }

            if (!str) continue;

              console.log(str , "paste data")

           
                let clean = str.replace(/[^\d.\-]/g, "");
                clean = clean.replace(/(?!^)-/g, ""); // Keep only first minus
                clean = clean.replace(/(\..*)\./g, "$1"); // Keep only first dot

                // Parse to number
                const num = parseFloat(clean);

                if (isNaN(num)) {
                  newRow[dataIndx] = "";
                  rowData[dataIndx] = null;
                  continue;
                }

                // ─── STEP 4: Store number for calculations ───
                rowData[dataIndx] = num;

                // ─── STEP 5: Format only DISPLAY value (US commas + 2 decimals) ───
                const formatted = num.toLocaleString("en-US", {
                  minimumFractionDigits: 2,
                  maximumFractionDigits: 2
                });

                newRow[dataIndx] = formatted;
                console.log("paste-4" , rowId )
               if (rowId !== null && rowId !== "" && rowId !== undefined) {

                const columnIndex = Number(dataIndx.replace(/[^\d]/g, "")); // Extract last number from col name
                if (!modifiedRowsRef.current[rowId]) {
                  modifiedRowsRef.current[rowId] = [];
                }
                modifiedRowsRef.current[rowId].push(columnIndex);
                modifiedRowsRef.current[rowId] = [...new Set(modifiedRowsRef.current[rowId])];
              }


            }
          }



          if (extendedLinkName.trim()?.includes("510000") || extendedLinkName.trim()?.includes("520000")) {
            // grid.commit(); // 🔥 critical line - updates dataModel
            grid.refresh(); // UI update

            setTimeout(() => {
              console.log("Paste complete → Recalculating columns:");

              // Run recalc for each changed column
              changedCols.forEach(colKey => {
                recalcCashFlow(grid, colKey);
              });

              // Final UI refresh (only once!)
              grid.refresh();
            }, 50); // 10ms is more reliable than 0 in heavy grids


          }

          return true; // allow validation to proceed
        }



11
Help for ParamQuery Pro / Scroll Issue in React
« on: November 19, 2025, 08:00:18 pm »
I have cell-wise validation. Whenever something is required, the corresponding cell should turn red across the entire grid.
But right now, the background color is changing only for the cells that are visible on the screen (within the current scroll area).
The cells outside the visible scroll region are not getting the validation background color.

I need it to work for the entire grid, not just the visible rows.

My Code -

  const validateRow = (row, rowIndx) => {
      if (!row) return;

      if (row.IsMandatory) {
        console.log( row , "IsMandatory" )
        const dateCols = Object.keys(row).filter((k) => k.startsWith("Date_"));

     

        dateCols.forEach((col) => {
          const value = row[col];
          const isEmpty = !value || value.toString().trim() === "";


          if (isEmpty) {
            gridObj.pqGrid("addClass", {
              rowIndx,
              dataIndx: col,
              cls: "progress-bar-primary",
              apply: true,
            });

            isValid = false;
            missingCells.push({
              row: row.ChildLabel || row.Label || `Row ${rowIndx + 1}`,
              column: col,
            });
          }
        });
      }
    };

    // 🔁 Run validation on all rows
    flatData.forEach((row, i) => validateRow(row, i));

    // ✅ Refresh grid once after all highlights
    gridObj.pqGrid("refresh");

12
ParamQuery Pro Evaluation Support / Import excel file in react18
« on: February 05, 2025, 06:55:41 pm »
Import excel file is not working Pqgrid in react 18 :
Error :  Cannot read properties of undefined (reading 'importXl')

 React Code :

 const gridRefImport = useRef(null);

  const handleFileUpload = (evt) => {
    const file = evt.target.files[0]; // Get file
    if (file && file.name.toUpperCase().endsWith(".XLSX")) {
     const grid = $(gridRefImport.current).pqGrid("instance");

      grid.showLoading();
      console.log(grid, "grid excel")
      if (grid.excel) {
        grid.excel.importXl({
          file: file,
          sheets:

        }, function (wb) {
          grid.importWb({
            workbook: wb,
            extraRows: 1000,
            extraCols: 1000
          });
          grid.hideLoading();
        });
      } else {
        console.error("Excel module not loaded!");
      }
    }
  };

useEffect(() => {
    if (gridRefImport.current) {
      const $grid = $(gridRefImport.current);

      const grid = $grid.pqGrid({
        excel: true,
        keepCM: true,
        width: "auto",
        height: 400,
        showTitle: false,
        mergeModel: { flex: true },
        numberCell: { width: 60 },
        sortModel: { on: false },
        selectionModel: { column: true },
        stripeRows: false,
        menuIcon: true,
        filterModel: { hideRows: true },
        columnTemplate: {
          filter: {
            crules: [{ condition: "range" }],
          },
        },
        animModel: { on: true },
        autoRow: true,
        editor: { type: "textarea" },
        editModel: {
          onSave: "downFocus",
        },
      });

      return () => {
        // Cleanup on unmount
        grid.pqGrid("destroy");
      };
    }
  }, []);

 <div ref={gridRefImport}  style={{ paddingBottom: "3px" }}  className="border"></div>

13
ParamQuery Pro Evaluation Support / PQGrid fully supports React 18
« on: January 24, 2025, 05:04:15 pm »
I am using React 18 and considering integrating PQGrid. Could you confirm if PQGrid fully supports React 18, including all functionalities and event ??

14
Help for ParamQuery Grid (free version) / PQGrid fully supports React 18
« on: January 24, 2025, 05:00:47 pm »
Hi,

I am using React 18 and considering integrating PQGrid. Could you confirm if PQGrid fully supports React 18, including all functionalities ?





15
ParamQuery Pro Evaluation Support / excel import with formula
« on: August 12, 2024, 01:31:15 pm »
Hello,

I want to import excel with formula, how to import the sheet with formula, right now when i try to import excel with formula its cell data changes.

Pages: [1] 2 3 4