Replies
I was about to figure this out. But i have another question attached to this.
private displayQueueGrid(): void {
console.log("inside the grid");
console.log("before the grid" + this.inputData)
this.id = 'queuegrid'
this.gridOptions = {
autoCommit: false,
dataSource: this.inputData,
primaryKey: 'id',
dataSourceType: "json",
width: "1000px",
height: "400px",
autoGenerateColumns: false,
columns: [
{ key: "t", headerText: "Title", width: "250px", dataType: "string" },
{ key: "s", headerText: "Status", width: "100px", dataType: "string" },
{ key: "y", headerText: "Type", width: "100px", dataType: "string" },
{ key: "d", headerText: "Submitted Date", width: "250px", dataType: "string" },
{ key: "e", headerText: "Expires In", width: "80px", dataType: "string" },
{ key: "id", headerText: "ItemID", dataType: "number", hidden: true },
{ key: "m", headerText: "Error", dataType: "string", hidden: true }
],
features: [{
name: "RowSelectors",
enableCheckBoxes: true,
enableRowNumbering: false},
{
name: "Selection",
mode: 'row',
multipleSelection: true,
persist: true,
activation: true,
rowSelectionChanged: function (e, ui) {
//let rowcount = ui.selectedRows.length;
let itemtodelete = [];
for (let i in ui.selectedRows) {
itemtodelete.push(ui.selectedRows[i].id); ///this is how i extracted the value in a array inside the loop.
}
return itemtodelete; /////value i need out of this function so that i can use this value outside of the iggrid
}
},
]
};
this.showGrid = true;
return this.itemtodelete;
}
My question i have this function activated in a component but it looks like i cannot access this value of array outside of the iggrid. So to suffice what i am trying to do,
I have a grid with checkboxes and has a hiddenvalue as id set to primary key. When i am in that loop i am able to capture all the id's that have been checked. I want to send this value to another component. Please let me know how i can achieve this.
Shashank
The example you are sending me back is returning an object that has been selected. If you look at my previous post i want to extract a value from a column that is hidden. To make it clear im attaching the example :
columns: [
{ key: "t", headerText: "Title", width: "250px", dataType: "string" },
{ key: "s", headerText: "Status", width: "100px", dataType: "string" },
{ key: "y", headerText: "Type", width: "100px", dataType: "string" },
{ key: "d", headerText: "Submitted Date", width: "250px", dataType: "string" },
{ key: "e", headerText: "Expires In", width: "80px", dataType: "string" },
{ primaryKey: "id", key: "id", headerText: "ItemID", dataType: "string", hidden: true }, <= Hidden value need to extraced.
{ key: "m", headerText: "Error", dataType: "string", hidden: true }
],
with ui.selectedRows i do not get that value. and if i do a ui.selectedRows.id it gives me the iggrid id not the id within the grid. I have set my id as a primary key and even though it doesnt set that as a primary key.
Please let me know.
I tried to a select all for the check box and all i get its a single item from the grid. Would great if you could send me a sample so that i can follow this.
result.:
ui.owner.element.igGrid("findRecordByKey", ui.row.id);
Objectd: "11/28/16 12:14 PM EST"e: "0 days"id: "7462"ig_pk: 3332532973m: "An unexpected error has occurred. Your error reference number is F39BE60E:E1-C7462."s: "Completed"t: "2 spins"y: "Report"__proto__: Object
the object returned after the check box click is o
- Object
- owner:t.(anonymous function).(anonymous function)
- row:Object
- selectedRows:Array[0]
- __proto__:Object
I think you misunderstood what i was asking. Let me illustrate with my code.
private displayQueueGrid(data) {
this.id= 'queuegrid'
this.gridOptions = {
autoCommit:true,
dataSource: data,
dataSourceType:"json",
width:"1000px",
height:"400px",
autoGenerateColumns:false,
columns:[
{ key: "t", headerText: "Title", width:"250px", dataType:"string" },
{ key: "s", headerText: "Status", width:"100px", dataType:"string" },
{ key: "y", headerText: "Type", width:"100px", dataType:"string" },
{ key: "d", headerText: "Submitted Date", width:"250px", dataType:"string" },
{ key: "e", headerText: "Expires In", width: "80px", dataType: "string" },
{ key: "id", headerText: "ItemID", dataType: "string", hidden: true },
{ key: "m", headerText: "Error", dataType: "string", hidden: true }
],
features: [{
name: "RowSelectors",
enableCheckBoxes: true,
enableRowNumbering: false,
checkBoxStateChanging: function (evt, ui) {
//we use this variable as a flag whether the selection is coming from a checkbox
this.isFiredFromCheckbox = true;
alert('checkBoxStateChanged fired' + this.isFiredFromCheckbox );
},
checkBoxStateChanged: function (evt, ui) {
console.log(evt, ui);
alert('checkBoxStateChanged fired' + evt + ui);
}
},
{
name: "Selection",
mode: 'row',
multipleSelection: true,
persist: true,
activation: true,
rowSelectionChanging: function (evt, ui) {
if (this.isFiredFromCheckbox) {
alert('Event fired from checkbox');
console.log('this is the rowselect'+ evt, ui);
this.isFiredFromCheckbox = false;
}
else {
return false;
}
}
},
]
};
this.showGrid = true;
}
This is the iggrid funtion i have in place. As you see i have hidden 2 columns, namely id and m keys.
So when the grid is rendered and a use clicks on one of the checkboxes which i have enabled in the grid i need to capture the id and error message even though it is hidden.
similarly when a users clicks on the checkbox on multiple rows i want to get a list of all the id's and error.
I am using Angular 2 with typescript with ignite UI to do this.It would be helpful if you can answer the question on typescript.
Please let me know if this was clear.