1

申し訳ありませんが、Juice UI の初心者であり、Web アプリの初心者でもあります。Juice UI Web サイトから簡単な例を機能させるのに問題があります。ドラッグ アンド ドロップの例を作成するのがいかに簡単かを示すことになっていますが、本当に基本的な何かが欠けていると思わせる多くのエラーが発生します。ここに記載されているドロップ可能なコントロールを使用しようとしています: http://juiceui.com/controls/droppable

ドラッグ可能な例は問題なく機能したので、そこまでは行きましたが、ドロップ可能な例のテキストを C# Web アプリケーションに貼り付けると、スタイルがフォームの外側、本体の外側などにある必要があるというエラーが表示されます。それを連鎖させます。最終的には、「要素スタイルは親要素にある必要があります」と表示されます-ページに配置できない場合、どこに配置すればよいかわかりません。私は.cssファイルにあると思いますか？また、タグに必要な属性「タイプ」がありません。

どんな助けでも大歓迎です！

<style>
    .draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
    .droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
</style>

<script>
    $(function(){
        $( "#_Default" ).droppable( "option", "drop", function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
            }
        );
    });
</script>

<asp:panel ID="_Draggable" CssClass="draggable ui-widget-content" runat="server">
    <p>Drag me to my target</p>
</asp:panel>
<juice:draggable TargetControlID="_Draggable" runat="server"/>

<asp:panel ID="_Default" CssClass="droppable ui-widget-header" runat="server" ClientIDMode="Static">
    <p>Drop here</p>
</asp:panel>
<juice:droppable TargetControlID="_Default" runat="server"/>
4

2 に答える 2

3

レビューしているドキュメントは部分的なドキュメントです。ドキュメントの残りの部分は既に作成済みであると想定しています。

<!DOCTYPE html>
<html>
  <head>
    <title>Droppable Example</title>
  </head>
  <body>
    <!-- Your Code Here -->
  </body>
</html>
于 2012-05-03T04:16:50.720 に答える
0

さて、ちょっとした調査で次のことが明らかになりました。

  1. 要素は常にセクション内に入ります-当然
  2. type 属性は常に type="text/css" である必要があるため、それを追加しました
  3. (type="text/javascript") の type 属性を追加
  4. 新しい Web アプリケーションを作成するときのデフォルト クラス名と同じ、例の _Default ID と競合する別のエラーがポップアップしました。ユーザーが私が行っていたのとまったく同じように、デフォルトの Web アプリを作成し、コードに貼り付けて、それが実行されることを期待している可能性が高い例の要素 ID の選択が不適切です。

この例を作成したときにこれらのエラーが検出されなかった理由はわかりませんが、Juice UI を初めて使用したときはちょっとイライラしました。お時間とご回答ありがとうございます。

于 2012-05-03T04:39:07.583 に答える