- This is an interesting one, and I suspect a bit of an edge case in the
browsers - what is happening is that the window is going from having a
scrollbar to not having a scrollbar when the scrolling viewport is
collapsed. This causes the browser to show the scrollbars in the
viewport for an instant, even although they aren't actually required.
If the height of the viewport is 53px and you up it to 80 so there are
no scrollbars and reduce it back to 53 the scrollbars are gone! The
browser must be stopping a race condition once the scrollbars are
shown.
- The fix is to use `max-height` for the scrolling container if the
scroll collapse is set and `height` otherwise. The browser native
methods makes the code _much_ easier to work with, more performant and
easier to understand.
column width for these tables. However, that was in error - it is in
fact required still as the smart width calculations cause the browser to
crash (APPCRASH). There is no indication as to why this is, not is it as
simple as just disabling one or two pieces of code to stop the crash.
This leads me to suspect that it is the number of operations being
performed - particularly to do with the cloning of the elements. If this
is the case, then its just never going to work. Also IE6/7 are such a
small market now (thank goodness) this is just a feature that won't be
available in those browsers.
If anyone is interested in working on fixing it, or paying me to do so,
I'm happy to hear from you :-)
Fix: The auto width calculation table, when scrolling is enabled, being inserted into the scrolling container could cause the viewport to scroll, even when the main table doesn't actually need scrolling. This causes the column width calculations to be incorrect by the scrollbar's width. The fix is to have the calculation table `position:absolute` in the scrolling container and height:1px so it has no effect on the vewport's scrolling.
- These two fixes address DataTables/DataTables #612. Kudos to @Delgan
for reporting these issues and supplying test cases - thanks!
Fix: Table could overscroll if `dt-init data` is used to populate the table
This is a fairly significant change to how DataTables operates for the
scrolling width calculations and primarily is due to a simplification
with the use of `clientWidth` to get the scrolling container width.
Rather than getting the offsetWidth and then removing the scrollbar
width if required the `clientWidth` will give us the value directly.
With the scrollbar width already accounted for the scrolling draw code
can be updated to not need to account for it itself.
Finally, when using the `data` property to add data to the table we need
to recalculate the column widths after the first draw, just like with
Ajax loaded data, otherwise the data added won't be taken into account
and we can get an error in the scrolling.
when body's position is changed (left: 375px) _fnBrowserDetect incorrecly calculates offsets. thus header is a bit misaligned. commit changes test object's position to fixed. in this case it's position will
be relative to the viewport not to the body.
When the table was being destroyed and the remove parameter was passed
in as `true` to remove the table from the DOM there was potential for
bound events to not be unbound from the table elements. This was caused
by the use of the `detach` jQuery method which will not remove events.
Furthermore, rows would not be added to the table before this method (or
`remove()`) was called. As such we need to reorder the code slightly -
attach the rows back into the DOM and then remove them (or detach if the
table is left in the DOM) - otherwise rows which were hidden by paging
would not have their events unbound.
Many thanks for KnowledgeNet ( http://kn-it.com/ ) for their support in
finding and allowing this bug to be addressed!
Being able to get and keep a reference to each row is quite important.
You can't use the DataTables row index for this as it can potentially
change, but we can use IDs, based on a unique value for each row in the
data - `dt-init rowId`.
I've made the decision to not require escaping of data in the ID. This
means that selectors can be ID selectors with a cobontation of other
things (#div.class for example) as that really doesn't make much sense
in this contact - you only have rows that you can select from. Not
requiring escaping makes both the client and library code much easier.
This is documented.
The implemention is to store a reference to each row's data object based
on its id allowing for a trivial lookup. The object has its own index
in the `aoData` array, so there is no `indexOf` required. The only
downside is that the index must be updated when a row is deleted. This
is done with a trivial for loop.
* Issue was that an `error` event was being triggered before the
settings object had been configured. There is no option to trigger an
error event in this case.
* Fixes DataTables/DataTables #572
On line 605, column.sTitle is set to the TH's innerHTML.
On line 1816, column.sTitle is compared with cell.html().
If you have child elements with event handlers on them inside the TH, these are not the same in IE8 (see https://gist.github.com/simonbrent/933e552739477f4be3ab#file-test-html)
As a result, the check on 1816 fails, the contents of the cell is replaced, and the event handlers are removed.
Comparing instead with cell[0].innerHTML fixes this issue.
The main change here is to modify `_selector_run` to loop over the
extension functions (if there are any). This involves passing extra
information to the function (selector type so the correct extension can
be used, settings object and selector modifier to pass on to the
extension method).
The _selector_opts function has also been updated to give the ability to
use unknown properteries through a $.extend, rather than writing a three
property object.
Fix: Ellipsis elements didn't have padding which could be jarring when shifting between paging that does and doesn't show ellipsis
This fixes DataTables/DataTables #26
Fix: Scrollbar width was being calculated everytime requested on machines with zero width scrollbars
The scrollbar width calculation method has been rewritten to use a
single element with use of `offsetWidth` and `clientWidth` to calculate
the scrollbar width. This works all the way back to IE6.
_fnAjaxDataSrc will in turn call _fnGetObjectDataFn, which
can be specified by the dataSrc method.
This way the dataSrc can set the recordsTotal parameter on
the json data and the changes will be read into the
recordsTotal/recordsFiltered variables.
* This is actually compatible with 1.10.0+ but was never documented (it
wasn't an intended feature, but rather an implementation detail. It
is rather useful though, so is now documented.
* `alert` - Alert the error
* `throw` - Throw an error
* `none` - Do nothing
* A function that is called
New: `dt-event error` event that is triggered when an error occurs (regardless of the value of `$.fn.dataTable.ext.errMode`
Previously the whole row was invalidated as a quick workaround for what
I would would be a complex task, but the solution is actually relatively
simple and small in code size, reusing much of the current invalidation
code. The cache data for the whole row is still removed, but the
important part of minimising the DOM interaction is in place.
Fix: Incorrect returns from sub-methods if a selector does not contain any results (DataTables/DataTables #431)
Update: `dt-api iterator()` has a fourth parameter to indicate that a return value is expected
The basic issue here was the `iterator()`'s automatic check to see if a
new API instance should be returned or not. If there are no results from
a selector the iterator will just use the original API instance to
return, but this isn't correct as we expect an empty result set in this
case. This is partly due to the fact that the top level methods (`row()`
for example) will return 2D arrays, while the child methods will flatten
the results, this is parhaps an error in the API, but too late to fix
now.
To address this, `iterator()` now has a parameter to tell it if a new
instance should be used or not. I debated about a new method
`iteratorNew()`, but I think this is just as clear (which isn't very
clear unfortunatly, but just needs to be made clear in the
documentation, which I've updated for this change).
I've added tests for the selectors with `deferRender` enabled. The test
suite is still in desperate need of update...
This is something that has been in DataTables since the version first
vresion and was contentious at that point so while this is a minor code
change, for me it is quite a big change! I feel that this is the correct
operation now, although it does result in rows being moved around where
they might not be needed to if partial pages could be used.
Improved last page calculation when page size is changed on last page.
e.g. Suppose there are total 12 records and page size is set to 5 records/page. Go to last page, which should be 3, change page size to 10. Page#2 should be selected and it should show 2 records on it.
* This reverts the last commit which documented the old behaviour.
Thinking again about it, if you want to modify the rendered data use
`$(cell).html()`.
* When `dt-init columns.data` / `dt-init columns.render` resolve to a
function, that function is executed. Previously this execution was in
the global scope, but in order to be able to use an instance as a data
source for the row (something I wanted as part of 1.10) we need to
execute the function with the instance's scope. A simple `call()` does
this.
* I could add a check to see if the `rowData` is a plain object or not,
but that would add significant overhead to the processing, and this
particular part of the code needs to be very fast. Additionally, I
think it is unlikely that any one was dependant on this being executed
in global scope, so the change is made.
* This fixes DataTables/DataTables #368.
* 1.10.0 had issues when searching for boolean data as the search
extension methods were checking for empty data, but if found they were
using `''` as the term to filter. It should more accurately just use
the given data.
* Relates, the `_empty()` method was considering `false` to be empty,
but not `true`. Both are now considered to be empty.
* `dt-api state()` - get the last saved state
* `dt-api state.loaded()` - get the state that was loaded when the table
was created
* `dt-api state.save()` - trigger a state save
* `dt-api state.clear()` - clear the saved state
* Fix is to convert from hungarian notation to camelCase in a loop for
the array
New: State staving object structure is now full documentated
* The structure has been altered to be camelCase notation like the rest
of the 1.10 API. State loaded from older versions of DataTables will
be silently ignored
* The native `forEach` is suprisingly slow. I had assumed that it would
be faster that a for loop, but it appears that due to the function
execution it is actually much slower. A simple for loop is much better
for performance and we loose nothing since hte API instance is array
like.
* This fixes DataTables/DataTables #364
* It appears that if you have a reference to a DOM node, but that DOM
node is overwritten by use of innerHTML, the reference is destroyed
and you cannot use the referenced DOM node any more.
* This became apparent from using Editor's inline editing mode, where in
IE the inline edit would work only once. No other browser has this
issue but it is in IE7-DC1.
* The workaround is to remove the child nodes first. not ideal at all,
but it does work.
* Searching the internet I didn't find much about this so I've opened an
issue on the IE connect site:
https://connect.microsoft.com/IE/content/content.aspx?ContentID=29582
* DataTables uses custom jQuery events which propagate up through the
DOM, with the custom event being triggered on the table node. Ideally
I'd like to change the event handling to use $().triggerHandler() to
avoid this issue, but as discussed in issue #245 that would mean that
delegated events wouldn't work. Perhaps there should be two forms of
events triggered by DataTables, those which do bubble and those which
do not. `init` is the only one which would _have_ to bubble.
* The workaround for the moment is to check that the settings object in
context of the executed settings handler is the same as the one that
was used in the addition of the event handler.
* This fixes DataTables/DataTables #361
* In particular this fixes the FixedColumns + ColReorder example which
was showing the problem by expanding the columns to the full container
width for each column. See thread 20848 for information.
* V8 strips unknown characters not only at the start of a string given
to Date.parse() but also at the end. So `10%` (for example) was being
detected as a date type.
* This fixes DataTables/DataTables #354
* This is likely to be of more interest to plug-in authors rather than
for general DataTables usage, but I've found myself wanting it a
couple of times recently for plug-ins.
New: `dt-api row().child.remove()` and `dt-api row().child().remove()` methods to provide the ability to remove and destroy child rows
Fix docs: Note that the row().child() method's return value can have an effect on the chaining
* This fixed DataTables/DataTables issue #326.
* Special thanks to `Scottmitch1` (on github) for help with this one!
Dev: Modify the initialisation of _Api - the old method of using `=`
twice on a row caused Chrome's debugger to show it as both names
concatinated which was confusing.
Fix: Remove API "build" code. That was part of the API prototype and the
design moved away from that approach. The code was redundant and unused.
* Originally this was done because it makes removing items a little bit
easier with Array.splice(), however, it doesn't make any sense to go
through the rows in reverse if there might be an interdependency
between the rows.
* It has never been documented what order the rows are filtered in, so I
think this is a safe change to make.
* I've also added the row display index to the parameters passed in
* This fix was partly committed earlier by mistake [b7feaa2]
* The fix is simply to store the draw hold state and make use of it in
the draw scroll callback.
* In IE8 if the DataTables width calculation functions were being
triggered DataTables would clone the table node and then do a jQuery
$().remove() on the cloned node. This was bad in IE8 as it meant that
on the remove the events that were attached tot he original table were
removed as well as the ones on the clone table. IE8 must retain some
kind of link between the original and clone nodes. Using jQuery's
clone() method resolves this.
* See thread 21040 for more information
* Previously the filter builder was created as a string, so we had to
escape quotes, otherwise it could create invalid HTML. That is no
longer the case as we are using jQuery DOM manipulation, so the escape
is redundant and potentially harmful
* See thread 21197
* Due to the manipulation of DOM elements rather than strings for the
length list, the browser was cropping elements which were being cut
short. Fix is to switch back to string manipulation, which can be done
easily using the outerHTML property of the DOM element. This is
supported in all browsers since Firefox 11, so happy to use it here.
* See thread 21170 for more information
* The two data handling functions for each column are now given a forth
parameter if you are using them as a function. This new parameter
gives index position information about the cell in question, as well
as access to the settings object.
* This additional information allows abstraction functions to be created
external to DataTables that can be reused for different columns, with
those abstraction functions now having access to the information about
the cell they are operating on. For example, you might have a number
formatting function which can be reused, and it will determine what
data to read based on the column index given.
* This additional information is required in order to be able to fully
replace fnRender which was removed in DataTables 1.10.
* This fixes DataTables/DataTables #321
* Documentation updated, including an error fix for columns.data
* The error was that the registered cells array was growing on every
call, so the processing took longer and the memory usage went up
* See thread 21063 for details
* The sort handler was expecting to deal with a 2D array, so we always
dropped into the single column first sort condition.
* See thread 20811 for more information.
- The stateDuration option has been updated to provide the ability to
indicate if sessionStorage should be used rather than localStorage
(set value to -1).
- Settings stateDuration to 0 also indicates that the duration is
infinity.
- Parts of the state saving have been optimised for code size, so this
commit actually reduces the min size by 32 bytes despite the new
abilities.
- See thread 19572 for discussion on this
- The column index selector was broken by a previous commit (d9f416232).
- Fix also an error in the column selector whereby a result was being
tested against itself
- If you provided your own <select> list for the lenght language option,
DataTables would still append its own and ignore your custom one
- See thread 20548
- Feedback from James Craig on improving the accessiblity of DataTables.
Since the `role=grid` option is added to the DataTables table, we
should also add `role=row` to the rows in the table so the browsers
can see them correctly. As James notes, it is debatable if this is
needed or not but it is required in current Chrome and Webkit.
- Webkit do now allow roles to be optional in the nighties - see:
https://bugs.webkit.org/show_bug.cgi?id=131819 . Once Apple deploy
this in a Safari update, and Chrome also deploy support, I think this
should be removed from DataTables core, since it will no longer be
needed in the latest browsers, and manipulating the DOM can hit
performance a bit.
- It is useful to be able to filter row indexes by a condition and then
operate on the resulting array of indexes, but before the selector
would only itterate over real arrays. So if you passed is an API
instance with the result set being the indexes to delete, it wouldn't
work!
- Fix is to loop over anything which has a `length` property
- Thread 20572
- Remove the aria-relevant from the info text to use the default,
otherwise it was reading information that isn't very useful
- Change info text role to `status`
- Remove `role=row` from header - this is experimental and might change.
Might need it on this row and all rows in the table
- Based on feedback from James Craig (thanks!)
- If you were to click the 'previous' button when on the first page, the
table would redraw - that's the easiest manifestation of this bug to
see. There is no need to redraw the table when the paging hasn't
changed, so don't.
- This fixes DataTables/DataTables #304
- Because DataTables is destroying and creating elements for the paging
control, focus is lost when navigating via keyboard. This is a real
pain when trying to operate DataTables that way! Fix is to refocus on
the new element.
- If you used client-side processing ajax, the parameter passed into
_fnBuildAjax is an array, needed for the old 1.9 compatiblity, but the
ajax wasn't transforming this into a data object and then sending it
to the server. The fix is to check if the data passed in is an array
or not - if so, transform it to an object
- If you use multiple column definations such that a columns' sorting
options are initially disabled and then enabled, the sorting classes
for the header were not being applied correctly.
- The fix is to always assign classes based on the most up-to-date
information for the column.
- This fixes DataTables/DataTables #303
- The resolution of unknown sorting types was being done after the
sorting structure array of objects was being calculated. As such, a
string sort was always being done in the first instance!
- This fixes thread 20433
- In a fenced code block, need to encode the HTML elements. However, the
HTML was being detected and saved first. Run the fencer first.
- Type links updated
- When invalidating a DOM row, DataTables wasn't taking into account the
fact that the columns in the row might be hidden. This means that the
array of data read is shortened by the number of hidden columns, and
thus the data is corrupted.
- Fix is to read from the known cells if the row already exists
- Issue here was that when doing the camelCase to hungarian conversion
on objects, the user object was copying over the hungarian default.
This meant that parameters were lost and things broke! The fix is to
decend into the object
- See thread 20233 for the original report
- DataTables' smart filtering now has the ability to search for an exact
string, in the given order, over multiple words. This is done by
providing the exact match search string in quotes - for example:
Angela "Cheif Exec" London
Will match three terms - `Angela`, `Cheif Exec` and `London`. Those
three terms will be matched in any order.
- This matches the search behaviour that we all know and love in Google!
- It can be disabled along with the rest of DataTables' smart filtering
using the `smart` option.
- This enhancement comes courtesy of Barry Keepence. Original forum
thread: http://datatables.net/forums/discussion/16250/. Thanks!
- See thread 20075 for the original report
- Basically the issue here was that the object being used for the API
extension on objects (e.g. `table.ajax` is an object) the object was
not unique to each API instance, so it was being shared between
instances and as a result, whatever instance was created last, would
win!
- Fix is to use a new object each time.
- DataTables uses the `DT` namespace for events internally and will
remove them automatically on destroy, but `dt` is used for public
events. As such, the public events used internally should use `.dt.DT`
to ensure that the listener works as expected, but also so that the
destroy call will remove these listeners
- This is to preserve user added listeners on destroy. If they want to
remove their listeners to prevent memory leaks, then they should do
so. But DataTables won't do it for them, as actually, you might want
to keep your event listeners!
- fnServerData's second parameter should be an array of objects with
name/value pairs. It was being passed through as the more modern
object, but fnServerData is only present for compatiblity with 1.9 and
should the original format should be retained. This is done with a
simple map function
found
- The old fnGetData method would return null, rather than undefined for
some reason if a given row was not found in the DataTable. The new
wrapper api for the legacy interface should do the same.
- Previously if you cancelled an Ajax request, or the browser did (for
example following a link) the error handler would be entered and show
an alert. This just ensures that the request is complete before
showing an error
- Previously when using columns.render as an object, you had to supply
an `_` option which was the fallback. However, I've now made it so
that if there is no `_` option it will just use the raw data from
`columns.data`
- I've come accross a lot of cases recently where numbers need to be
formatted for display, so I wanted to introduce rendering helpers for
DataTables to make this easier. Only one helper introduced here -
`$.fn.dataTable.render.number()` which will return an object that can
be used by `columns.render` to format "raw" numbers.
- The child row feature of DataTables should be able to take a `tr`
element and add that directly as a child. That wasn't working due to a
logic error before.
would be removed from the array of data passed through to the custom
filtering functions. This would cause indexes to misalign.
- The fix is to simply pass in the data filter array that has already
been computed, as that is 1:1 for the display. Also added the raw data
source object for the row for completeness and a bit of a code tidy
up.
- This will cause a bit of an indexing issue, if you have bVisible:false
set, but this is certainly a bug that had to be fixed - it just didn't
make sense as it was, and went against the documentation!
- See thread 19593 for more information
newly created elements
- The fix i've put in is basically the same as what DataTables 1.9-
used. I had tried to opitmise it a little, but it wasn't working for
newly created cells. I still think this can be optimised, but for the
moment, this is at least allows it to work.
and result set for the plural methods.
Fix: Row details events were itterating over non-DataTables rows
creating a Javascript error
Fix: Example - Server-side processing row details example updated to be
able to restore the details row on a redraw.
Update: Documentation - Most examples which used `flatten()` are more
correct to use the new `eq()` method, so they have been updated.
- This set of changes is based on the discussion in thread 19377. While
working on the fix, I realised that the use of flatten() is too broad,
so the new `eq()` function is introduced. It is similar to the jQuery
eq() method in that it reduces the instance to just the selected
index, although in DataTables this is both the context and the result
set. Its a small addition, but I think it will provide to be very
useful
DataTables which character is used as a decimal place in the table's
data, so that number which are formatted using characters other than a
dot as the decimal place can be correctly detected and sorted.
- A large part of the world uses the comma as a decimal place, so it
makes sense to have this option built-in directly to DataTables,
rather than needing to use plu-in sorting types as before:
http://en.wikipedia.org/wiki/Decimal_mark
- However, the decimal place character cannot be detected automatically
since there are far to many ambiguities. As such, a new
`language.decimal` option is defined which is passed through to the
type detection functions. The type detection functions can then use
that character to alter their detection functions to transform numbers
into the dot formatted equivilent for parsing in Javascript.
- The numeric sorting methods have been bundled together in the function
`_addNumericSort` which is called when a character is given for the
decimal mark, adding the sorting functions required specifically for
that mark. This means that any character at all can be added, while
keeping the table's sort performance as it was.
- Code size in increased a little for this new feature, but a lot of
work has been done to keep it to a minimum (while still optimising for
the most common use case of a dot decimal place), and this is a good
feature to have in DataTables' core code.
- All required documentation added and updated.
- Special thanks to Tobias Bäthge for suggesting and sponsoring this
feature.
- This is caused due to different content in the displayed header and
the size forcing header in the body scrolling table. The browsers can
lay the two tables out differently even although the widths applied
are identical, due to the different content.
- The fix is to keep the content in the scroll body header, but hide it
by wrapping in a div which has height 0 and overflow hidden
- See thread 19311 for more information
server-side processing
- A popular plug-in for DataTables is the `fnSetFilteringDelay` plug-in,
which provides a bit of a buffer when typing into the filter input so
you don't make an Ajax request for every key stroke - i.e. don't DDoS
your own server!
- Since we have _fnThrottle built in now for the scrolling, we can also
use it to provide this buffering functionality for server-side
processing filtering in the core. A couple of small changes for
_fnThrottle were required to get the callback context correct and ot
call it not immediately, but only after the delay
footer
Update: Update CSS to display the table border properly when there is no
footer when scrolling
Dev: Update the _fnAddOptionsHtml function to be smaller in code size.
Identical functionality, just smaller code
fact that the table width attribute has been removed, but was being
applied to the table anyway, as 0px - causing the table to be as narrow
as possible. On the plus size, the columns kept their alignment with
such a misconfiguration! However, now the `width` option for columns is
correctly applied in x-scrolling tables.
don't need to look it up with inArray. Also the header renderer does not
pass in the column index now (the column.idx property can be used). This
is to allow operations such as ColReorder to reorder teh columns and
still have the renderers update correctly
- Column width is always a particularly difficult one to get quite
right. In this case, the fix is to have DataTables read column width
information from the `width` or `style` attributes of a column header
cell, if that information is present. If it is, it is treated as
sWidth is (although user supplied sWidth can override). That is it say
that it will be applied to the column width calculation table.
- The remaining gap is if a developer assigns a width using css classes.
We can't get that information, so we fall into the old problem.
- This change comes about from the discussion in
http://datatables.net/forums/discussion/19089 and the fiddle here:
http://jsfiddle.net/EysLd/1/
- What is happening in the test case is that the calculation table is
being created, but it is then stripped of widths due to this commit:
https://github.com/DataTables/DataTables/commit/6a9e324 . That was to
allow DataTables column headers to have their applied size removed, so
a new size could be calculated. Only sWidth would override that - now
the width and style attributes will as well
- IE8- requires that Function.prototype.apply be used with an array or
arguments object as the second parameter - it being "array-like" isn't
good enough.
- This fixes DataTables/DataTables #262
plug-ins
- A lot of plug-ins use _fnCalculateEnd and although all that is needed
in the upgrade is to remove it, since the value is calculated
automatically now, it will likely cause confusion and hassle. So I've
added this stub to prevent those errors.
- Chrome (V8) will incorrectly detect '$245.12' and similar as dates,
since V8 will strip unknown characters from a string given to
Date.parse and then attempt to parse the rest of the string - in the
example above: Dec, 245:
https://code.google.com/p/v8/source/browse/trunk/src/dateparser-inl.h#72
- The fix implemented to to check for a leading a-zA-Z, number or +-.
Although this isn't a perfect match for what Chrome does, it, I think,
a good enough effort to chatch nearly all particular use cases.
- Additionaly, V8 will try to parse a single number passed into
Date.parse - 1-12 are months, 32+ are years. As such, the numeric type
detection much be a highter priority than the date detection, since
Chrome might incorrectly use a column as a date. It would sort
correctly, but it isn't "correct".
- The take away from this is that Date.parse cannot be used for date
format validation on its own...
