Polymer-Papier-Dialog wird bei Safari oder Firefox nicht geöffnet

Der Versuch, diesen Papier-Dialog zu öffnen, wenn eine Papierschaltfläche angeklickt wird, scheint aber außerhalb von Chrome nicht funktionieren zu wollen. Ich habe das Gefühl, dass das Problem mit der Tatsache zu tun hat, dass es in einer Dom-Wiederholung ist, aber ich bin mir nicht sicher, dass jede Hilfe, die Sie mir geben könnten, sehr geschätzt würde. Der Fehler, den ich in Safari bekomme, ist "TypeError: dialog1.toggle() ist keine Funktion. (In 'dialog1.toggle()' ist 'dialog1.toggle' nicht definiert)". In Firefox habe ich gerade "TypeError: dialog1.toggle ist keine Funktion". Hier ist mein Code Ich hoffe, dass jemand mich in die richtige Richtung weisen kann.Polymer-Papier-Dialog wird bei Safari oder Firefox nicht geöffnet

<script src="../bower_components/webcomponentsjs/webcomponents.js"></script> 
<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html"> 
<link rel="import" href="../bower_components/polymer/polymer.html"> 
<link rel="import" href="../bower_components/paper-item/paper-item.html"> 
<link rel="import" href="../bower_components/paper-button/paper-button.html"> 
<link rel="import" href="../bower_components/paper-dialog/paper-dialog.html"> 
<link rel="import" href="../bower_components/paper-dialog-behavior/paper-dialog-behavior.html"> 
<link rel="import" href="../bower_components/paper-dialog-behavior/demo/simple-dialog.html"> 
<link rel="import" href="../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> 
<link rel="import" href="../bower_components/paper-listbox/paper-listbox.html"> 
<link rel="import" href="../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html"> 
<link rel="import" href="../bower_components/iron-demo-helpers/demo-snippet.html"> 
<link rel="import" href="../bower_components/iron-demo-helpers/demo-pages-shared-styles.html"> 
</head> 
<body class="unresolved"> 


<template is="dom-bind"> 
<template is="dom-repeat" items="{{data}}"> 
<paper-button raised onclick$="dialog{{item.id}}.toggle()">{{item.series}} </paper-button> 
    <simple-dialog id$="dialog{{item.id}}"> 
    <h2>{{item.series}}</h2> 
    <p>{{item.data}}</p> 
    </simple-dialog> 
<br /> 
</template> 
<iron-ajax auto id="GetData" url="get_category_data.php" handle-as="json" last-response="{{data}}" ></iron-ajax> 
</template> 

</body>

Quelle

2016-06-20 user1590569

Warum verwenden Sie 'Simple-Dialog' statt' Paper-Dialog'? – a1626

Verwenden getElementById scheint gut zu funktionieren. Hier ist der Code, der für mich in Firefox funktioniert hat. Hoffentlich wird es auch in Safari arbeiten

<template is="dom-bind"> 
<template is="dom-repeat" items="{{data}}"> 
    <paper-button raised onclick$="toggleDialog({{item.id}})">{{item.series}}</paper-button> 
    <simple-dialog id$="dialog{{item.id}}"> 
    <h2>{{item.series}}</h2> 
    <p>{{item.data}}</p> 
    </simple-dialog> 
    <br /> 
</template> 
<iron-ajax auto id="GetData" url="get_category_data.json" handle-as="json" last-response="{{data}}" ></iron-ajax> 
</template> 
<script> 
function toggleDialog(id){ 
    var dialog = document.getElementById('dialog'+id); 
    dialog.toggle(); 
} 
</script>

Quelle

2016-06-20 17:52:49 a1626

alten Thread aber ich werde diese Variante des oben hinzufügen für Polymer1.0

<div> 
    VAT check date: <paper-button value="paperbuttontest" raised on-tap="_paperDialogButtonEdit">{{buyer1.vat_check_date}}</paper-button> 
    <paper-dialog id="vat_check_date_dialog_edit"> 
     <calendar-lite name="date.buyer1.vat_check_date" min-date="2017,3,1"></calendar-lite> 
    </paper-dialog> 
</div>

und in das Polymer

_paperDialogButtonEdit: function (event) { 
//console.log(" event.target = ",event.target.getAttribute('value')); 
var dialog = document.getElementById('vat_check_date_dialog_edit'); 
dialog.toggle(); 
},

Quelle

2017-03-03 10:16:47 user7652818

Polymer-Papier-Dialog wird bei Safari oder Firefox nicht geöffnet

Antwort

Verwandte Themen