I'm using bootstrap v3.2.0, i wish to change the backdrop to false after the modal have already initialized
i have try to use:
$('#myModal').removeData("modal").modal({backdrop: 'static', keyboard: false});
but is not working, please help
found answer
$('#modal').data('bs.modal').options.backdrop = 'static';
You can try this compact way:
$('#modal').modal({ backdrop: "static" });
Related
I'm using a basic swiper with no option. Then I have a listener for "mousemove" in the body of my site. I did this to build a mouse follower effect. This works well, but when I start to drag a slide, it seems this event will not arrive anymore and my custom div "used for mouse effect" does not move.
I finally found a solution in the api! You can set touchStartPreventDefault to false:
this.mySwiper = new Swiper(".swiper-container", {
touchStartPreventDefault: false
})
Look for the Touches section in the #Parameters
touchStartPreventDefault: false
causes firefox swipe bug.
You can use pointermove instead of mousemove.
Bro after full day of testing this is what finally worked
const slider = new Swiper(e, {
slidesPerView: 'auto',
direction: 'horizontal',
speed: 200,
loop: true,
touchStartPreventDefault: false,
allowTouchMove: true,
})
With this link you can reproduce the bug.
https://jsfiddle.net/pw7e2j3q/
<script>
$( "#test" ).change(function() {
$("#test").remove();
var combo = $("<select></select>").attr("id", "test2").attr("name", "test");
combo.append("<option>New One</option>");
$("#App").append(combo);
});
$("#click").click(function(){
$("#App").remove();
})
</script>
If you click on a <select> element and remove it from dom and after that you click on the link test. You should see the old <select> element pop for selection.
is there some hack to fix that ?
I was able to reproduce this issue. The problem is, whenever you are trying to remove the select box on its change event then iOS10 is not able to properly unbind the selectbox. To fix this you need to put your code change event code inside a setTimeout with some timeout value. It is not working with zero timeout value.
http://jsfiddle.net/n62e07ef/
Below is a fix for your code:
<script>
$( "#test" ).change(function() {
setTimeout( function() {
$("#test").remove();
var combo = $("<select></select>").attr("id", "test2").attr("name", "test");
combo.append("<option>New One</option>");
$("#App").append(combo);
}, 50);
});
$("#click").click(function(){
$("#App").remove();
})
</script>
One easy solution would be change the code a bit so don't re-generate the whole select-element, but just the option-elements inside.
I've stumbled upon this bug today. It's like Gautam says in his answer that the event wont unbind before the element it removed.
My solution, blur the element before removing it.
$("#test").blur().remove();
As the title of this post already says: I'm trying to toggle an icon in my tabcontainer.
I got a TabContainer with some ContentPanes in it.
If I get some values from the database I show them in the ContentPane and set the IconClass so the user see that there is some data.
In the my ContentPane I also got a delete and a save button.
If there was some data and the delete button is pressed I'd like to remove or to hide the Icon in the Tab.
Of course I want to do the other way, too.
But how do I do it?
I tried it with registry.byId("myIdOfTheContentPaneWhereTheIconClasswasDefined").className="dijitNoIcon"
without an effect.
Any ideas?
Try setting iconClass instead of className.
Proof-of-concept:
require([
'dijit/layout/TabContainer',
'dijit/layout/ContentPane'
], function(TabContainer, ContentPane){
var container = new TabContainer({ id: 'container' }).placeAt(document.body);
var pane = new ContentPane({
iconClass: 'dijitIconSave',
title: 'Tab'
}).placeAt(container);
container.startup();
setTimeout(function () {
pane.set('iconClass', '');
}, 2000);
});
registry.byId returns you a widget, not a domNode.
This should work:
registry.byId("myIdOfTheContentPaneWhereTheIconClasswasDefined").domNode.className="dijitNoIcon
although it is not elegant at all...
What is the best way to test if a Magnific Popup is currently "open"?
Will a check for the existence of some div be future proof?
For example, if I use:
if ($(".mfp-ready").length > 0)
...
I looked for the equivilent of an isopen property in the api documentation but found nothing like that
EDIT
Following Dmitry's answer, I examined the instance object and found the following properties that may prove useful to others:
isAndroid
isIE7
isIE8
isIOS
isLowIE
$.magnificPopup.instance.isOpen
Here is simple solution from Magnific popup documentation
$('.image-link').on('mfpOpen', function(e /*, params */) {
console.log('Popup opened', $.magnificPopup.instance);
});
Old question, i know, but none of the other answers solved the same issue for me.
The next code solved it for me:
$('.open-popup-link').magnificPopup({
callbacks: {
open: function() {
console.log('text to show in console if popup is open');
}
}
});
I have a list in tab panel and i added onItemDisclosure which supposed to switch to an into page (inside the tab panel).
The setActiveItem does not work, and the error I got is that: [undefined] is not a function.
Code:
Toolbar.views.listPanel = Ext.extend(Ext.List,{
id:'mylist',
store:ListStore,
itemTpl: '<div class="stores"><b>{name}</b><br/><p style="font-size:small">{address}{distance}Km</p></div>',
//grouped:true,
onItemDisclosure: function(){
//Ext.Msg.alert("closure works!");
//Toolbar.views.detailPanel.update();
//alert(Toolbar.views.detailPanel);
Toolbar.views.Searchcard.setActiveItem(Toolbar.views.detailPanel,{type:'slide',direction:'left'});
}
});
The panel to switch to:
Toolbar.views.detailPanel = Ext.extend(Ext.Panel,{
id:'detailpanel',
tpl:'Hello!'
});
Ext.reg('searchcard', Toolbar.views.Searchcard);
Ext.reg('listPanel', Toolbar.views.listPanel);
Ext.reg('detailPanel', Toolbar.views.detailPanel);
Thanks in advance,
The problem is you're referencing the class not the instance of the Searchcard. You have to reference it using a component query.
Generally it follows this way:
masterComponent.getComponent('your_component_itemID');
Or you can use panel.query(selector)
http://docs.sencha.com/touch/1-1/#!/api/Ext.Panel-method-query
Really instead of just hacking it through have a look at this article:
http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/