paper-item in iOS Safari

Paul Bailey

unread,

Jul 25, 2014, 6:41:14 PM7/25/14

to polym...@googlegroups.com

I'm trying to use paper-item in paper-menu-button and for the most part it works great. However, in the iOS simulator for safari I can't seem to catch any click with onclick or ng-click. It works every where else even in desktop Safari. Is this maybe just a simulator issue? Is there another way to catch click/touch events in Polymer? I'm able to use ng-click for paper-buttons with no problem but I can't seem to catch the paper-item click on iOS. I've even tried putting a button in the menu and that doesn't work. So it seems the menu is maybe catching clicks and not letting them propagate?

Martin Kleinschrodt

unread,

Jul 26, 2014, 10:03:09 AM7/26/14

to polym...@googlegroups.com

You probably want on-click. See http://www.polymer-project.org/docs/polymer/polymer.html. You might also want to read http://www.polymer-project.org/docs/polymer/touch.html. Btw, this sort of question is probably better suited for stackoverflow rather the the dev mailing list.

Rob Dodson

unread,

Jul 26, 2014, 3:56:06 PM7/26/14

to Martin Kleinschrodt, polymer-dev

I believe you need to add touch-action="auto" to the body. Can you try that?

<body touch-action="auto">

I think we're fixing this in the next release of Polymer

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/d36af9ab-1593-4564-ad40-c51553eb704b%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

Paul Bailey

unread,

Jul 27, 2014, 6:03:15 PM7/27/14

to polym...@googlegroups.com, makl...@googlemail.com

Yeah I had touch-action="auto" already on. If it is going to get fixed in the next version, I can wait. I'm not releasing anything soon. Also remember it is only Safari on iOS that has the problem. Safari desktop works fine and chrome on android and desktop works fine too.

Rob Dodson

unread,

Jul 29, 2014, 3:47:13 PM7/29/14

to Paul Bailey, polymer-dev, Martin Kleinschrodt

I'm able to listen for click events in the simulator.

document.querySelector('paper-item').addEventListener('click', function() {

alert('clicked');

});

That just listens to the first paper-item and I see my alert popping up in the simulator.

Can you post an example of how your code is structured?

On Sun, Jul 27, 2014 at 3:03 PM, Paul Bailey <paul.m...@gmail.com> wrote:

Yeah I had touch-action="auto" already on. If it is going to get fixed in the next version, I can wait. I'm not releasing anything soon. Also remember it is only Safari on iOS that has the problem. Safari desktop works fine and chrome on android and desktop works fine too.

Follow Polymer on Google+: plus.google.com/107187849809354688692

---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/de682e1f-8ee0-4047-aba3-42a0001cc35a%40googlegroups.com.

Paul Bailey

unread,

Jul 29, 2014, 3:52:50 PM7/29/14

to polym...@googlegroups.com, paul.m...@gmail.com, makl...@googlemail.com

paper-item alone works fine, it is when it is in a paper-menu-button that it seems to stop working. I've tried putting other things in the menu like paper-buttons and they lose the ability to catch onclick too.

Here's my code:

<paper-menu-button icon="more-vert" ng-if="logged_in" halign="right">
  <paper-item label="[[ user.email ]]" icon="account-box"></paper-item>
  <paper-item label="Logout" icon="exit-to-app" ng-click="logout()"></paper-item>
</paper-menu-button>

Rob Dodson

unread,

Jul 29, 2014, 6:00:32 PM7/29/14

to Paul Bailey, polymer-dev, Martin Kleinschrodt

I had it inside of paper-menu-button when I added that listener. I can't say how it will work with ng-click though. That's maybe less of a Polymer bug and more of an Angular issue.

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/608281ac-355e-4539-89d0-e1aab2913a7d%40googlegroups.com.

Paul Bailey

unread,

Jul 29, 2014, 6:02:55 PM7/29/14

to polym...@googlegroups.com, paul.m...@gmail.com, makl...@googlemail.com

I tried the onclick attribute too and that did not work. I didn't try javascript via addEventListener though.

Rob Dodson

unread,

Jul 29, 2014, 6:42:35 PM7/29/14

to Paul Bailey, polymer-dev, Martin Kleinschrodt

onclick seems to work ok for me:

<paper-menu-button icon="menu">

<paper-item onclick="sayHello();">Menu Item 1</paper-item>

<paper-item>Menu Item 2</paper-item>

<paper-item>Menu Item 3</paper-item>

</paper-menu-button>

<script>
function sayHello() { alert('hello!'); }
</script>

is your simulator running ios 7 or is it on an ios 8 preview?

On Tue, Jul 29, 2014 at 3:02 PM, Paul Bailey <paul.m...@gmail.com> wrote:

I tried the onclick attribute too and that did not work. I didn't try javascript via addEventListener though.

Follow Polymer on Google+: plus.google.com/107187849809354688692

---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/a317aa3e-1f43-4b4f-9ae5-25382b649ac5%40googlegroups.com.

Reply all

Reply to author

Forward