서버에서 편집 가능한 데이터로 열을 가져오는 방법이 있습니까?
그래서 저는 사용자가 요청하는 테이블에 대해 하나의 일반 페이지를 만들려고 합니다.그렇기 때문에 서버에서 모든 데이터를 가져오려고 하고 클라이언트 측에 하드코딩된 것은 없습니다.
$(document).ready(function(){
/* Add/remove class to a row when clicked on */
$('#table1 tr').on('click', function() {
$(this).toggleClass('row_selected');
} );
var which_table=window.location.pathname;
var which_table_data=which_table.substring(0, which_table.length-1)+'/data';
var table_name=which_table.substring(14, which_table.length-1);
$('#table1').dataTable({
"bProcessing": true,
"bServerSide": true,
"bjQueryUI": true,
"sAjaxSource": which_table_data,
"bPaginate": true,
"sPaginationType": "full_numbers",
"bjQueryUI": true,
"sScrollX":"100%",
"aoColumnDefs": [{
"targets" : [0],
"visible" : false,
"searchable" : false
}]
}).makeEditable({
"sUpdateURL": "../update/" + table_name,
"sAddURL": "../add/" + table_name,
"sDeleteURL": "../delete/" + table_name,
"aoColumns": $.ajax({
dataType: "json",
url: '/get_aoColumns',
data: function (table_name) {
return {
q: table_name
};
},
results: function (data) {
alert(data);
}
});
});
});
그래서 이 작품에서는.var which_table=window.location.pathname;저는 제가 성공한 서버에서 해당 테이블에 대한 데이터를 가져오려고 노력합니다.하지만 이제는 서버에서 aoColumns 배열까지 받아보고 싶습니다.제 질문은 aoData, seco 및 기타 필수 필드와 함께 동일한 요청으로 데이터를 보낼 수 있는지 여부입니다.aoColumns가 필요한 json의 일부가 아니기 때문에 데이터를 제대로 렌더링하지 못할 수 있다고 생각합니다.검증도 서버측이 되어 테이블당 한 페이지씩 설계할 필요가 없도록 어떤 테이블에 대해서도 aoColumns를 어떻게 얻을 수 있습니까?
아래 부분은 정확한 방법이 무엇인지 모르기 때문에 작동하지 않습니다.
"aoColumns": $.ajax({
dataType: "json",
url: '/get_aoColumns',
편집됨 :-
@garryp의 접근법을 시도했습니다.
서버에서 받은 데이터입니다.
[{"cssclass": "required", "type": "textarea"}, {"sUpdateURL": "../update/my_table", "cssclass": "required", "type": "textarea", "loadtype": "POST", "submit": "OK"}, {"loadurl": "../data/", "sUpdateURL": "../update/my_table", "loadtype": "POST", "type": "select", "submit": "OK"}]
이건 내 코드입니다.
$(document).ready(function(){
/* Add/remove class to a row when clicked on */
$('#table1 tr').on('click', function() {
$(this).toggleClass('row_selected');
} );
var which_table=window.location.pathname;
var which_table_data=which_table.substring(0, which_table.length-1)+'/data';
var table_name=which_table.substring(14, which_table.length-1);
if(table_name.indexOf('Welog')> -1) {
$('#table1').dataTable({
"bProcessing": true,
"bServerSide": true,
"bjQueryUI": true,
"sAjaxSource": which_table_data,
"bPaginate": true,
"sPaginationType": "full_numbers",
"bjQueryUI": true,
"sScrollX": "100%"
});
$('#formAddNewRow').hide();
}
else {
$.ajax({
url: '../get_aodata/' + table_name,
async: false,
success: function (data) {
alert(data);
$('#table1').dataTable({
"bProcessing": true,
"bServerSide": true,
"bjQueryUI": true,
"sAjaxSource": which_table_data,
"bPaginate": true,
"sPaginationType": "full_numbers",
"bjQueryUI": true,
"sScrollX": "100%",
"aoColumnDefs": [{
"targets": [0],
"visible": false,
"searchable": false
}]
}).makeEditable({
"sUpdateURL": "../update/" + table_name,
"sAddURL": "../add/" + table_name,
"sDeleteURL": "../delete/" + table_name,
"sAddDeleteToolbarSelector": "#table1_length",
"aoColumns" : data
/*"aoColumns" : [
{
"cssclass": "required",
"type":"textarea"
},
{
"cssclass": "required",
"type":"textarea",
"submit" : "OK",
"sUpdateURL": "../update/"+table_name,
"loadtype" : "POST"
},
{
"loadurl" : "../data/",
"type" : "select",
"submit": "OK",
"sUpdateURL": "../update/"+table_name,
"loadtype" : "POST"
}
]*/
});
}
});
}
});
따라서 이 코드의 aoColumns에 댓글이 달린 것을 보면 서버에서 얻은 출력과 정확히 일치하지만 서버에서 얻은 출력은 그렇지 않습니다.t work and the one commented out if uncommented does work. The one got from the server if used using aoColumns : data just behaves the same way as if aoColumns parameter wasnmakeable function에 전혀 언급되어 있지 않습니다.콘솔에 오류가 발생하지 않기 때문에 데이터가 해당 파라미터에 도달하지 못하고 있음을 의미합니다.
솔루션 :-
success : function(data){
var data_str= JSON.parse(data);
});
알겠습니다. json string을 parse를 사용하여 JS object로 변환해야 했는데 결국 작동했습니다.
사용자가 반환 값을 할당하고 있으므로 작동하지 않습니다.$.ajax(...)로.aoColumns여기("aoColumns"에 열 배열을 할당해야 할 경우):
}).makeEditable({
...
"aoColumns": $.ajax({
대신에 당신이 해야 할 일은 AJAX에 먼저 전화를 거는 것입니다.그럼 jQuery 안에서successfunction set up your datable.
$.ajax({
url: '/get_aoColumns',
...
success : function(data) {
// ToDo: put all your datatable code in here.
// and assign `data` to "aoColumns"
/** data table code **/
}).makeEditable({
"aoColumns": data
/** rest of data table code **/
}
요점을 분명히 하기 위해 중요한 부분을 제외한 모든 부분을 생략하려고 노력했지만, 이는 여러분이 어디에서 잘못했는지 이해하는 데 도움이 될 것입니다.
여기 JS Fiddle을 설정했습니다. (테스트되지 않은) 코드 샘플이 있습니다. 만약 이게 말이 안 된다면요.
http://jsfiddle.net/GarryPas/got4fxhb/1/
가정하에/get_aoColumns모든 것을 올바르게 반환하고 있습니다. 먼저 해당 정보를 가져온 다음 성공 처리기에서 데이터 테이블을 생성하려는 것 같습니다.위의 코드에서 데이터Tables 선언은 ajax 요청이 완료되기 전에 완료될 수 있는 것으로 보이므로, 이는 어떻습니까?
$(document).ready(function () {
/* Add/remove class to a row when clicked on */
$('#table1 tr').on('click', function () {
$(this).toggleClass('row_selected');
});
var which_table = window.location.pathname;
var which_table_data = which_table.substring(0, which_table.length - 1) + '/data';
var table_name = which_table.substring(14, which_table.length - 1);
//wrap the ajax request to get aoColumns outside of the initializaer
$.get('/get_aoColumns', {q: table_name}, function (aoColumns) {
$('#table1').dataTable({
"bProcessing": true,
"bServerSide": true,
"bjQueryUI": true,
"sAjaxSource": which_table_data,
"bPaginate": true,
"sPaginationType": "full_numbers",
"sScrollX": "100%",
"aoColumnDefs": [{
"targets": [0],
"visible": false,
"searchable": false
}]
}).makeEditable({
"sUpdateURL": "../update/" + table_name,
"sAddURL": "../add/" + table_name,
"sDeleteURL": "../delete/" + table_name,
"aoColumns": aoColumns //the data retrieved from the request to get_aoColumns
});
});
});
언급URL : https://stackoverflow.com/questions/30116367/is-there-a-way-to-get-aocolumns-from-the-server-in-datatable-editable
'programing' 카테고리의 다른 글
| INT 열에 NULL 값 삽입 (0) | 2023.09.07 |
|---|---|
| 문자열을 분할하고 마지막 요소를 가져옵니다. (0) | 2023.09.07 |
| 공극 포인터 역참조 (0) | 2023.09.07 |
| VBA의 명명된 범위에서 값 가져오기 (0) | 2023.09.07 |
| 수평 선형 레이아웃 안드로이드에서 위젯을 오른쪽 정렬하는 방법? (0) | 2023.09.07 |