3

データソースとして使用しているCSVがあります。改行文字（'\ n'）の行を'lines'という変数に分割する必要があり、各行のセミコロン（';'）で区切られた値を'items'という変数に分割する必要があります。 。

行の最初の値をチェックできるようにしたいのですが、それが入力ボックスの入力値と等しい場合は、値の間にセミコロン区切り文字を付けて、この行をnewDataという新しい変数に追加します。入力ボックスの値と等しくない場合は、除外します。

基本的に、最初の値が検索している値と等しくない各行を除外したいと思います。

データのサンプルを次に示します（各行の後に改行（'\ n'）文字があると想定します）。

"ID";"Date";"Time";"Status"
"1";"2013.01.01";"10:03 AM";"Active"
"1";"2013.01.05";"07:45 AM";"Active"
"2";"2013.01.03";"9:12 PM";"Active"
"2";"2013.01.11";"6:37 AM";"Inactive"
"1";"2013.01.22";"12:57 PM";"Inactive"

最初のヘッダー行を分割することができますが、それは私が探している結果には含まれません。検索がID列で行われ、検索値が1の場合、IDが1に等しい行のみを返し、上記の形式（ヘッダー行なし）と一致させたいと考えています。逆に、検索値が7の場合、行がないか、ヘッダー行のみが返されます。

これまでにできたのは、インポートしているデータから行を分割することだけです（私が見つけたこのコードはすべて、javascriptやjQueryにあまり詳しくありません）。

$.get("myFile.csv", function(data) {
    data = data.replace(/"/g, "");

    var lines = data.split('\n');

    var first = lines.shift().split(';');
});

// HTML Input Box
<input id="search_box" type="text">
<button id="btn_search">Search</button>

ありがとう。

4

3 に答える 3

6

純粋な JavaScript を使用した簡単なソリューションを次に示します。

// Assuming csvString is the string given in the question
var inputArray = csvString.split('\n');
var filteredArray = inputArray.filter(function (rowString) {
  return (rowString.split(";")[0] === '"1"');
});
var filteredString = filteredArray.join('\n');

これの終わりには、次のようにfilteredStringなります。

"1";"2013.01.01";"10:03 AM";"Active"
"1";"2013.01.05";"07:45 AM";"Active"
"1";"2013.01.22";"12:57 PM";"Inactive"

このソリューションで使用される方法の詳細については、次を参照してください。

于 2013-02-21T19:11:04.660 に答える
2

これは少し誇張されているように思えるかもしれませんが、この種の問題に対する最善の方法は、最初に難解なデータ形式 (CSV) を Javascript が全体的に理解できるもの (JSON 型のデータ — 配列とオブジェクト) に変換することだと思います。AJAX を使用できませんでした (ただし、その部分は既にソートされています)。そのため、HTML の要素から CSV データを抽出する例を作成しました。

ワーキングデモ

jsFiddle の例。

バックグラウンド コード

function findEntriesWithID(ID){
  var entries = [];

  for(var i = 0; i < csvArray.length; ++i){
    var row = csvArray[i];

    if(row.ID === ID){
      entries.push(row);
    }
  }

  return entries;
}

function csvToArray(csvString){
  // The array we're going to build
  var csvArray   = [];
  // Break it into rows to start
  var csvRows    = csvString.split(/\n/);
  // Take off the first line to get the headers, then split that into an array
  var csvHeaders = csvRows.shift().split(';');

  // Loop through remaining rows
  for(var rowIndex = 0; rowIndex < csvRows.length; ++rowIndex){
    var rowArray  = csvRows[rowIndex].split(';');

    // Create a new row object to store our data.
    var rowObject = csvArray[rowIndex] = {};

    // Then iterate through the remaining properties and use the headers as keys
    for(var propIndex = 0; propIndex < rowArray.length; ++propIndex){
      // Grab the value from the row array we're looping through...
      var propValue =   rowArray[propIndex].replace(/^"|"$/g,'');
      // ...also grab the relevant header (the RegExp in both of these removes quotes)
      var propLabel = csvHeaders[propIndex].replace(/^"|"$/g,'');;

      rowObject[propLabel] = propValue;
    }
  }

  return csvArray;
}

説明

  1. csvToArray文字列として CSV を受け取り、最初の行 (ヘッダー) を使用して後続の各行のプロパティを決定するオブジェクトの配列を出力します。これはコードの要であり、管理しやすい形式でデータを取得するためにさまざまな状況に適用できます。精巧かもしれませんが、ユースケースにはかなりしっかりしています。残りのコードは理解しやすくなります。

  2. findEntriesWithID指定された ID を受け取り、その ID プロパティを持つすべてのオブジェクト (以前は行) を返し、それらを新しい配列として返します。

  3. 上部の jQuery 関数はユーザーの操作をバインドし、結果を文字列化された JSON としてペインに出力します。CSV文字列を難解なオブジェクトに変換して、別の構文の文字列に戻すのはばかげているように思えるかもしれませんが、関数のこの部分を本当に必要なものに置き換えることができるという利点があります。あなたの結果で行います。

于 2013-02-21T19:38:10.137 に答える
-1

データを lines 変数のようにする方法を知っていると仮定して、これを行うコードを次に示します（あなたが言った）。任意のフィールドと任意の値で検索できます。

このコードのjsFiddle

$(document).ready(function() {

    var headers = '"ID";"Date";"Time";"Status"';
    var lines = [
    '"1";"2013.01.01";"10:03 AM";"Active"',
    '"1";"2013.01.05";"07:45 AM";"Active"',
    '"2";"2013.01.03";"9:12 PM";"Active"',
    '"2";"2013.01.11";"6:37 AM";"Inactive"',
    '"1";"2013.01.22";"12:57 PM";"Inactive"'
        ];

    // these contain the name of the field you want to search in
    //  as defined by your header and the value to search for.
    var searchField = 'ID';
    var searchForThisValue = 1; // this would be a parameter in your code
    var endResult =[]; // this is the stored result
    var fieldIndex = -1;

    $.each(headers.split(';'), function(index) {
        if( this.replace(/["']/g, "") == searchField ) {
            fieldIndex = index;
        }
    });

    $.each(lines, function() {
        var fields = this.split(';'); // split up by semicolon

        // strip the quotes around around the numbers
        if(fields[fieldIndex].replace(/["']/g, "") == searchForThisValue) {
            endResult.push(this);
        } 
    });

    // do whatever you want with your result, here I have just thrown 
    // them into an element with the id of 'blah'
    $.each(endResult, function() {
        $('#blah').append(this + '<br/>');
    });
});
于 2013-02-21T19:03:05.713 に答える