I have an input button like so:
<input value="submit" type="text" onclick="doThing"/>
Is there any reason why this shouldn't be working in Firefox? I know Firefox functions work differently than in Chrome sometimes, but I'm not sure when this is the case.. I get no console errors in Firefox, annoyingly. The doThing function is not getting fired at all.
Any documentation about why this functions differently in Firefox? Or is this a more obscure bug? Any help would be appreciated, thanks!
Found the solution! Bit of a Firefox quirk. The issue was not with the event listener, it was that somewhere else in my code I had to set the disabled value of my input to true in order to prevent multiple button clicks while my database was updating. In Chrome, when you refresh the page, the value of disabled is reset back to false, but in Firefox there is a feature where it remembers the values of input fields.
Setting autocomplete="off" to my <input/> DOM element did the trick. It now works as intended in both Firefox and Chrome.
Related
I have a calendar which is currently displaying in an iframe of a form created in a third party software to select the date. In chrome, Firefox and edge the behaviour of clicking the link in the date auto-fills the input field for 'date selected' on the parent page.
However in IE11, this doesn't happen. There's also nothing appearing as an error in the console on IE11 when I check that. The code for the link is as follows;
<a name="01/08/2018" id="date" onclick="myFuncclick(this.name);" href="javascript:myFuncclick(this.name)" target="_self">1</a>
with the following code to catch it at the bottom of the calendar page;
function myFuncclick(name){
parent.myFuncread('#Field38',name);
}
and on the parent page the following script;
function myFuncread(field, value){
$(field).val(value).change();
}
Already I'd seen that there have been posts about JS onclick not playing nice with IE11, and had attemtped to remedy this by using the href="javascript:myFuncclick()" addition but IE11 still seems to be blissfully ignorant of the whole thing.
Has anyone had similar issues with IE11 & managed to work around it?
EDIT -
So in IE11 I can (by changing the function to have an alert line as well) get IE11 alerting the variable that Chrome and Edge are happy passing. For me this means that the parent window JavaScript might be where the error lies, maybe something in the way IE11 handles cross-window scripts.
I am making a simple calculator web application using HTML and Javascript. I will style it once I get it to work.
Here is the link to the source code in Javascript:
Calculator, unnecessary parts blanked out
My problem:
The calculator has certain percentage values depending on the calendar year, hence changing the year should change the values in the input text fields.
This works fine in Firefox and IE (once you enable blocked content) but refuses to work in Chrome. I've released that Chrome has tighter security policies, so I added a document event handler but this still does not work while using Chrome. I've attached the relevant code please help this is driving me mad.
The event listens to click not change, try this.
document.getElementById('year').addEventListener('change', handleOnclick);
I have several html input fields on my web form. When I tab back and forth the field that has focus does not show the blinking cursor when using Internet Explorer, but does when using Chrome, Safari or Firefox.
The text fields initially show watermark text when not in focus.
I have spent days Googling the answer for this but to no avail.
I have seen this issue on IE9 (did not reproduce in IE10+, and didn't test below 9). The problem occurred when the form was within an element being translated with -ms-transform. Removing the transform fixed the issue.
I'm afraid that this is common behavior of the IE, as a workaround first try to add cursor: text to the input(s), then if did not worked you may try to set the cursor style using javascript on focus event.
Actually, microsoft themselves do this as in the http://login.live.com form.
Hope this helps ...
Try calling focus() and select() via javascript when you want the cursor to be shown in IE on an input having the watermark (placeholder) set.
Since upgrading to the latest Chrome version 34.0.1847.116, the focus event does not seem to be firing when calling
myinput.focus()
in Javascript.
This works fine in Chrome 33.0.1750.154.
test.html
<html>
<head><title>Test</title></head>
<body>
<input id="test_box" onfocus="alert('focused');" />
</body>
</html>
From the console:
document.getElementById('test_box').focus();
No alert in Chrome 34.
Any ideas? Is this a bug? Is there a workaround to fire the event?
The focus event will fire once you unfocus the Chrome Dev Tools.
I don't know if this is actually a bug or bug fix for Chrome v34 if v33 doesn't show the same behavior. (it is due to typing the statement in, in the Console).
If you try http://fiddle.jshell.net/aQ5n6/7/show/
and go to the Console, and type in
document.getElementById('test_box').focus();
it won't alert because the focus is still in the Console... but as soon as you click on the content of the HTML doc (such as any empty space), then it will fire the alert. It looks like when the focus is not actually on the input element (when focus is still on the Console), then the event is not fired.
My Version of Google Chrome is 34.0.1847.116
working here Fiddle
<input id="test_box" onfocus="alert('focused');" />
Advice: Check your console for error or warning.
I'm experiencing issues with IE9 which is not performing the actions I need when clicking a button that was initially disabled, and re-enabled via javascript.
I have a form (built with perl CGI) which has several buttons. These are all disabled in the actual html, and are being enabled when the form is completely loaded. This is done to avoid users saving the page before it is fully loaded.
In all browsers the buttons appear disabled initially, and get enabled when the page is fully loaded. Also in IE.
Now these re-enabled buttons don't do their work when clicked in IE (tested with IE 9), but they do work as expected in firefox and chrome.
The code for one of these buttons as it appears in the IE developer tools:
<input name="Event_Action" id="syncStream" type="submit" value="Create Sync Stream"/>
The code which creates the button initially disabled:
print $query->submit( -name=>'Event_Action', -value=>$btnCreateSyncStream, -disabled=>'disabled', -id=>'syncStream');
The buttons are being enabled via the onload event of the body tag:
<body onload="enableButtons()">
<form method="post" action="/cgi-bin/pdf/pdf.pl?&pdf_id=1071&release=at7.1.0&pdf_patch_rel_phase=b" enctype="application/x-www-form-urlencoded" onsubmit="return validatePatchNr()" name="MYFORM">
The javascript function enableButtons:
function enableButtons()
{
var buttons = document.getElementsByName("Event_Action");
for (i=0;i<buttons.length;i++)
{
buttons[i].disabled=false;
}
}
Now, when one of these re-enabled buttons is being used, IE seems to reload the page, but the actual action linked to the button is not being executed.
The same page in Chrome and Firefox works correctly. Both of these browsers execute the correct action.
I supsect that not every field on the form is being submitted which causes the Perl script not to recognize the action that is requested, but I'm not sure of that yet.
I tried debugging the issue with the dev tools in IE, but those are not really easy to work with if you're used to firebug.
Anyone has any idea what might be going wrong here? I might be missing something obvious.
Well did you try to use different name of each button ? Usually some browser do not submit name value pair of each button, but some browser does. I Guess you should change the name of each button to be unique and use a hidden field to determine the Action to perform rather than button VALUE.