JQuery Draggableメソッドは部分ビューの内部からは利用できません

Question

私は、Divの数がいくつかあり、それぞれがJQuery UIのドラッグ可能なライブラリを使用してドラッグ可能に設定されています。

Jqueryスクリプトはマスターページに読み込まれ、独自のpartialviewを開くと正常に動作します。しかし、私はajaxを使ってメインページにこの部分ビューをロードし、ドロップダウンリストでオプションを選択してトリガします。私はこれを行う、jqueryのコードは、もはや動作し、私はこのエラーを取得する場合：

Uncaught TypeError: Object #<an Object> has no method 'draggable' 

partialviewはjQueryライブラリへのアクセス権を持っていないようですが、私は理由を知りません。

私はドラッグ可能なように設定本部のセットアップを使用していたコードは以下の通りです：

$(function() { 
     $(".NameBox").draggable({ 
      revert: true, 

      start: function (event, ui) { 

       document.onselectstart = function() { return false; }; 

      }, 
      stop: function (event, ui) { 
       document.onselectstart = function() { return true; } 
      } 

     }); 
     $(".NameBox").live(droppable({ 
      accept: '.NameBox', 
      drop: function (event, ui) { 
       alert(ui.draggable.attr("dropped")) 


     }); 
}); 

部分図は、jQueryのロードステートメントを使用してロードされます。

$('#relationships').load('<%= Url.Action("ListRelationshipMappings", "Admin") %>/' + $("#availibleInstances").val()) 

availibleInstancesはそれだけのドロップダウンリストでありますIDフィールドの選択を可能にする。

Answer 1

私はTelerik MVCスクリプト登録オプションを使用してスクリプトをロードしていたため、これはJqueryの独自のバージョンをロードして競合を引き起こしていたためです。これはjqueryのなしTelerikスクリプトをロードするために、以下を使用して

を解決することができます。

<% Html.Telerik().ScriptRegistrar().jQuery(false); %> 

Answer 2

このエラーは、通常、UIのjavascriptライブラリを適切に参照していないために発生します。

Answer 3

私は同じ問題を抱えていたし、私は次のスクリプトは、マスターページに及び部分図でロードされていたが実現しました私は...あなたは二回、スクリプトをロードしないようにしてください

...アヤックスを使用してロードされた

Answer 4

<!--<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>--> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 

たとえば、ライブラリの前にあなたのUIがリストされている場合は、上記のようにこのエラーが表示されます。代わりに、あなたは以下のようにそれを行う：

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<!--<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>--> 

あなたはしません。

ハッピーcodin'; D

と新しい人からの混乱がないだけように、間に何が必要ではない...ただのデモンストレーションのためのコメントアウト片を用いて。