jQuery ui droppable funktioniert nicht in PartialView

Bitte, hilf mir. Ich möchte verwenden ziehen & Drop in meinem Projekt, aber Funktion Droppable nicht in PartialView funktioniert.jQuery ui droppable funktioniert nicht in PartialView

Code: _LayoutCreatePage.cshtml

<!DOCTYPE html> 
<html> 
<head> 

     <meta charset="utf-8" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <title>@ViewBag.Title</title> 
     @Styles.Render("~/Content/css") 
     @Scripts.Render("~/bundles/modernizr") 
     @Styles.Render("~/Content/Flags/css/flag-icon.min.css") 
     @Styles.Render("~/Content/Flags/assets/docs.css") 

     @Scripts.Render("~/bundles/jquery") 
     @Scripts.Render("~/bundles/jquery-ui") 
     @Scripts.Render("~/bundles/bootstrap") 
     @RenderSection("Scripts", required: false) 
     <script> 
      $(function() { 
       $('#draggable').draggable(); 

       $('#droppable').droppable({ 
        drop: function() { 
         alert('+'); 
        }, 
       }); 
      }); 
     </script> 
    </head> 
...

CreatePage.cshtml

 @model SiteBuilder.Models.Page 

     @{ 
      ViewBag.Title = "CreatePage"; 
      Layout = "~/Views/Shared/_LayoutCreatePage.cshtml"; 
     } 

      <script> 
       function loadTemplate(e) { 
        $.ajax({ 
         type: 'POST', 
         url: "/SiteBuilder/LoadTemplate", 
         data: { nameTemplate: e.id }, 
         success: function (data) { 
          $("#layout").empty(); 
          $("#layout").html(data); 
          $("#layout").find("div").attr('id', 'droppable'); 
         } 
        }); 
       } 
      </script> 
    ... 

<h4 class="text-center" id="droppable">Type layout:</h4> 
<button id="template1" onclick="loadTemplate(this)">1</button> 
<button id="template2" onclick="loadTemplate(this)">1</button> 
<button id="template3" onclick="loadTemplate(this)">1</button> 

<h4 class="text-center">Add content:</h4> 
<h1 id="draggable">Image</h1> 

<div id="layout"></div> 
...

Methode Loadtemplate:

[HttpPost] 
     public ActionResult LoadTemplate(string nameTemplate) 
     { 
      return PartialView("Template/" + nameTemplate); 
     }

Beispiel Vorlage. Datei Template1.cshtml:

<div class="containerBlocks"> 
    <div class="elements"> 
     <div class="smallBlock"></div> 
     <div class="smallBlock"></div> 
    </div> 
</div> 
<div class="bigBlock"></div>

Quelle

2016-08-07 noobprogrammer

Fügen Sie diese javascript auf Ihre Teilansicht

<script> 
     $(function() { 
      $('#draggable').draggable(); 

      $('#droppable').droppable({ 
       drop: function() { 
        alert('+'); 
       }, 
      }); 
     }); 
    </script>

Quelle

2016-08-07 13:42:12

nicht diese Lösung gearbeitet ( – noobprogrammer

sorry dafür, so versuchen hinzuzufügen jqery src in Beginn Teilansicht –

jQuery ui droppable funktioniert nicht in PartialView

Antwort

Verwandte Themen