PrimeUI - どのように動作させるには？

私はPrimeUIを初めて使い、PrimeUI QuickStartガイドの手順に従おうとしました。 1つの段落からPrimeUI - どのように動作させるには？

：

In order to use PrimeElements, add X-Tag library that also includes the pollyfill for custom elements.

<script type="text/javascript"src="%PATH%/x-tag-core.min.js"></script> 
<script type="text/javascript" src="%PATH%/primeelements-3.0.js"></script>

が、PrimeUIダウンロードパッケージにはprimeelements-3.0.jsが含まれていません。私はそのファイルを入手することができますか？

例を参照してください。私はPrimeElementsからのコードを使用しようとしました - Webコンポーネントは

<button type="button" is="p-button" icon="fa-external-link" onclick="document.getElementById('dlgelement').show()" >Show</button> 


<p-dialog id="dlgelement" title="Dialog Header" modal showeffect="fade" hideeffect="fade" draggable resizable> 
    <p>Dialog content here.</p> 
</p-dialog>

を、最終的な効果は私が原因のエラー

primeui.min.js:3 Uncaught TypeError: t(...).zIndex is not a function 
    at HTMLDocument.<anonymous> (http://localhost/lib/primeui.min.js:3:9501) 
    at HTMLDocument.dispatch (http://localhost/lib/jquery.js:4732:27) 
    at HTMLDocument.elemData.handle (http://localhost/lib/jquery.js:4544:28)

にそれを閉じることができるダイアログボックスを開くことはできませんが、ということです私はから他のコード例を試してみましたtheir showcaseしかし、私は仕事の約10％を持っている。

私は何が欠けていますか？

出典

2016-11-16 JackTheKnife

が、私は 'primeelements.js'と' primeelements.min.js'右を参照してくださいジップ。あなたはこれらを見ていませんか？ – Twisty

私はDialogサンプルコードに基づいてPlunkerを作成しましたが、PrimeElementコードを実行しませんでした。これはQuick StartとDialog例をオフに基づいています

<!DOCTYPE html> 
<html> 

<head> 
    <link rel="stylesheet" href="theme.css" /> 
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> 
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" /> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/primeui/4.1.15/primeui.min.css" /> 
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.js"></script> 
    <script type="text/javascript" src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/primeui/4.1.15/primeui.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/x-tag/1.5.11/x-tag-core.min.js"></script> 
    <script type="text/javascript" src="primeelements.js"></script> 
</head> 

<body> 
    <button id="btn-show" type="button" onclick="document.getElementById('dlgelement').show()" is="p-button" icon="fa-external-link-square">PrimeElement</button> 

    <p-dialog id="dlgelement" title="Title of Dialog" modal> 
    content here 

    <script type="x-facet-buttons"> 
     <button type="button" is="p-button" icon="fa-check" onclick="document.getElementById('dlgelement').hide()">Yes</button> 
     <button type="button" is="p-button" icon="fa-close" onclick="document.getElementById('dlgelement').hide()">No</button> 
    </script> 
    </p-dialog> 
</body> 

</html>

のindex.html：ここでは私が作成した例（https://plnkr.co/edit/WMawVdtcvDpmVxzI4b3Q?p=previewバージョン3）があります。

私はjQueryの初期化を追加した後にしか動作させることができませんでした。

<script> $(function(){ $('#dlgelement').puidialog(); $('#btn-show').click(function(){ $('#dlgelement').show(); }); }); </script>

はここで働い：（バージョン5）https://plnkr.co/edit/WMawVdtcvDpmVxzI4b3Q?p=preview

それはPrimeUIのバグかもしれません。あなたはPlunkerのために自分のコードをテストすることができます。

更新

私はこれ以上にいじくり回すとして、私は前にPrimeUIを使用していないので、私は彼らのコード例を一致させるために、私のPlunkerを更新しました。ダイアログを閉じると、あなたが説明したエラーが発生します。

TypeError: t(...).zIndex is not a function

...nd(this.blockEvents,function(i){return t(i.target).zIndex()<e.element.zIndex()?!...

primeui.min.js (line 3, col 9489)

私は非最小化バージョンに切り替えて得た：

TypeError: $(...).zIndex is not a function

if ($(event.target).zIndex() < $this.element.zIndex()) {

primeui.js (line 4116, col 29)

.zIndex()は、jQueryのUIの要素であり、すでにロードされている必要があります。このエラーは、PrimeUIの何かがそれを正しく使用していないか無効にしていることを示唆しています。

出典

2016-11-16 23:51:17 Twisty

正確に - PrimeUI 4.xライブラリまたはそのドキュメントに問題があります（最新ではありません）。私はバージョン3に戻って、そこにあった要素はバージョン4 – JackTheKnife

@ JackTheKnifeと比較して約75％で作業しています。私は彼らのGitHubを参照して、そこにいくつか報告します。私はprimeui.jsでプランクカーをフォークし、そのコードセクションで微調整しようとしました。私が見つけたのは、jQueryオブジェクトとして表示されないようです。したがって、 '.zIndex（）'は呼び出せません。そのオブジェクトの関数ではありません。私は以前のコードに戻って、これが別のやりかたで処理されるかどうかを確認し、その機能のためにコードをロールバックすることができます。 – Twisty

はPrimeUIのlatest releaseをダウンロードして、HTMLにファイルをprimeui-all.min.jsとprimeui-all.min.cssをインポートします。それらには必要なライブラリが組み込まれています（jQuery、jQuery-UI ...）。これが完了すると、エラーは消えます。ここ作業

：私はGitHubのオフ最新リリースをダウンロードするとplnkr.co/edit/y0zevrqyTpVpxdS4Yr1x?p=preview

出典

2018-02-05 13:08:40 Nikofoxxx

PrimeUI - どのように動作させるには？

答えて

関連する問題