Working on the Datatables Code and I had specified the like this:
{className: "editable alignCenter", "targets":"_all"}
Basically all my columns are coming dynamically, so i want to target the editable only the column which are , i had a dataattribute where i can identify the field is primarykey or identity field.
So i want to modify that if that field is defined, leaving that field, all other fields should be editable and that field can be left out
trying like this
var editableTargets = $('#layout').attr('data-array'); - this is coming as a comma seperated list like 0,1,2,3,4,5
"columnDefs": [
{className: "editable alignCenter", "targets": [editableTargets]}
]
but it seems to be not working
#andrewjames Thanks for the quick tip, it is working,
Now i am trying to find the last array from the editableTargets and remove the class editable aligncenter and add a different class to it and add a sorting: false to it
just give me a start
Regarding your updated notes:
Now i am trying to find the last array from the editableTargets and remove the class editable aligncenter and add a different class to it and add a sorting: false to it
Again, I may have misunderstood, but... here are some pointers to help you:
Assume you have this:
var editableTargets = "0,1,2,3,4,5";
The following code will split this into two arrays - one containing only the final element, and the other containing everything else:
// convert to an array of numbers:
var array = editableTargets.split(",").map(Number);
// remove the last element, and capture it as "i":
var i = array.pop();
// create an array containing the last element:
var lastItem = [];
lastItem.push(i);
So, array is [0,1,2,3,4] and lastItem is [5].
There may be better ways to do this in JavaScript, but this should work.
Now you should be able to use these in your column defs section - something like this (but I have not tested this part!):
"columnDefs": [
{ className: "editable alignCenter", "targets": array },
{ sorting: false, "targets": lastItem }
]
Related
Here is the code I have so far:
var items = data.getRange(1,14,1,lc).getValues()[0];
var names = cdata.getRange(52, 1, 28,1).getValues()[0];
When I log 'items' I get the desired information populated in a single array.
When I try to get the 'names' in a column using a similar method I can only get the first cell in a single array or all of the desired cells in an array of arrays.
example of items
[item1,item2,item3,...]
example of names
[name1] or [[name1],[name2],[name3],[...]]
Why am I not able to use the same method to accurately retrieve the names in a column as I did in the row? How do I fix this and get the desired result? How do I get names to return the data in the cells as I did with items?
I see you have 1 column for names combined with []. That will return a [] result from a a structure like [ [][][] ] (not [ [] ]). If your items have multiple rows, you'll get the entire first row [,,,], as you suggest in items.
var items = data.getRange(1,14,1,lc).getValues()[0];
var names = cdata.getRange(52, 1, 28,1).getValues()[0];
That's more a diagnosis than an answer. Basically, you're getting what you should get from that, but I think you want it transposed. Various ways to do that.
But will this work?
// flatten(flatten()) works for 2-level nesting, and so on
function flatten(arrayOfArrays){
return [].concat.apply([], arrayOfArrays);
}
reference: https://gist.github.com/MauricioMoraes/225afcc9dd72acf1511f
You will have to use this instead:
var names = cdata.getRange(52, 1, 28,1).getValues().flat();
I am using the demo here: http://www.mdelrosso.com/sheepit/index.php?lng=en_GB&sec=demo3
But if you have two of the outer forms (addresses) and two each for the inner forms (numbers) and inspect the elements you'll notice the names of the inputs still have the #index# and/or #index_phone# strings in the index names.
If you try to submit the form then, the field data is lost (since only the latest copy of that name is kept). I've tried debugging the JavaScript so I can patch it, but I'm not seeing where it's wrong. It seems like the normalizeForms function isn't handling nesting correctly.
What can I do to correct the code so the indexes perform as expected? (That is: so that an input of two addresses (A and B), each with two phone numbers (A1, A2 and B1, B2) gives me a POSTed value like:
"people" : [
0 : {
"addresses" : "A",
"phones" [ 0 : "A1", 1: "A2" ]
},
1 : {
"addresses" : "B",
"phones" [ 0 : "B1", 1: "B2" ]
}
]
(Note: I'm not looking for that exact format; I can parse any output, I just need to get all of the data from the client to the server with meaningful indexes and without conflicts.)
There appear to be some fundamental logic issues with the index 'normalization' side of this plugin when it comes to the nested inputs.
Essentially there is is a nametemplate and an idtemplate which are the element names only with %index% or %index_phones% where the index should be, and then the name and id which should be these templates only with the %index% or %index_phones% replaced with the actual element input ids.
What happens during the 'normalization' process is that a function runs over these templates (once per element per form), and depending on the form, replaces either %index% or %index_phones% with the relevant index, depending on which form is being processed.
The problem arises when the inputs are nested, as the function first replaces (for instance) %index% with let's say 0. It then updates the resulting name or id with this value, say person_addresses_0_phones_%index_phones%_phone. When it hits the nested form, it then does the same again, only with %index_phones%. The result is now person_addresses_%index%_phones_0_phone because it is still using the unmodified template attribute, rather than the already half-modified name.
To fix this properly, the logic around this whole section of the plugin really needs rebuilding, but I have slapped together a quick patch which should serve as a temporary fix.
In the main plugin file, update the normalizeFieldsForForm function to be:
function normalizeFieldsForForm(form, index)
{
form.find(formFields).each(function(){
var that = $(this)
,idTemplateAttr = getOrSetTemplate(that,"id")
,nameTemplateAttr = getOrSetTemplate(that, "name")
,idAttr = that.attr("id")
,nameAttr = that.attr("name")
,formParents = that.parents('[idtemplate]')
/* Normalize field name attributes */
var newNameAttr = nameTemplateAttr.replace(options.indexFormat, index);
/* Normalize field id attributes */
var newIdAttr = idTemplateAttr.replace(options.indexFormat, index);
$.each(formParents,function(index,element){
$element = $(element);
if($element.data('indexFormat') != options.indexFormat){
/* Normalize field name attributes */
newNameAttr = newNameAttr.replace($element.data('indexFormat'), $element.data('formIndex'))
/* Normalize field id attributes */
newIdAttr = newIdAttr.replace($element.data('indexFormat'), $element.data('formIndex'))
}
});
form.find("label[for='"+idAttr+"']").each(function(){
$(this).attr("for", newIdAttr);
});
that.attr("id", newIdAttr);
that.attr("name", newNameAttr);
});
}
And then update the addForm function. Around line 385 in an unmodified plugin file, add the line
// Index format
newForm.data('indexFormat', options.indexFormat);
above the line
// Index
newForm.data('formIndex', getIndex());
This should serve as a fix until the plugin author gets around to fixing the logic issues. This is for plugin version 1.1.1
I got a table with a column called: "Etiquetas" , there i have multiple tag separated by comma (Ex:"Tag, Tag01, Tag02")
And i have a tag search, where i put all tags,and when you click it, this will be added to the actual search (using fnFilter), the values are passed like: '"Tag", "Tag01"' , but if i filter "Tag" , the filter shows me all rows with that word, instead of the one with the exact word. EX: Show rows with "Tag", and "tag", and "Tag01", etc.
I need help for make exact filter, and with multiples values.
I add a picture to explain this better (i'm bad at explaining things sorry)
Image with the actual problem
You can leverage find and filter for this. While this wont give you a ranked list, like for example items with most tags matched, it will show only items that have at least a matching tag.
This assumes the tags are given as an array, and that etiquettes is.a string of comma separated tags (it could also be an array, but from what I understood, you mentioned separated by comma, so I assume it's a string).
var items = [
{title: "1", etiquettes: "tag01"},
{title: "2", etiquettes: "tag,test"}
];
var tags = ["tag"];
var results = items.filter((item) => {
// splits the tags in the etiquettes, and tries to find at least a matching one. if so, find will return true to the filter function for the current item
return item.etiquettes.split(",").find((itemTag) => {
return tags.indexOf(itemTag) >= 0;
});
});
console.log(results);
I am grouping the slickgrid table, and I want to know the no.of rows after grouping.
I found this solution
grid.getData().getPagingInfo().totalRows
from this question.
But it is not working for the table after grouping.
It returns the total no.of rows of the data not the updated no.of rows after grouping.
Please help me to solve this
Not sure if I understand your question right, but to me it seems that you are confusing Slick objects here. The grid.getData() will return the complete datasource of your grid.
If you take a look at the official SlickGrid example-grouping demo, you will see a grid with grouped set of datas. You can try yourself by opening your favorite browsers Javascript debugger:
dataView.getGroups()
It will return you the corresponding Array of objects from the dataview that contains all groups informations like:
Array [ Object, Object, ... , another 15... ]
You can reach these objects thru specifying the given element key of the returned array:
dataView.getGroups()[0]
Return value of command:
Object {__group: true, level: 0, count: 1, value: 0, title:
"Duration: 0 1, groups: null, groupingKey: "0"}
Now we can see that it has a count property which contains the exact number of rows belong to that group.
So finally by issuing:
dataView.getGroups()[0].count
Will return you:
1
Or by issuing:
dataView.getGroups()[1].count
Will return you:
3
Where both returned count numbers equal with the record numbers you can see in the grid.
I know how to set column names by using:
var table = $('#'+String(response.chartID[i])).DataTable({
stateSave: true,
aoColumnDefs: aryJSONColTable,
processing: true,
serverSide: true,
bDestroy: true,
"scrollX": true,}))
But is it possible to set oaColumnDef inside DataTable object?
For example on specific callbacks, I can set oaColumnDef to another set of names.
The closest I had is inside any callback, I've tried
$(this).dataTable().fnSettings().aoColumns
to get column as objects
But is it possible to set it again?
I've also tried
$(this).dataTable().aoColumnDefs = AnotherArray
However, it seems that this doesn't work.
Can anyone point me to the right direction?
Thanks
Assuming the variable table declared above
if you want to update particular column
table.fnUpdate("newChangedValue", row-index , column-index);
if you want to update complete row
oTable.fnUpdate( ['column1Value', 'column2Value', 'column3Value', ... ], rowIndex );
to add new record
table.fnAddData( [ column1Value, column2Value, column3Value.... ]);
to get clicked row index
$("#tblchargeRate tbody").delegate("tr", "click", function() {
var iPos = table.fnGetPosition( this );
});
var aData = table.fnGetData( iPos );
aData[0] is first column element in datatable
Note: take care of index value i.e first row in data table will be at 0 index
You can updating your datatables, by the code you posted you are using a old version.
In the new version you have a column function to get the columns by selectors.
Check the API doc