2014-01-30 6 views
6

Я создал пример приложения, которое преобразует html-таблицу в JSON. Проблема в том, что JSON не имеет повторяющихся значений, и я хочу удалить последние два столбца из JSON.Преобразование таблицы Html в JSON

Моя JSON, который был сгенерирован приведен ниже

[ 
    { 
     "Person Name":"Smith", 
     "Score":"disqualified", 
     "Price":"150", 
     "Tax":"41" 
    }, 
    { 
     "Person Name":"Jackson", 
     "Score":"94", 
     "Price":"250", 
     "Tax":"81" 
    }, 
    { 
     "Person Name":"Doe", 
     "Score":"80", 
     "Price":"950", 
     "Tax":"412" 
    }, 
    { 
     "Person Name":"Johnson", 
     "Score":"67", 
     "Price":"750", 
     "Tax":"941" 
    } 
] 

Но мой ожидаемый JSON, как

[ 
    { 
     "Person Name":"Jill", 
     "Person Name":"Smith", 
     "Score":"disqualified" 
    }, 
    { 
     "Person Name":"Eve", 
     "Person Name":"Smith", 
     "Score":"94" 
    }, 
    { 
     "Person Name":"John", 
     "Person Name":"Smith", 
     "Score":"80" 
    }, 
    { 
     "Person Name":"Adam", 
     "Person Name":"Smith", 
     "Score":"67" 
    } 
] 

Может кто-нибудь пожалуйста, скажите мне, как генерировать выше JSON из таблицы

Мой код приведен ниже.

HTML код

<table id='example-table'> 
    <thead> 
    <tr> 
     <th>Person Name</th> 
     <th>Person Name</th> 
     <th data-override="Score">Points</th> 
     <th>Price</th> 
     <th>Tax</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>Jill</td> 
     <td>Smith</td> 
     <td data-override="disqualified">50</td> 
     <td>150</td> 
     <td>41</td> 
    </tr> 
    <tr> 
     <td>Eve</td> 
     <td>Jackson</td> 
     <td>94</td> 
     <td>250</td> 
     <td>81</td> 
    </tr> 
    <tr> 
     <td>John</td> 
     <td>Doe</td> 
     <td>80</td> 
     <td>950</td> 
     <td>412</td> 
    </tr> 
    <tr> 
     <td>Adam</td> 
     <td>Johnson</td> 
     <td>67</td> 
     <td>750</td> 
     <td>941</td> 
    </tr> 
    </tbody> 
</table> 
<button id="convert-table" >Convert!</button> 

Javascript код

$('#convert-table').click(function() { 
    var table = $('#example-table').tableToJSON(); 
    console.log(table); 
    alert(JSON.stringify(table)); 
}); 

DEMO (JSFiddle)

+0

Существует два ключа под названием «Имя человека». ["Имена внутри объекта ДОЛЖНЫ быть уникальными."] (Http://www.ietf.org/rfc/rfc4627.txt) – alexP

+0

Нравится это ?? http://jsfiddle.net/robertrozas/xAh4T/ – Hackerman

+0

игнорировать последние два столбца: 'tableToJSON ({ignoreColumns: [3, 4]});' –

ответ

8

что-то подобное будет работать (не очень приятно, но)

Объяснение:

Вы можете использовать ignoreColumns, чтобы избежать столбцов 3 и 4.

Вы можете использовать заголовки для изменения «заголовков» (ключей в json-файле). Но это займет также первая строка (одна с TH).

Итак, мы должны удалить эту первую строку после построения массива json.

$('#convert-table').click(function() { 
    var $table = $('#example-table'); 

    var table = $table.tableToJSON(
         { 
         ignoreColumns:[3, 4], 
         headings: ['FirstName', 'LastName', 'Score'] 
         }); 
    var newTable = $.map(table, function(e){ 
     return (e.FirstName == "Person Name") ? null : e; 
    }); 
    console.log(newTable); 
    alert(JSON.stringify(newTable)); 
}); 

см jsfiddle

EDIT

Если число столбцов с Person Name является динамическим, вы могли бы сделать что-то подобное (при условии, что вы никогда не хотите две последние строки)

function convertToTable(el, numberOfColumns, columnNames) { 
    var columnsToIgnore = [numberOfColumns-2, numberOfColumns-1]; 
    var table = el.tableToJSON(
     { 
      ignoreColumns:columnsToIgnore, 
      headings: columnNames 
     }); 
    var result = $.map(table, function(e){ 
     return (e['Person Name0'] == "Person Name") ? null : e; 
    }); 
    alert(JSON.stringify(result)); 
} 

$('#convert-table').click(function() { 
    var $table = $('#example-table'); 
    var columns = $table.find('th'); 
    var numberOfColumns = columns.length;  
    var columnNames = columns.map(function(index) { 
     var text = $(this).text(); 
     return text == 'Person Name' ? text + index : text; 
    }).get(); 

    convertToTable($table, numberOfColumns, columnNames); 
}); 

см. JsFiddle

+0

проблема в том, что столбцы Имя лица динамическое, может быть два или более, чем –

+0

@ user3253853, чем вам придется создавать свою собственную функцию, которая будет вызывать tableToJSON с правильными параметрами. –

+0

@ user3253853 Кстати, не могли бы вы показать некоторые «разные случаи», которые могли бы существовать? –

1

удалить последние два поля используют "ignoreColumns" вариант

var table = $('#example-table').tableToJSON({ 
    ignoreColumns:[2,3] 
}); 

и делают заголовки уникальных

<th>Person Name</th> 
<th>Person SurName</th> 
+0

Спасибо ..... это работает при удалении последних двух столбцы .... но как насчет генерации JSON с дублирующимся ключом (имена персонажей) с разными значениями –

+0

Я не думаю, что этот модуль предназначен для этого. Вам нужно будет использовать другой модуль, который позволяет это, если вы можете найти любое, что делает. –

+0

другой модуль как ???? ......... –

1

Попробуйте это:

$('#convert-table').click(function() { 
var table = $('#example-table').tableToJSON({ 
    ignoreColumns:[3,4]} 
); 
console.log(table); 
alert(JSON.stringify(table)); 
}); 

Jsfiddle: http://jsfiddle.net/robertrozas/9VX6Z/

+0

его не имя Фамилия, должно быть имя человека –

3

У вас не может быть дубликатов ключей, но вместо этого вы можете использовать массив имен.Пример:

{ 
    "PersonNames":["John","Smith"], 
    "Score":"80" 
}, 
+0

да .... @ Per Quested Aronsson –

Смежные вопросы