first sorry for my bad english.i have a grid with data from mysql iam using php to connect my grid with mysql data.
the grid is working fine with the fetch data but now i need a external dropdown to search data from the grid here the main thing is that
i want to search data from database and get the searched data in the grid.i dont know what code i do in my dropdown to search the data. function is same for both fetch or search data.
i want to send my dropdown value as a parameter in the function get_sql_for_journal_inquiry_iq().i want to send the dropdown value in the $account param of php function. how do i do this.
plz tell me what change i do here
change: function(e){
});
}
my code is...
<!----------------grid------------------>
<html>
<head>
<title>GRID PHP</title>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css" />
<!-- <link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.blueopal.min.css" />-->
<script type="text/javascript" src="http://cdn.kendostatic.com/2012.2.710/js/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2015.2.805/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2015.2.805/styles/kendo.material.min.css" />
<script type="text/javascript" src="path/to/date.js"></script>
<!-- <script src="http://cdn.kendostatic.com/2015.1.429/js/jszip.min.js"></script>-->
<script type="text/javascript"></script>
<script>
$(function() {
$('#ddl').kendoDropDownList({
autoBind: false,
filter: "startswith",
placeholder: "Select country...",
// separator: ", ",
serverFiltering: true,
enforceMinLength: true,
dataTextField: "account_name",
dataValueField: "account_code",
dataSource: {
// autoBind: true,
dataType: "json",
transport: {
read: "data/statusdropdown.php",
}
},
change: function(e){
var grid = $('#grid').data('kendoGrid');
// $("#grid").data("kendoGrid").dataSource.filter({});
var field = 'CategoryID';
var operator = 'eq';
var value = e.sender.value();
grid.dataSource.filter({
field: field,
operator: operator,
value: value
});
}
});
$("#grid").kendoGrid({
dataSource: {
transport: {
// read: "data/fetch.php",
read: {
url: "../includes/db/gl_db_trans.php",
// url: "data/fetch.php",
type: "post",
data:{method:"get_sql_for_journal_inquiry_iq"},
dataType: "json",
},
},
schema: {
model: {
id: "trans_no",
fields: {
tran_date: { type: "date" },
trans_type: { type: "string" },
trans_no: { type: "number" },
name: { type: "string" },
reference: { type: "string" },
cheque: { type: "string" },
amount: { type: "number" },
memo_: { type: "string" },
user_id: { type: "string" },
}
},
},
batch: true,
pageSize: 5,
navigatable: true,
},
groupable: true,
reorderable: true,
editable: "inline",// editable: "incell",
resizable: true,
scrollable: true,
filterable: true,
sortable: true,
columnMenu: true,
pageable: {
alwaysVisible: false,
pageSizes: [5, 10, 20, 100],
buttonCount: 5,
refresh: true,
},
columns: [
{
type: "date",
field: "tran_date",
title: "start_date",
width: "8%",
format:"{0:dd/MM/yyyy}",
template: '#= kendo.toString(tran_date, "dd-MM-yyyy")#',
},
{
field: "trans_type",
title: "trans_type",
width: '50px' ,
},
{
field: "trans_no",
width: "50px",
title: "trans_no",
template: "#=trans_no#",
},
{
field: "name",
width: "50px",
title: "name",
},
{
field: "reference",
title: "reference",
width: '50px' ,
},
{
field: "cheque",
title: "cheque",
width: '50px' ,
},
{
field: "amount",
title: "amount",
width: '50px' ,
},
{
field: "memo_",
title: "memo",
width: '50px' ,
},
{
field: "user_id",
title: "user_id",
width: '50px' ,
},
{
field: "trans_no",
title: "View",
template:"<button id='qq' class='editButtons' style='float:right'><a target='popup' onclick=\"window.open('../view/gl_trans_view.php?type_id=#=trans_type#&trans_no=#=trans_no#','popup','width=600,height=600'); return false;\" >view</a></button>",
width: '50px'
}
],
});
});
</script>
</head>
<body><div id="example">
<style>
* {
font-family: "Verdana", sans-serif;
font-size: 10pt;
}
.k-grid td
{
padding: 0.5em 2em
}
#grid table {
table-layout:fixed
}
</style>
<div id="grid" style="width: 100%;" >
<div id="filters">
<input id="ddl" />
</div>
</div>
</div>
<script>
</script>
</body>
</html>
//my php function is this
$method = $_POST['method'];
$method();
//$method = $_POST['method'];
//==============iqra
function get_sql_for_journal_inquiry_iq($dimension=null,$account='')
{
// print $account;
$sql = "SELECT IFNULL(a.gl_seq,0) as gl_seq,gl.tran_date,
gl.type as trans_type,
gl.type_no as trans_no,
IFNULL(MAX(supp.supp_name), MAX(cust.name)) as name,
gl.dimension_id,
gl.dimension2_id,'',
refs.reference,gl.cheque,"
.($dimension ? " -SUM(IF(dim.dimension in(gl.dimension_id,gl.dimension2_id), gl.amount, 0))
as amount,":" SUM(IF(gl.amount>0, gl.amount,0)) as amount,")
."com.memo_,
IF(ISNULL(u.user_id),'',u.user_id) as user_id
";
define("TB_PREF","0_");
$sql .= ", gl.approval
, gl.counter as id,
gl.account ,a.stamp
";
$sql.= " FROM ".TB_PREF."gl_trans as gl
LEFT JOIN ".TB_PREF."audit_trail as a ON
(gl.type=a.type AND gl.type_no=a.trans_no)
LEFT JOIN ".TB_PREF."comments as com ON
(gl.type=com.type AND gl.type_no=com.id)
LEFT JOIN ".TB_PREF."refs as refs ON
(gl.type=refs.type AND gl.type_no=refs.id)
LEFT JOIN 0_users as u ON
a.user=u.id
LEFT JOIN 0_debtors_master cust ON gl.person_type_id=2 AND gl.person_id=cust.debtor_no
LEFT JOIN 0_suppliers supp ON gl.person_type_id=3 AND gl.person_id=supp.supplier_id"
.($dimension ?
" LEFT JOIN (SELECT type, type_no, MAX(IFNULL(dimension_id, dimension2_id)) dimension
FROM
".TB_PREF."gl_trans GROUP BY type, type_no) dim
ON gl.type=dim.type AND gl.type_no=dim.type_no" : '').
" where gl.amount!=0";
if ($account != null)
$sql .= " AND gl.account = ".db_escape($account);
$sql .= " GROUP BY gl.tran_date, a.gl_seq, gl.type, gl.type_no";
$sql .= " ORDER BY a.stamp DESC";
// return $sql;
$query = mysql_query($sql)or die(mysql_error());
// print_r(mysql_fetch_array($query));
while($obj = mysql_fetch_array($query)) {
$arr[] = array(
'tran_date' => str_replace("\'", "'", $obj["tran_date"]),
'trans_type' => str_replace("\'", "'", $obj["trans_type"]),
'trans_no' => str_replace("\'", "'", $obj["trans_no"]),
'name' => str_replace("\'", "'", $obj["name"]),
'reference' => str_replace("\'", "'", $obj["reference"]),
'cheque' => str_replace("\'", "'", $obj["cheque"]),
'amount' => str_replace("\'", "'", $obj["amount"]),
'memo_' => str_replace("\'", "'", $obj["memo_"]),
'user_id' => str_replace("\'", "'", $obj["user_id"]),
);
}
print json_encode($arr);
}
19 Answers, 1 is accepted
Hi Iqra,
The data option of the data source accepts either a JavaScript function or a JavaScript function name. Therefore, you could set it as follows:
data: get_sql_for_journal_inquiry_iq
or, you could directly specify the JavaScript function:
data:function(){ }It is important to point out that the grid makes an AJAX request and the data option should be used to return an object with the relevant parameter name and value.
I hope this helps.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
print_document_link($acc, _("Print"), true, $a, ICON_PRINT);
my js fun
function phpadd(a) {
var phpadda="<?php echo print_document_link(a);?>"
alert(phpadda);
// alert(a);
// return phpadda;//
}
my template
{
field: "trans_no",
title: "print",
template:"<button id='qq' value='print' class='editButtons' style='float:right'>#=phpadd(trans_no,trans_type)#</button>",
width: '40px'
}
Hi Iqra,
If you would like to pass multiple field values to the template function, I would recommend sending the "data" internal variable. It contains all of the field values of the current row. Check out the following Dojo sample:
https://dojo.telerik.com/UHeTixEk
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
thanku for your support..i am facing some issue that how can i pass field in array like this
this is my js code
var systypes_array = <?php echo json_encode($systypes_array); ?>;
and this is my grid column code
{
field: "trans_type",
title: "trans_type",
width: '50px' ,
template:'<span id="chipakja" name="chipakja" data-id="#=trans_type#">'+systypes_array['#=trans_type#']+'</span>',
},
here trans_type is passing as a string if i remove the single quotes then it gives error
i want to pass it as a param so it access the correct value from the systypes_array
plz need your help
Hi Iqra,
In the current scenario, the array is available on the server. However, the grid is a completely client-side widget. What I can recommend is that you pass a function to the template:
template:"#=myFunc(trans_type)#"
function myFunc(trans_type){
// access the collection in JavaScript:
// get the value from the collection based on the trans_type
return '<span id="chipakja" name="chipakja" data-id="'+trans_type+'">'+value+'</span>'
}The following StackOverflow article demonstrates how an array could be accessed within a JavaScript function:
https://stackoverflow.com/questions/33326699/passing-laravel-array-in-javascript
I hope this helps.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
thanku for your response sir its works for me..sir i am facing an issue after loding 7000 data in my grid and using ajax for some specific columns to get the data the grid performance becomes so slower then before.i have done virtual scrolling and severside filtering but it is still so slow.i also add pagination but nothing works for me.i cant remove ajax call also plz help
Hi Iqra,
In case the $.ajax requests are executed within the template function, this ajax request will be sent for every row. Therefore, if there are a lot of rows, this might lead to having a negative impact on the performance of the grid.
Could you share the updated grid along with the server-side implementation? Based on the snippets, I might be able to provide more accurate suggestions.
It is recommended to either use virtualization or paging, not both of them - they are mutually exclusive.
Looking forward to your reply.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
thanku for your quick response
here is my js function
function counter(a,b,c) {
// alert(a);
var trans_type=b;
var trans_no=a;
var nam=c;
$j.ajax({
url:"counterpage.php",
type: "POST",
async:false,
data: {
'ttye':trans_type,
'tno':trans_no,
'namee':nam,
},
dataType: "html",
success: function(response) {
globatr.push(a);
// globalvar=response;
ajaxResult.push(response);
// $("#grid-counter-"+a).html( response );
},
error: function(response) {
$("#grid-counter-"+a).html( response );
}
})
return " ";
}
//=================
$j(function () {
$j("#grid").kendoGrid({
dataSource: {
transport: {
// read: "data/fetch.php",
read: function (options) {
// make JSONP request to https://demos.telerik.com/kendo-ui/service/products
$j.ajax({
type: 'POST',
url: 'journal_inquiry2.php',
data: {
'acc': "<?php echo isset($_POST['account']) ? ($_POST['account']) : (''); ?>",
'from': "<?php echo isset($_POST['FromDate']) ? ($_POST['FromDate']) : (''); ?>",
'to': "<?php echo isset($_POST['ToDate']) ? ($_POST['ToDate']) : (''); ?>",
'filtertype': "<?php echo isset($_POST['filterType']) ? ($_POST['filterType']) : (''); ?>",
'userids': "<?php echo isset($_POST['userid']) ? ($_POST['userid']) : (''); ?>",
'AlsoClosedd': "<?php echo isset($_POST['AlsoClosed']) ? ($_POST['AlsoClosed']) : (''); ?>",
'Memoo': "<?php echo isset($_POST['Memo']) ? ($_POST['Memo']) : (''); ?>",
'statuss': "<?php echo isset($_POST['status']) ? ($_POST['status']) : (''); ?>",
'Refs': "<?php echo isset($_POST['Ref']) ? ($_POST['Ref']) : (''); ?>",
'trans_noo': "<?php echo isset($_POST['trans_no']) ? ($_POST['trans_no']) : (''); ?>",
'cheque_noo': "<?php echo isset($_POST['cheque_no']) ? ($_POST['cheque_no']) : (''); ?>",
'searchingg': "<?php echo isset($_POST['searching']) ? ($_POST['searching']) : (''); ?>",
'search_valuee': "<?php echo isset($_POST['search_value']) ? ($_POST['search_value']) : (''); ?>",
method: "get_sql_for_journal_inquiry_iqra"//
},
// 'acc':val
dataType: "json", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
success: function (result) {
// notify the data source that the request succeeded searchingg
options.success(result);
// console.log(globatr);
for(var i =0;i <= result.length;i++)
{
//console.log(globatr[i]);
$("#grid-counter-"+globatr[i]).html( ajaxResult[i] );
$("#grid-amount-"+amnttransno[i]).html( amnt[i] );
$("#grid-dim1-"+dim_transnoo[i]).html( dim_1[i] );
$("#grid-dim2-"+dim_transnoo2[i]).html( dim_2[i] );
// console.log(globalvar);
// $.each(ajaxResult, function(index, value){
// $("#grid-counter-"+globatr).html(value);
// });
}
// globatr.forEach(logArrayElements);
// $.each(fruitsArray, function(index, value){
// $("#result").append(index + ": " + value + '<br>');
// });
},
error: function (result) {
// notify the data source that the request failed
options.error(result);
}
});
//===========
}
},
autoSync: true,
// serverPaging: true,
serverFiltering: true,
serverSorting: true,
serverGrouping: true,
schema: {
model: {
fields: {
tran_date: {type: "date"},
trans_type: {type: "string"},
trans_no: {type: "string"},
name: {type: "string"},
reference: {type: "string"},
cheque: {type: "string"},
amount: {type: "number"},
memo_: {type: "string"},
user_id: {type: "string"},
dimension_id: {type: "number"},
dimension2_id: {type: "number"},
RunningTotal: {type: "number"},//supp_reference
supp_reference: {type: "string"},
}
},
},
batch: true,
pageSize: 20,
// serverPaging: true,
navigatable: true,
// pageSize: 30,
// serverPaging: true,
},
groupable: true,
reorderable: true,
// editable: "inline",// editable: "incell",
resizable: true,
scrollable: true,
// height: 600,
filterable: true,
sortable: true,
// pageable: true,
// columnMenu: true,
pageable: {
alwaysVisible: false,
pageSizes: [5, 10, 20, 100],
buttonCount: 5,
refresh: true,
},
// dataBound: function() {
// for (var i = 0; i < this.columns.length; i++) {
// this.autoFitColumn(i);
//
// }
// },
// scrollable: {
// virtual: true // <--- This
// },
// serverPaging: true,
columns: [
{
hidden: !showclosed,
// field: "tran_date",
title: "#",
// template: '<input type = "date" id = "calendar">',
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
// width: "8%",
width: "calc(1.6rem + 1.32em + 0px)",
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
//
//editor: dateTimeEditor,
//
type: "date",
field: "tran_date",
title: "Date",
// template: '<input type = "date" id = "calendar">',
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
// width: "8%",
format: "{0:dd/MM/yyyy}",
template: '#= kendo.toString(tran_date, "dd-MM-yyyy")#',
width: "calc(3.6rem + 1.32em + 0px)",
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
//
//editor: dateTimeEditor,
//
field: "trans_type",
title: "Type",
// template:'<span id="chipakja" name="chipakja" data-id="#=trans_type#">'+systypes_array['#=trans_type#']+'</span>',
template: function (dataItem) {
var Row = kendo.htmlEncode(dataItem.trans_type);
//alert(Row);
return "<p id=\"chipakja\">" + kendo.htmlEncode(systypes_array[Row]) + "</p>";
},
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
//width: '50px' ,
width: "calc(3.9rem + 0.32em + 0px)",
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
field: "trans_no",
//width: "50px",
title: "Trans#",
width: "calc(1.25rem + 1.32em + 1px)",
//template: "#=trans_no#",
// template: "<a href='../../sales/view/view_receipt.php?trans_no=#=trans_no#&trans_type=#=trans_type#' >#=trans_no#</a>",
template: "<span name=\"viewlnk\" id=\"viewlnk\" onClick=\"viewwlink(#=trans_no#,#=trans_type#); return false; \" " +
"style='cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><a href='' >#=trans_no#</a></span>",
},
{
field: "name",
width: "50px",
title: "CounterParty",
//globatr // template:"<p id='grid-counter-#= trans_no#'>" +"#= counter(trans_no,trans_type,name)#"+"</p>",
template:"<p id='grid-counter-#= trans_no#'>" +"#= counter(trans_no,trans_type,name)#"+"</p>",
},
{
field: "dimension_id",
// width: "50px",
title: dim1_text,
width: "calc(3.25rem + 1.32em + 0px)",
// template: "#=trans_no#",
template:"<p id='grid-dim1-#= trans_no#'>" +"#= dimens_1(trans_no,dimension_id)#"+"</p>",
},
{
field: "dimension2_id",
// width: "50px",
title: dim2_text,
width: "calc(3.50rem + 1.32em + 0px)",
// template: "#=trans_no#",
template:"<p id='grid-dim2-#= trans_no#'>" +"#= dimens_2(trans_no,dimension2_id)#"+"</p>",
},
{
//
//editor: dateTimeEditor,
//
field: "reference",
title: "Reference",
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
width: "calc(3.6rem + 1.32em + 0px)",
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
//
//editor: dateTimeEditor,
//
field: "cheque",
title: "Cheque No",
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
width: '50px',
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
//
//editor: dateTimeEditor,sum_amount
//
//
field: "amount",
title: "Amount",
format: "{0:0,0.00}",
// template:'#=kendo.toString(Math.abs(amount))#',
width: '50px',
template:"<p id='grid-amount-#= trans_no#'>" +"#= sumamount(trans_no,amount)#"+"</p>",//ye kya hai? ek mint mein aaya wait kartn
// template:'#=sumamount(amount)#',
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
//
//editor: dateTimeEditor,
//
field: "memo_",
title: "Memo",
width: "calc(3.25rem + 2.32em + 2px)",
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
// width: '50px' ,
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
field: "user_id",
title: "User",
width: "calc(3.9rem + 0.32em + 1px)",
},
{
field: "RunningTotal",
title: "RB",
width: "calc(3.9rem + 0.32em + 1px)",
format: "{0:0,0.00}",
},
{
//
//editor: dateTimeEditor,
//
// field: "trans_no",
title: "View",
//template:"<button id='qq' class='editButtons' style='float:right'><a target='popup' onclick=\"window.open('../view/gl_trans_view.php?type_id=#=trans_type#&trans_no=#=trans_no#','popup','width=600,height=600'); return false;\" >view</a></button>",
// template:"<button id='view' name='view' class='editButtons' style='float:right' onClick=\"vieww(#=trans_no#,#=trans_type#); return false; \"><img src=\"../../themes/premium/images/gl.png\"/></button>",
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/gl.png"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="vieww(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"view\" id=\"view\" onClick=\"vieww(#=trans_no#,#=trans_type#); return false; \" " +
"style=' cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-book\"></i></span>",
//template:"<button class='editButtons' style='float:right'><a href='../view/view_task.php?trans_no=#=trans_no#' >#=trans_no#</a></button>",
// template: "#= kendo.toString(kendo.parseDate(start_date, 'yyyy-MM-dd'), 'yyyy-MM-dd')#",
// width: '50px' ,
width: "calc(1.9rem + 0.32em + 1px)",
// template: "#= (start_date == null)? '' : kendo.toString(kendo.parseDate(tran_date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #",
},
{
title: "A4",
// template:"<button id='qq' class='editButtons' style='float:right'><a target='popup' onclick=\"window.open('../../reporting/prn_redirect.php?PARAM_0=#=trans_no#&PARAM_1=#=trans_type#&PARAM_2=&PARAM_3=0&PARAM_4=&PARAM_5=&PARAM_6=&REP_ID=#=description#','popup','width=600,height=600'); return false;\" >print</a></button>",
//template:"<button id='qq' name=\"qq\" class='editButtons' style='float:right' onClick=\"printtA4(#=trans_no#,#=trans_type#); return false; \"><img src=\"../../themes/premium/images/print.png\"/></button>",
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/print2.png"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="printtA4(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"printdata\" id=\"printdata\" onClick=\"printtA4(#=trans_no#,#=trans_type#); return false; \" " +
"style='cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-print\"></i></span>",
width: "calc(1.9rem + 0.32em + 1px)",
// width: '50px'
},
{
title: "edit",
// template:'<button id="sendata" type="submit" name="editdata" class=\'editButtons\' style=\'float:right\' onClick="editt(#=trans_no#,#=trans_type#); return false; " ><img src="../../themes/premium/images/edit.gif"/></button>',
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/edit.gif"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="editt(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"printdata\" id=\"printdata\" onClick=\"editt(#=trans_no#,#=trans_type#); return false; \" " +
"style='cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-pencil-alt\"></i></span>",
width: "calc(1.9rem + 0.32em + 1px)",
//width: '50px'
},
{
title: "A5",
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\'float:right\' onClick="printt(#=trans_no#,#=trans_type#); return false; " ><img src="../../themes/premium/images/print.png"/></button>',
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/print2.png"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="printt(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"printdata\" id=\"printdata\" onClick=\"printt(#=trans_no#,#=trans_type#); return false; \" " +
"style='cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-print\" ></i></span>",
width: "calc(1.9rem + 0.32em + 1px)",
// width: '50px',
},
{
title: "PDF",
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\'float:right\' onClick="printt(#=trans_no#,#=trans_type#); return false; " ><img src="../../themes/premium/images/print.png"/></button>',
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/print2.png"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="printt(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"attachment\" id=\"attachment\" onClick=\"attachment(#=trans_no#); return false; \" " +
"style='cursor: pointer; font-size:20px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-file-pdf\" aria-hidden=\"true\"></i></span>",
width: "calc(1.9rem + 0.32em + 1px)",
// width: '50px',
},
{
hidden: !companyname,
title: "SMS",
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\'float:right\' onClick="printt(#=trans_no#,#=trans_type#); return false; " ><img src="../../themes/premium/images/print.png"/></button>',
// template:'<button id="printdata" type="submit" name="printdata" class=\'editButtons\' style=\' background-image: url("../../themes/premium/images/print2.png"); background-repeat: no-repeat;height: 15px;width: 5px; \' onClick="printt(#=trans_no#,#=trans_type#); return false; " ></button>',
template: "<span name=\"sms\" id=\"sms\" onClick=\"sms(#=trans_no#,#=trans_type#); return false; \" " +
"style='cursor: pointer; font-size:25px;color: darkslateblue; width: 20px; height:20px;'><i class=\"fas fa-comment\" ></i></span>",
width: "calc(1.9rem + 0.32em + 1px)",
// width: '50px',
},
{
hidden:!filtertype,
field: "supp_reference",
title: "supp_reference",
width: "calc(4.9rem + 0.32em + 1px)",
// width: '50px',
}
//attachment
],
});
var grid = $j("#grid").data("kendoGrid");
grid.bind("dataBound", grid_dataBound);
grid.dataSource.fetch();
});
//================
and my seerver side code
<?php
$page_security = 'SA_GLANALYTIC';
$path_to_root="../..";
include($path_to_root . "/includes/db_pager.inc");
include_once($path_to_root . "/includes/session.inc");
include_once($path_to_root . "/reporting/includes/reporting.inc");
include_once($path_to_root . "/includes/date_functions.inc");
include_once($path_to_root . "/includes/ui.inc");
$row = array("trans_type" => $_POST['ttye'],"trans_no" => $_POST['tno'],"name" => $_POST['namee']);
die(view_link_counterpartyy($row));
//echo $row['trans_type'];
function view_link_counterpartyy($row)
{
// print_r($row);
if($row['trans_type']==ST_SALESINVOICE)
return get_trans_view_str('CustomerInquiry', $row["trans_no"], htmlspecialchars_decode($row["name"]), false, '', '');
elseif($row['trans_type']==ST_SUPPINVOICE)
return get_trans_view_str('SupplierInquiry', $row["trans_no"], htmlspecialchars_decode($row["name"]), false, '', '');
else
return $row["name"];
// print_r($row["name"]);
}
//=============
?>
if you need anyother thing plz let me know.
Rank 1
i forgot to tell you that this function
function counter(a,b,c){} is the function from which i am geting data for my one column and this function is calling in the template
template:"<p id='grid-counter-#= trans_no#'>" +"#= counter(trans_no,trans_type,name)#"+"</p>",
like above..
the whole grid data is comming from another source but sometimes there is need to call data from ther sources based on som conditions thats why i call data from ajax for some of the columns..
Hi Iqra,
I have investigated the provided code snippets and I have noticed that the serverPaging option of the data source has been commented out. Could you try uncommenting it and see if that makes a difference? Also, I have noticed that the virtual scroll has been commented out.
Furthermore, I have noticed that there is a for loop in the read function of the data source, could you try temporarily removing it and see if that makes a difference? Can you remove the template option for the column and try loading the grid without any additional logic? I am asking in order to narrow down the functions/templates that might be causing the delay. After we find those, we could work on any optimizations.
Let me know about the performance of the grid after stripping out all additional functions and logic.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
thanku for your quick response sir.
first of all let me tell you that when i uncomment the serverpaging and virtual scroll it does not work with templates in my case because i am using templates in which data is comming from ajax request.
secondly when removing the templates and applying serverpaging and virtual scroll and removing loop it works fine.
but sir removing the templates and loop how do i get data for my grid specific column
if you understand me then plz help.
Hi Iqra,
In general, when the templates are used, it is not recommended to have loops or performing ajax requests. As an alternative, you could take a look at the foreign-key column. It will use key-value pairs for rendering the respective elements:
https://demos.telerik.com/kendo-ui/grid/foreignkeycolumn
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
these are javascript objects and in my case i need to access data from server side based on conditions how do i do this with js objects
if you can provide me a working example of it .plz use my given code if you do this.so that i can better understand
Rank 1
Hi Iqra,
Based on the provided information, I am not completely sure what is the returned value from the AJAX request sent in the counter JavaScript function. It is important to point out that there will be as many AJAX requests as the number of rows in the grid.
Since the request is sent based on the values of the current row, is there an issue if you add a new property to the model of the grid? This way, you will return the respective values with the very first request and it would eliminate the need for the making separate AJAX requests.
After eliminating the logic for manually substituting the HTML of the grid's cells, you could enable the column virtualization that will boost the performance as well:
https://demos.telerik.com/kendo-ui/grid/column-virtualization
By the way, if you ask the license holder at your company to assign you a commercial license, you will be able to post support tickets with a 24h response time.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
what do u mean by new property of the model of the grid will u plz give me a hint of code ..
as i have already told u that i have some conditions for some data which how could i directly get them in the datasource.
like this function view_link_counterpartyy($row)
{
// print_r($row);
if($row['trans_type']==ST_SALESINVOICE)
return get_trans_view_str('CustomerInquiry', $row["trans_no"], htmlspecialchars_decode($row["name"]), false, '', '');
elseif($row['trans_type']==ST_SUPPINVOICE)
return get_trans_view_str('SupplierInquiry', $row["trans_no"], htmlspecialchars_decode($row["name"]), false, '', '');
else
return $row["name"];
// print_r($row["name"]);
}
now tell me how do i get its value .without creating a separate ajax call
counter functions is returning me the string value.
Hi Iqra,
The new property that I refer to should come from the server-side. Since no server-side code has not been shared, I am not sure what is the exact approach that you utilize for returning the data. For instance, before returning the collection of items to the grid, loop through the items, and populate the new property.
Since you have the data already available on the server, based on the "trans_no", "trans_type", "name" properties. This way, you will retrieve all of the needed data on the server rather than performing a request for each and every row of the grid.
The whole idea is to have all of the values readily available without applying any additional logic on the client-side. In general, the client-side operations are slower than the ones on the server.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
Rank 1
Hi Iqra,
The property that I refer to is a new property that you should introduce in the model that is used for the grid's data source. This property has to be populated on the server-side based on "trans_no", "trans_type", "name" properties.
The dojo sample below simulates the server-side logic. At the client-side the value of the "counter" has to be already populated:
https://dojo.telerik.com/EFeHAJIJ
I hope this helps.
Regards,
Tsvetomir
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.