JavaScriptスプレッドシートのデータを検証する簡単な手順


データの検証はデータの正確性を保証するプロセスである.それは、データがさらなるデータ分析のために必要な特定の要件を満たしていることを保証します.検証の後、あなたは正確で、きれいで、役に立つために使用するデータを信頼することができます.あなたが利用するデータの正確さを保証することは、あなたの最も価値あるデータを保護する積極的な戦略です.
このブログ記事では、SyncFusionのデータ検証機能を有効にする方法を参照してくださいJavaScript Spreadsheet . そうすることによって、ユーザーはデータまたは値の特定のタイプだけを入力して、それらをセルに無効なデータを入力しないようにすることができます.

どこでデータ検証オプションを見つけることができますか?
リボンのデータタブで、データ検証ドロップダウンボタンを見つけます.
JavaScriptスプレッドシートのデータ検証ドロップダウンボタン
データ検証ドロップダウンボタンは次のオプションを一覧表示します.
  • Data Validation
  • Highlight Invalid Data
  • Clear Highlight
  • Clear Validation

  • データ検証
    JavaScriptのスプレッドシートは、次のデータ検証オプションをサポートしています.

  • 全体の数:セル全体の数字を受け入れるように制限します.

  • decimal :セルが10進数だけを受け入れるように制限します.

  • リスト:ドロップダウンリストからデータを選択します.

  • 日付:日付値のみを受け入れるようにセルを制限します.

  • time :時間値のみを受け入れるセルを制限します.

  • テキスト長:テキストの長さを制限します.
  • この機能を使用すると、次のスクリーンショットのように、データ検証ダイアログで検証規則を設定できます.
    データ検証ダイアログ

    無効データの強調表示
    この機能は、黄色の背景に無効なデータを含むセルを強調表示します.データ検証基準を満たさなかったセルは、型指定された値と貼り付けられた値を含む強調表示されます.

    強調表示
    この機能は無効なセルからハイライトをクリアします.また、あなたが望むならば、もう一度細胞をハイライトすることもできます.

    検証のクリア
    この機能を使用すると、指定した範囲のセルまたはワークシート全体から適用妥当性検査をクリアできます.

    データをJavaScriptのスプレッドシートにコードを追加する
    また、JavaScriptのスプレッドシートでデータ検証を追加することもできますaddDataValidation このメソッドを使用して必要な検証オプションを渡します.
    データ検証機能を総賃金計算で表示するコード例を次に示します.
    /**
      * Data validation
      */
    
        //Initialize the Spreadsheet component.
        let sheet: SheetModel[] = [
            {
                ranges: [{
                    dataSource: (dataSource as any).grossPay,
                    startCell: 'A3'
                    },
                ],
                name: 'Gross Pay',
                rows: [{
                            cells: [{ value: 'Gross Pay Calculation',
                            style: { fontSize: '20pt', fontWeight : 'bold', textAlign: 'center', backgroundColor: '#B3FFB3',
                            verticalAlign: 'middle'} }]
                        },
                        {
                            index: 13,
                            cells: [{
                                index: 7, value: 'Total Gross',
                                style: { border: '1px solid #A6A6A6', textAlign: 'center', verticalAlign: 'middle', fontWeight: 'bold'} },
                            {
                                index: 8, formula: '=Sum(I4:I13)', format: '$#,##0.00',
                                style: { border: '1px solid #A6A6A6', textAlign: 'center', verticalAlign: 'middle', fontWeight: 'bold'}
                            }]
                        }
                ],
                columns: [
                    { width: 88, }, { width: 120 }, { width: 106 }, { width: 98 }, { width: 110 },
                    { width: 110 }, { width: 110 }, { width: 98}, { width: 130}
                ]
            } ];
    
        //Initialize the SpreadSheet control.
        let spreadsheet: Spreadsheet = new Spreadsheet({
            sheets: sheet,
            created: () => {
                spreadsheet.merge('A1:I2');
                spreadsheet.setBorder({ border: '1px solid #A6A6A6' }, 'A1:I13');
                spreadsheet.cellFormat({ textAlign: 'center', verticalAlign: 'middle'}, 'A3:I13');
                spreadsheet.cellFormat({ backgroundColor: '#B3FFB3', fontWeight : 'bold'}, 'A3:I3');
                spreadsheet.numberFormat('$#,##0.00', 'H4:I13');
                spreadsheet.wrap('H3:I3');
                //Add Data validation to range.
                spreadsheet.addDataValidation({ type: 'WholeNumber', operator: 'LessThan', value1: '9', ignoreBlank: false }, 'G4:G13');
                spreadsheet.addDataValidation({ type: 'TextLength', operator: 'GreaterThan', value1: '3', ignoreBlank: false }, 'B4:B13');
                spreadsheet.addDataValidation({ type: 'Date', operator: 'GreaterThan', value1: '4/5/2021’, ignoreBlank: false }, 'C4:C13');
                spreadsheet.addDataValidation({ type: 'Time', operator: 'LessThan', value1: '6:00:00 PM', ignoreBlank: false }, 'F4:F13');
                spreadsheet.addDataValidation({ type: 'List', value1: 'Mon, Tue, Wed, Thu, Fri', ignoreBlank: false }, 'D4:D13');
                //Highlight Invalid Data.
                spreadsheet.addInvalidHighlight('G4:G13');
            }
        });
    
        spreadsheet.appendTo('#spreadsheet');
    
    前のコード例を実行した後、次のスクリーンショットのように出力します.
    JavaScriptスプレッドシートのデータの妥当性検査

    リファレンス
    詳細についてはData Validation in JavaScript Spreadsheet demo .

    結論
    読書ありがとう!私は今、syncfusionのデータ検証機能のより良い理解を持ってほしいJavaScript Spreadsheet コントロール.この機能を使用すると、簡単に無効なデータを入力し、データの精度を確保するユーザーを保つことができます.また、Data Validation in JavaScript Spreadsheet documentation を参照してください.
    今後のブログでは、他の機能を議論します.あなたはスプレッドシートから何を期待していますか?このブログ記事のコメント欄であなたの考えを共有してください.
    あなたが既にsyncfusionユーザーであるならば、あなたはJavaScriptproduct setup このコントロールを試してみてください.それ以外の場合は、無料でダウンロードすることができます30-day trial .
    あなたがこれらの特徴についての質問をするならば、我々を通して我々と連絡をとってくださいsupport forum , Direct-Trac , or feedback portal . 私たちはあなたを支援して満足している!

    関連ブログ