I use the codes to invoke a click event in a button. I got an uncaught type error,
let inputBtn = document.getElementById("input-btn")
inputBtn.addEventListener("click", function() {
console.log("Button clicked from addEventListener")
})
How can I fix it?
Thanks.
Related
I want to show alert dialog when pressing back button. But I'm facing a problem.
This is my code:
BackHanlder{
AlertDialogComponent()
}
And I got this error:
#composable invocations can only happen from the context of an
#composable function
Any help?
To show alert dialog you have to keep the boolean value as state, and change it in back handler
var showAlertDialog by remember { mutableStateOf(false)}
BackHandler {
showAlertDialog = true
}
if(showAlertDialog){
AlertDialog(//)
}
I have a tabpanel and have many childs. Each are closable. I want to remove the tabpanel itself when there are no children.
listeners: {
close: function(element) {
var detailTabPanel = element.up('DetailTabPanel');
if(detailTabPanel.items.length <= 1)
{
detailTabPanel.destroy();
}
}
}
I have written code like above for close action. But i get error like
Uncaught TypeError: Cannot read property 'get' of null DetailTabPanel is the tabpanel.
Almost there! Try it like this:
listeners: {
remove: function(tabpanel, child, eOpts) {
if (tabpanel.items.length === 0) {
tabpanel.destroy();
}
}
}
See Fiddle here: https://fiddle.sencha.com/#fiddle/1fo2
You don't have to do callParent inside a listener.
You're using the wrong event. Rather than listening for the close event of the children (which is called after the tab is removed from the panel), you want to listen for the remove event on the tab panel itself.
I have a touch listener
var touchListener = cc.EventListener.create({
event: cc.EventListener.MOUSE,
onMouseDown: function (event) {
console.log("working");
console.log(event._y);
}
});
When I click the screen the "working" message shows, but then I get js_console_log : Error processing arguments for the event._y
What am I doing wrong?
The correct way to get the event's Y axis coordinate is: event.getLocationY().
If you put a breakpoint in console.log("working"); you could inspect the event object and see all it's methods and properties :)
I am using an external toolbar in a jQuery Mobile site I'm working on. I initialize it like so:
$(document).ready(function () {
$("[data-role='header'], [data-role='footer']").toolbar();
});
I have a couple of buttons in the toolbar and want to disable them during page transitions so users don't click them multiple times which seems to get the framework into a weird state. My first attempt has been to listen for the pagebeforeshow and pageshow events to programmatically disable and enable the buttons:
$(function() {
$("[data-role='header'], [data-role='footer']").toolbar({
create: function (event, ui) {
$(document).on('pagebeforeshow', function () {
$('#page-header .ui-btn').button('disable');
});
$(document).on('pageshow', function () {
$('#page-header .ui-btn').button('enable');
});
}
});
});
I have the code nested inside like that because I don't want to register the handlers until the toolbar has been initialized. However, I'm running into a separate problem:
Uncaught Error: cannot call methods on button prior to initialization; attempted to call method 'disable'
Since I'm not explicitly initializing the buttons myself, I'm not sure I understand how / where I can wait for them to be initialized.
Is there a better approach to this, and does anyone have any suggestions to get this working?
Use .button() on input with type button, reset and submit. For anchor or button tag you need to add / remove ui-state-disabled class.
$(document).on("pagecontainerbeforehide", function () {
$('#page-header .ui-btn').addClass('ui-state-disabled');
});
$(document).on("pagecontainershow", function () {
$('#page-header .ui-btn').removeClass('ui-state-disabled');
});
Demo
my mouseleave is not working in my jquery code
http://jsfiddle.net/alano/9Dr7T/29/
providing my js code below
mouseleave: function () {
$(this).find("div:last").remove();
}
The problem isn't with the mouseleave listener, the problem is how you're binding those event handlers and unbinding them for that matter. The div was being removed, but it was being readded with every mouseenter event. For some reason the mouseenter event wasn't being unbound when using the selector filter for .on(). It probably has something to do with the way bubbling occurs when using the selector filter.
When a selector is provided, the event handler is referred to as delegated. The handler is not called when the event occurs directly on the bound element, but only for descendants (inner elements) that match the selector. jQuery bubbles the event from the event target up to the element where the handler is attached (i.e., innermost to outermost element) and runs the handler for any elements along that path matching the selector.
Now, I'm not 100% sure why just yet, but either way it will work if you use directly-bound handlers like so:
$('.specialHover').on({
mouseenter: function() {
$("<div class='cta'>add image</div>").click(function() {
var $me = $(this);
$me.parent().unbind('mouseenter').children('img').attr(
'src',
'http://www.onlinegrocerystore.co.uk/images/goodfood.jpg'
);
$me.remove();
}).appendTo(this);
},
mouseleave: function() {
$(this).find('div:last').remove();
}
});
See: http://jsfiddle.net/9Dr7T/35/
Did you tried this way:
mouseleave: function () {
$("div:last",this).remove();
}