Can someone explain to me the igGrtid event "responsiveModeChanged"?
I am seeing inconsistent results from this event. Meaning, it does not appear to fire at times.
Also, I am seeing calls to "getCurrentResponsiveMode" such as "var mode = $(".selector").igGridResponsive("getCurrentResponsiveMode");" appear to be returning the previous ResponsiveMode vs the actual current mode.
getCurrentResponsiveMode" such as "var mode = $(".selector").igGridResponsive("getCurrentResponsiveMode");" appear to be returning the previous ResponsiveMode vs the actual current mode.
var
mode = $(
".selector"
).igGridResponsive(
"getCurrentResponsiveMode"
);"
I should add this is using 2015.1.
Hello Cecil,
By design this event is fired when the widget detects change in the responsive mode. However, what your igGrid recognizes as a mode change is configurable. By default there are three modes, phone, tablet and desktop. When there is a switch between these modes responsiveModeChanged event is expected to fire.
In regards to your second question getCurrentResponsiveMode method returns the current responsive mode. If you would like to retrieve the current responsive mode in the responsiveModChanged event you could alternatively use the ui argument. For example:
//Delegate $(document).delegate(".selector", "iggridresponsiveresponsivemodechanged", function (evt, ui) { //return the previous responsive mode ui.previousMode; //return the current responsive mode ui.mode; });
//Delegate
$(document).delegate(
,
"iggridresponsiveresponsivemodechanged"
function
(evt, ui) {
//return the previous responsive mode
ui.previousMode;
//return the current responsive mode
ui.mode;
});
Additionally, I made a small sample illustrating when the rsponsiveModeChanged event is fired and what getCurrentResponsiveMode method returns.
I am setting igGrid`s width option to 100%. Afterwards I am resizing the window to make it similar in size to phone or tablet. There is an alert in the event handler showing the new mode when this event is fired.
features: [ { name:"Responsive", responsiveModeChanged: function (evt, ui) { alert("Mode retrieved using ui.mode: " + ui.mode); } } ]
Please have a look at my sample and let me know if you need any further assistance afterwards