1

We have a php/js (with jQuery, jqgrid jQueryUi) webapplication which works fine in Firefox, Chrome and Edge. However, in Internet Explorer 11 some buttons are not working anymore. Looking into the problem, i found out that if i allow "active scripting" in internet options for the internet zone, everything works fine. However, the webapp was already listed in trusted sites for which active scripting had been allowed all the time. The trusted sites setting for active scripting also seems to be working for some javascript.

Since it is not possible to instruct our customers to set their internet zone to allow scripting or to change the browser, i am currently trying to figure out the exact problem by setting "active scripting" to "ask" and making minimal changes to our website. I really think there should be a solution since the problem does not appear to appear on all buttons and js calls.

I also tried to find a solution online and there indeed are other users with similar problems, but they have all different circumstances which do not fully apply to my problem.

In our case some js works and only some onclick events do not work. It is also not a problem in the js code itself because i also tried inserting an alert() or console.log into the onclick but they did also not work. Even leaving the onclick blank did not change anything. Only when i remove the onclick event completely, i don't get a warning about running scripts. It seems that it also doesn't relate to the element the onclick is in because it seems to affect <input> as well as <span> and other elements.

Example elements without working onclick:

<input type="button" value="Cancel" style="width:150px;" onclick="onClickProgressCancel(this);">
<span onclick="xajax_XCallback_OnClickModuleGridEditRow($(this).attr('id'));" id="EDIT_GRID_ROW_26_1" class="icon icon-edit" title="Edit"></span>

Element with working onclick:

<span id="BTN_EXPORT_26" title="Export" onclick="onClickExport_26();" class="btn_26 ui-button ui-widget ui-state-default ui-button-text-only" role="button"><span class="ui-button-text"> <span class="icon icon-export"></span><span>Export</span> </span></span>

The only thing that seems to have an effect is to remove the onclick and set a click handler with jQuery. I could not yet try it out completely but at least i got no script warning when doing that. However, i think that this is not a solution which i could apply to the whole webapplication.

Is there anything else i could try out to find the "real" problem or maybe even a solution which does not require completely changing our webapplication?

== Update 02.07.2020 ==

I found out that it appears to happen with elements that are inserted into the page after the page was loaded. E.g. with the following code:

oEleProgress = $( '<input type="button" value="Cancel" style="width:150px;" onclick="onClickProgressCancel(this);" />';).appendTo( 'body' );
asgaroth
  • 52
  • 1
  • 7
  • Not sure if it will make a difference, but you should move away from inline event handling with HTML event attributes like `onclick` and instead do all your event binding in JavaScript using `.addEventListener()`. – Scott Marcus Jul 01 '20 at 16:35
  • What warnings are you getting about the scripts and is there any error in console in IE? Besides, have you reproduced the issue in other machines' IE browsers? Besides, I think you shouldn't use inline event handlers and should instead making use of `addEventListener` to attach the respective events to the elements. – Yu Zhou Jul 02 '20 at 07:06
  • When setting Active Scripting to 'ask' i get the confirmation dialog if i want to execute scripts. I do not get any error in the console and the problems appear on other machines too. As stated it happens in our customers browser. I know that inline event handlers are not optimal but right now it is not possible to change this. However, it is also not the source of the problem, other inline event handlers work. I found out that it is only happening with elements inserted after page loading. – asgaroth Jul 02 '20 at 08:58
  • I think the issue is due to the elements are dynamically added. We need to use [event delegation](https://stackoverflow.com/questions/1687296/what-is-dom-event-delegation) to handle the event. You could also refer to [this thread](https://stackoverflow.com/questions/34896106/attach-event-to-dynamic-elements-in-javascript/34896387#34896387). I think you have to change your code. If you don't want to change the code then you can only ask the customers to change the IE setting. I think there's no other options. – Yu Zhou Jul 03 '20 at 08:37
  • You should do like this: https://stackoverflow.com/a/32867933/2827823 – Asons Jul 04 '20 at 19:53

0 Answers0