I have written the function for row selection.It is not highlighting the selected row(sometimes highlighting sometimes other row highlighted) and not displaying the icons the way I have written it. following is the code
multiselect : true,
iconSet: "fontAwesome",
datatype : "json",
loadonce : true,
rowNum : 10,
rowList : [ 10, 20, 30 ],
toppager:true,
pager : '#prowed1',
sortname : 'id',
viewrecords : true,
sortorder : "asc",
editurl : "editGrid.html",
onSelectRow : function(rowId) {
var rowId = jQuery("#list1").jqGrid('getGridParam',
'selarrrow');
if (rowId.length > 1) {
$("#list1_iledit").addClass('ui-state-disabled');
}
},
$("#list1").jqGrid(
"navGrid",
"#prowed1",
{
cloneToTop:true,
formatter : "checkboxFontAwesome4",
addicon:"fa fa-plus ",
add : true,
delicon:"fa fa-trash",
del : true,
searchicon:"fa fa-search",
search : true,
refreshicon:"fa fa-refresh",
refresh : true,
editicon:"fa fa-edit ",
edit : true,
saveicon : 'fa fa-floppy-o',
save : true,
},`{ // edit options
afterSubmit : function() {
location.reload(true);
},
beforeShowForm : function(form) {
$("td .navButton navButton-ltr").hide();
},
closeAfterEdit : true
},
{ // add options
beforeShowForm : function(form) {
$("#buName").removeAttr("readonly");
},
closeAfterAdd : true,
clearAfterAdd : true
},
{ // del options
serializeDelData : function(postdata) {
return {
'buName' : $('#list1').jqGrid('getCell',
postdata.id, 'buName'),
'oper' : 'del'
}
}
}
);` $("#list1").jqGrid('inlineNav', "#prowed1", {
//cloneToTop:true,
//iconSet: "fontAwesome",
add : false,
edit : true,
editicon : 'fa fa-pencil-square-o',
save : true,
saveicon : 'fa fa-floppy-o',
editParams : {
aftersavefunc : function(id) {
jQuery('#list1').jqGrid('setSelection', id, false);
},
},
});`
You should provide the demo, which reproduce the problem. The reason of the most problems with highlighted: wrong input data or wrong colModel. Every row of jqGrid have always id attribute (rowid), which should be part of input data: see here. The id value must be unique. If you have id duplicates then you could problems with selection/highlighting of rows.
If you fill the data from the database than you can use native ids from the tables of the database to build unique rowids. Database tables don't allow id duplicates too.
To be able to edit the data in the database you will need to identify the edited data. Such unique value could be used as the rowid. If you fill the grid by JOIN from multiple tables, than composed id could be used. For example, if you fill the the grid with the data from two tables User and Location then the paar (user_id, location_id) are unique. If both user_id and location_id are numbers, then you can use user_id + "_" + location_id as rowid. The value will be sent to the server during editing and you will have full information to find the data in the tables, which need be modified.
I think that you have problems with unique id in the data. Check that the ids used when you insert data in the grid are unique and you do not have duplicate one.
Kind Regards
In your ColModel make sure the property key:true is only specified once and represents a unique row ID value. See http://www.trirand.com/jqgridwiki/doku.php?id=wiki:colmodel_options
Dumb on my part, but I had the property beforeSelectRow set in the grid code that I had copied from another project. This of course was blocking any selection of a grid row.
beforeSelectRow: function (rowid, e) {
return false;
},
Related
I have a Json Tree for Teachers database
{ "Teachers":
{
"Teacher_id" : {
"email" : "teacher1#something.com",
"name" : "teacher1",
"Subjects" : {0 : "Maths",
1 : "science"
},
"Subject_Exp-in-years" :{ 0:"Maths_2",
1:"Science_4"
}
},
"Teacher_id" : {
"email" : "teacher2#something.com",
"name" : "teacher2",
"Subjects" : {0 : "Geography",
1 : "science"
},
"Subject_Exp-in-years" :{ "Geography_5",
"Science_1"
}
}
}
How can I get Set of Teachers who teach Science
I have used the query
var db_ref=firebase.database().ref();
db_ref.child("Teachers").orderByChild("Subjects").equalTo("Science")
How can I check if a value is present in an array in the database by querying functions?
When using .orderByChild("Subjects").equalTo("Science") doesn't work because none of the Subjects node children is equal to Science. So in order to solve this, I recomand you to change a little bit your database structure like this:
{ "Teachers":
{
"Teacher_id" : {
"email" : "teacher1#something.com",
"name" : "teacher1",
"Subjects" : {Maths: true,
science: true
},
As you can see i have changed the childrens of Subjects with: Maths: true and science: true. To check if a value is present under a node, just use exists() function on that node.
Hope it helps.
You can use for loop to read each of the element in an array.
When you read them one by one, you can include if else statement to check whether the value that you want existed or not. Let,s say the value is JOHN.
var index;
var arraylist = ["a", "b", "c"];
for (index = 0; index < arraylist.length; ++index) {
if(arraylist[index] = "JOHN") {
console.log(arraylist[index] + "is in the array");
};
}
I want to show dynamic drop down options for each row of ag-grid.
Suppose for each row, department might be different and based on that I plan to filter list of subjects (available option for users to select in dropdown)
Here is my code:
this.gridOptions.columnDefs = {
headerName: 'Department',
field: 'financingCurrency',
editable: false,
suppressSorting: false,
cellClass: 'grid-align'
},
{
headerName: 'Subject',
field: 'subject',
editable: true,
cellEditor: 'select',
filter: 'text',
cellEditorParams: {
values: this.subjects;
},
suppressSorting: false,
cellClass: 'grid-align'
}
}
I am using free version of ag-grid with Angular 2.
Does someone have any idea about it?
If I understand correctly, you want to be able to have different values in the cellEditor based on which department is selected. If that is correct, then you will likely need to do something more complicated dealing with cellEditors. Here is a plnkr that I made that checks if the name starts with a J, if so then it allows a third option.
Please refer to the plnkr for full example, as well as the docs to make sure that you get everything imported/exported in the right places. Here is what is the key importance for you beyond what is on the docs:
agInit(params: any): void {
if (params.node.data.financingCurrency == 'Your Super Department') {
subjects = [...super options...]
} else {
subjects = [...different options...]
}
}
agInit gets called any time editing is started. params has a complicated object, (I suggest console.log()ing it just to see everything that is available to you) but basically the node is referring to the row that the cell is on, and the data is the data for that row, and judging by your colDefs you can get the value of the Department from financingCurrency.
try something similar :
{
headerName: ' MEDICINE NAME ',
field: 'medicine',
cellEditor: 'autoComplete',
cellEditorParams:params => {
return {
'propertyRendered' : 'name',
'rowData': this.medicineList,
'columnDefs' : [{headerName: 'Medicine', field:'name'}]
}
}
},
new to DOJO..using JsonRest to get data from database...i have given range to display 0-1000 out of 50000 ...but it is displaying full data......requirement is that when that 1000 loaded while scrolling the next request goes to server and rest of the data will display....
please help i tried a lot ......
my code
myStore = dojo.store.Cache(dojo.store.JsonRest({
target : "myip7080/GridExample/string"
}), dojo.store.Memory());
myStore.query({
start: 0,
count: 1000
}).then(function(results){
alert(results);
});
grid = new dojox.grid.DataGrid({
store : dataStore = dojo.data.ObjectStore({
objectStore : myStore
}),
structure : [ {
name : "SNO",
field : "sno",
width : "100px",
editable : true
}, {
name : "SNAME",
field : "sname",
width : "100px",
editable : true
}, {
name : "SALARY",
field : "salary",
width : "200px",
editable : true
} ]
}, "target-node-id"); // make sure you have a target HTML element with this id
grid.startup();
dojo.query("#save").onclick(function() {
dataStore.save();
});
});
dojo/store/Memory::query() takes two parameters:
An object that queries the data
An QueryOptions object containing the options for this query (optional)
You can query specific entries from your data like this:
myStore.query(
{ name: "John Doe" }
);
//returns all rows with name="John Doe"
You don't have to make a specific query. If you want all your data, just do myStore.query("");
If you want to limit the number of rows shown, you need to add a second parameter to represent your query options:
myStore.query(
{ name: "John Doe" },
{ start: 0, count: 1000 } //return 1000 results, starting at the beginning
);
See the documentation for dojo/store/memory::query().
I am using addRowData method to populate my grid. But my current JSON data have another object inside of each object in the JSON data. To make it view in the grid, i followed the notations in the documentation of jQgrid. But that column remain empty.
My Grid definition:
$("#ExpenseTable").jqGrid({
datatype : "local",
mtype : 'GET',
colNames : [ 'Entry ID','User Name', 'Category Name','Date','Amount','Status'],
colModel : [
{name:'expnsId',label:'ID', width:150 ,editable: false},
{name:'userName',label:'NAME', width:150 ,editable: false},
{name:'category.catName',label:'CATEGORY', width:150 ,editable: false},
{name:'date',label:'DATE', width:150 ,editable: false},
{name:'amount',label:'AMOUNT', width:150 ,editable: false},
{name:'status',label:'STATUS', width:150 ,editable: false},
],
pager : '#ExpPager',
rowNum : 10,
rowList : [ 10, 20, 30 ],
sortname : 'invid',
sortorder : 'desc',
viewrecords : true,
autowidth : false,
caption : 'Expenses Details',
onSelectRow : function(expnsId) { dispExpensData(expnsId); }
});
Code used to populate the Grid:
ExpenseDetailsManagement.getexpenseList(function(expRecords){
//for(count = 0; count<expRecords.length; count++){
// expRecords[count].catId = expRecords[count].category.catId;
// expRecords[count].catName = expRecords[count].category.catName;
//}//I am using this for loop to convert the category object
$("#ExpenseTable").clearGridData(true);
$("#ExpenseTable").jqGrid('addRowData', "expnsId", expRecords);
});
The data returned from the server looks like:
Any idea or suggestions about where i am going wrong!!!
If the values from the 'expnsId' column are unique, I'll recommend you to use key:true parameter as a option of 'expnsId' coulmn. Then the value of the column will be used as the row id.
To be able to help you with the dotted column names you should post the JSON data and not the screenshort with "Object" text on the place of the most important information. Probably your main problem can be easy solved with respect of localReader instead of dotted name.
One more small remark. Beause you use label option for all columns you can remove colNames array which will be not used. The option editable: false is default, so you can remove it also. The parameter mtype you can also remove because it will not used for local data.
UPDATED: Sorry the value of the first parameter of addRowData should be do the name of the column with the data like you as do. So I deleted the first paragraph from the first version of my answer.
var remoteLookupJsonStore = new Ext.data.JsonStore({
root : 'records',
baseParams : {
column : 'fullName'
},
fields : [
{
name : 'name',
mapping : 'fullName'
},
{
name : 'id',
mapping : 'id'
}
],
proxy : new Ext.data.ScriptTagProxy({
url : 'LookupLoader.ashx'
//url: 'http://tdg-i.com/dataQuery.php' similar data
})
});
var combo2 = {
xtype : 'combo',
fieldLabel : 'Search by name',
forceSelection : true,
displayField : 'name',
valueField : 'id',
hiddenName : 'customerId',
loadingText : 'Querying....',
minChars : 1,
triggerAction : 'name',
store : remoteLookupJsonStore
};
This sample works with the original data store 'http://tdg-i.com/dataQuery.php'. My ashx handler returns data in the same format, but the data is different. Anyhow, when I use my ashx handler, the handler gets invoked, it returns data, but combo always stays in the loading state, and never displays the data.
I am assuming that the problem is with the data I am returning, but its format is fine,the last thing I changed was setting the Content Type
context.Response.ContentType = "application/json";
but I still cannot get this thing to work, any suggestions?
this is data coming from my handler.
({"totalCount": "4","records":[{"id":1,"fullName": "aaa bbb"},{"id":2,"fullName":"cc dd"},{"id":3,"fullName":"ee ff"},{"id":4,"fullName":"gg hh"}]});
Your first record (id 1) is missing "fullName" which makes it invalid JSON -- not sure if that's just an error typing it here or not.
proxy : new Ext.data.ScriptTagProxy({
url : 'LookupLoader.ashx'
//url: 'http://tdg-i.com/dataQuery.php' similar data
})
well looks like for querying same domain, I should be using HttpProxy
so there you have it, that is why it was working with the sample data provided by the web site but not with my local version.