مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

کاربر سایت

laleh_456

عضویت از 1395/10/06

drag&drop در mvc

  • چهارشنبه 20 اردیبهشت 1396
  • 19:22
تشکر میکنم

سلام دوستان من طبق این اموزش جلو رفتم.اما تابع loadproduct کار نمیکنه دیتاها وارد تابع میشن، اما چیزی در ویو نشون نمیده.من خودم یه li دستی به ستونها دادم اما بازم خاصیت درگ فعال نیست.ممنون میشم راهنمایی کنید؟

https://barnamenevisan.org/Articles/Article2502.html

پاسخ های این پرسش

تعداد پاسخ ها : 4 پاسخ
کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • پنجشنبه 21 اردیبهشت 1396
  • 10:18

به احتمال زیاد مشکل از رفرنس های جی کوئری هست

من نمونه رو بررسی کردم و مشکلی نداشت

کاربر سایت

laleh_456

عضویت از 1395/10/06

  • پنجشنبه 21 اردیبهشت 1396
  • 10:50
<script src="@Url.Content("~/Content/js/jquery.min.js")"></script>
   <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
     <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")"></script>
  <script src="@Url.Content("~/Scripts/Noty/jquery.noty.js")"></script>
  <script src="@Url.Content("~/Content/js/bootstrap.min.js")"></script>

ممنون.من این رفرنسها رو به پروژه اد کردم

کاربر سایت

laleh_456

عضویت از 1395/10/06

  • پنجشنبه 21 اردیبهشت 1396
  • 14:44

من از مقاله بالا استفاده کردم و فقط بجای ساخت api یه متد در اکشنم ساختم.ولی هیچ مقدار برگشتی ندارم.ممنون میشم راهنمایی بفرمایید

اینم ازکدهام:

کدهای AdminController:

    public ActionResult SelectStuff()
        {
            return View();

        }
        [HttpGet]
        public IEnumerable<Stuff> SelectStuff2()
        {
            var list = db.Stuffs.ToList();
            return list;

        }

​کد ویوی SelectStuff:


@{
    ViewBag.Title = "SelectStuff";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
}

<style type="text/css">
    table, td {
        background-color: azure;
        border: double;
    }

    #dvright, #dvleft {
        background-color: azure;
        height: 200px;
        width: 300px;
    }
</style>
<table>
    <tr>
        <td>
            <h1>Product List</h1>
        </td>
        <td>
            <h1>Selected Products</h1>
        </td>
    </tr>
    <tr>
        <td>
            <div id="dvleft">
                <ul id="lstproducts"></ul>
            </div>
        </td>
        <td>
            <div id="dvright">
                <ul id="lstselectedproducts"></ul>
            </div>
        </td>
    </tr>
</table>

@section scripts{

    <script type="text/javascript">
        $(document).ready(function () {

            loadProducts();

            //Function to set events for Drag-Drop
            function setEvents() {
                var lstProducts = $('li');
                //Set Drag on Each 'li' in the list
                $.each(lstProducts, function (idx, val) {
                    $('li').on('dragstart', function (evt) {
                        evt.originalEvent.dataTransfer.setData("Text", evt.target.textContent);
                        evt.target.draggable = false;
                    });
                });

                //Set the Drop on the <div>
                $("#dvright").on('drop', function (evt) {
                    evt.preventDefault();
                    var data = evt.originalEvent.dataTransfer.getData("Text");
                    var lst = $("#lstselectedproducts");
                    var li = "<li>" + data + "</li>";
                    li.textContent = data;
                    lst.append(li);
                });

                //The dragover
                $("#dvright").on('dragover', function (evt) {
                    evt.preventDefault();
                });
            }

            ///Function to load products using call to WEB API
            function loadProducts() {
                var items = "";
                $.ajax({
                    url: "/Admin/SelectStuff2",
                    type: "GET"
                }).done(function (resp) {
                    alert(resp);
                    $.each(resp, function (idx, val) {
                        items += "<li draggable='true'>" + val.Name+ "</li>";
                    });
                    $("#lstproducts").html(items);
                    setEvents();
                }).error(function (err) {
                    alert("Error! " + err.status);
                });
            }
        });
</script>
}

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • پنجشنبه 21 اردیبهشت 1396
  • 16:28

باید اکشن شما Json برگردونه تا کار کنه

کاربرانی که از این پست تشکر کرده اند

هیچ کاربری تا کنون از این پست تشکر نکرده است

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید

با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)