Я извлекаю данные из базы данных с помощью json в jQuery и asp.net, и я делаю это для каждой таблицы каждый раз. Есть ли способ создать одну функцию и передать некоторые параметры, такие как (имя столбца, имя таблицы и элемент управления для отображения) для всех таблиц.
function LoadData(Url, Data, ControlToShow, Columns){
$.ajax({ type: "post",
url: Url,
data: Data,
contentType: "application/json;charset=utf-8", dataType: "json",
success: function (data) {
if (data.d != null || data.d != 'null') {
var items = data.d;
$("#" + ControlToShow).append(items[0].Columns[1]);
}
}
}
Или, другими словами, использовать динамический объект json-массива, передав имя столбца, например
var items = response.d;
var colName = 'Customers';
alert(items[0].colName);
colName = 'CustomerID';
alert(items[0].colName);
Или что-то вроде этого.
Да, ты можешь это сделать :-
function LoadData(Url, Data, ControlToShow, ColumnName) {
$.ajax({
type: "post",
url: Url,
data: Data,
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (data) {
if (data.d != null) {
var items = data.d;
$("#" + ControlToShow).append(items[0][ColumnName]);
}
}
});
}
и назовите его так:
LoadData(serviceUrl, {data_you_need_to_pass}, 'ControlID', 'CustomerID');
В javascript вы можете получить доступ к свойствам, просто обратившись к ним по имени:
var items = response.d;
alert(items[0].Customers);
alert(items[0].CustomerID);
или если имя свойства хранится в переменной, вы можете получить к ним доступ, например:
var items = response.d;
var colName = 'Customers';
alert(items[0][colName]);
colName = 'CustomerID';
alert(items[0][colName]);
Вы можете создать представление шаблона и передать данные для каждой таблицы. В разделе тела вы можете просто перебрать данные и добавить их в раздел тела вашей таблицы.
<table id="<%= YOUR TABLE NAME %>">
<thead>
<tr>
<th><% YOUR COLUMN NAME %></th>
....
</tr>
<thead>
<tbody class="mytable"></tbody>
...
</table>
success: function (data) {
if (data.d != null || data.d != 'null') {
var items = data.d;
var tr = $('<tr></tr>').appendTo('.mytable');
$.each(data.d, function(){
//append your td elements to your tr above
});
}
}
попытайтесь создать свой json что-то вроде этого. поэтому вы можете прочитать столбец и данные для создания таблицы.
{"column_name":['column1','column2','column3'],"records":[{'id':1 ...}]}
ПРОВЕРЬТЕ КОД EDIT, FIDDLE
$(function(){
var json ={"column_name":['ID','COUNTRY'],"records":[{"id":1 ,"name": "USA"},{"id":2 ,"name": "INDIA"},{"id":3 ,"name": "AUSTRALIA"}]};
var column_arr = json.column_name;
var column_arr_length = column_arr.length;//no of column present.
// creating table header
var $thead = $('#mytable thead');
var row = '<tr>'
for(var i= 0; i< column_arr_length;i++){
row += '<th>'+column_arr[i]+'</th>';
}
row += '</tr>';
$thead.append(row);// adding head to table
// creating table body
var $body = $('#mytable tbody');
var body_data = json.records;
var body_data_length = body_data.length;//no of row in body.
var body_row = '';
for(var i= 0; i< body_data_length;i++){
var row_obj = body_data[i];
console.log(row_obj);
body_row += '<tr>';
for(var key in row_obj){
body_row += '<td>'+row_obj[key]+'</td>';
}
body_row += '</tr>';
}
$body.append(body_row);// adding rows to table
})
HTML-код
<table id="mytable">
<thead></thead>
<tbody></tbody>
</table>