Я использую HandsOnTable, чтобы сделать редактирование таблиц базы данных более интерактивными на моем сайте.
HandsOnTable выполняет почти все мои требования, за исключением того, что некоторые столбцы в моей базе данных фактически хранят внешние ключи, а не локальные строковые значения.
В пользовательском интерфейсе я бы хотел, чтобы эти столбцы отображались в виде раскрывающихся меню, где пользователь выбирает читаемое значение, сопоставленное с ранее упомянутым внешним ключом (т.е. что-то вроде select
имени/значения HTML).
К сожалению, у HandsOnTable такой тип ячейки нет. Самое близкое к этому - autocomplete
. Это позволяет мне создать выпадающий список, но он содержит только значения; нет соответствующих клавиш. Вот как он создается:
"source": ["Jebediah", "Bob", "Bill", "Buzz"]
Поэтому я планирую отправить две строки Json с сервера:
Один, содержащий параметры, необходимые HandsOnTable для визуализации таблицы:
{
"data": [
{ "ID": 1, "Description": "Crude", "Volume": 204, "Customer": "jebediah" },
{ "ID": 2, "Description": "Hidrogen", "Volume": 513, "Customer": "Bob" },
{ "ID": 3, "Description": "Coal", "Volume": '67', "Customer": "Bill" },
{ "ID": 4, "Description": "Wood", "Volume": '513', "Customer": "Buzz" }
],
"columns": [
{ "data": "ID", "type": "numeric" },
{ "data": "Description", "type": "text"},
{ "data: "Volume", "type": "numeric" },
{ "data": "color", "type": "autocomplete", "strict": "true",
"source": ["Jebediah", "Bob", "Bill", "Buzz"]}
]
}
Второе отображение ключей к значениям
{
"mappings": [
{"key": 0, "value": "Jebediah"},
{"key": 0, "value": "Bob"},
{"key": 0, "value": "Bill"},
{"key": 0, "value": "Buzz"}
]
}
Все идет нормально. Теперь для сложной части:
Функция HandsOnTable имеет функцию (getData()
), которая позволяет мне извлекать данные таблиц в виде строки Json, готовой к отправке на сервер:
var jdata = myHandsOnTable.getData();
Где jdata будет выглядеть примерно так:
"data": [
{ "ID": 1, "Description": "Crude", "Volume": 204, "Customer": "jebediah" },
{ "ID": 2, "Description": "Hidrogen", "Volume": 513, "Customer": "Bob" },
{ "ID": 3, "Description": "Coal", "Volume": '67', "Customer": "Bill" },
{ "ID": 4, "Description": "Wood", "Volume": '513', "Customer": "Buzz" }
]
Теперь перед публикацией я хотел бы заменить эти значения для узла Customer
их соответствующим парным ключом в строке japp mappings
.
Как я могу достичь этого в JavaScript/JQuery?
Есть ли функция, которая работает что-то следующим образом:
jdata.replaceNode('node', mappings)
благодаря