1suli0 Ответов: 0

Картинная галерея с bxslider в MVC5

Я пытаюсь создать простую фотогалерею с помощью BxSlider и реализовал функцию добавления и удаления, но слайдер не показывает изображения после загрузки страницы,а показывает только белое поле, и я понятия не имею, в чем проблема.

Это контроллер:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Vrtic_2546.Models;

namespace Vrtic_2546.Controllers
{
    public class GalerijaController : Controller
    {
        // GET: Slider
        public ActionResult Index()
        {
            using (VrticModel db = new VrticModel())
            {
                return View(db.Galerija.ToList());
            }
            //return View();
        }

        //Add Images in slider

        public ActionResult AddImage()
        {
            return View();
        }

        [HttpPost]
        public ActionResult AddImage(HttpPostedFileBase ImagePath)
        {
            if (ImagePath != null)
            {
                // You can skip this block, because it is only to force the user to upload specific resolution pics
                System.Drawing.Image img = System.Drawing.Image.FromStream(ImagePath.InputStream);
                if ((img.Width != 800) || (img.Height != 600))
                {
                    ModelState.AddModelError("", "Image resolution must be 800 x 600 pixels");
                    return View();
                }

                // Upload your pic
                string pic = System.IO.Path.GetFileName(ImagePath.FileName);
                string path = System.IO.Path.Combine(Server.MapPath("~/Content/Images"), pic);
                ImagePath.SaveAs(path);
                using (VrticModel db = new VrticModel())
                {
                    Galerija gallery = new Galerija { putanja = "~/Content/Images/" + pic };
                    db.Galerija.Add(gallery);
                    db.SaveChanges();
                }
            }
            return RedirectToAction("Index");
        }

        // Delete Multiple Images
        public ActionResult DeleteImages()
        {
            using (VrticModel db = new VrticModel())
            {
                return View(db.Galerija.ToList());
            }
        }

        [HttpPost]
        public ActionResult DeleteImages(IEnumerable<int> ImagesIDs)
        {
            using (VrticModel db = new VrticModel())
            {
                foreach (var id in ImagesIDs)
                {
                    var image = db.Galerija.Single(s => s.ID == id);
                    string imgPath = Server.MapPath(image.putanja);
                    db.Galerija.Remove(image);
                    if (System.IO.File.Exists(imgPath))
                        System.IO.File.Delete(imgPath);
                }
                db.SaveChanges();
            }
            return RedirectToAction("DeleteImages");
        }
    }

}


Это взгляды:

Добавление:

@model Vrtic_2546.Models.Galerija
@{
    ViewBag.Title = "AddImage";
}

<h2>AddImage</h2>
@using (Html.BeginForm("AddImage", "Galerija", FormMethod.Post,
                                                    new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Gallery</legend>

        <div class="editor-label">
            Upload Image
        </div>
        <div class="editor-field">
            <input type="file" id="ImagePath" name="ImagePath" />
        </div>
        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
    <p>@Html.ActionLink("Slider Home", "Index", "Slider")</p>
}


Удаление:

@{
    ViewBag.Title = "DeleteImages";
}

<h2>DeleteImages</h2>
@using (Html.BeginForm("DeleteImages", "Galerija", FormMethod.Post))
{
    <table style="background-color:azure" border="1">
        <thead style="background-color:gray">
            <tr>
                <th>Select</th>
                <th>Image</th>
            </tr>
        </thead>
        <tbody>
            @Html.EditorForModel()
        </tbody>
    </table>
    <input type="submit" value="Delete Selected Images" />
}
<p>@Html.ActionLink("Slider Home", "Index", "Slider")</p>


Индекс:

@model IEnumerable<Vrtic_2546.Models.Galerija>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_GalerijaLayout.cshtml";
}

<h2>Galerija</h2>
<p>
    @Html.ActionLink("Povratak na Naslovnu", "Index", "Home")
    @*@Html.ActionLink("Add Image", "AddImage", "Galerija", new { id = "linkAddimage" }, null) |
    @Html.ActionLink("Delete Image", "DeleteImages", "Galerija", new { id = "linkDeleteImage" }, null)*@
</p>
@Html.Partial("~/Views/Shared/SliderPartial.cshtml", Model)


Частичный:

<div>
    <ul id="slider">
        @foreach (var image in Model)
        {
            <li></li>
        }
    </ul>
</div>

<script>

$(document).ready(function () {
        $('#slider').bxSlider({
        });
        $('.bx-wrapper').width('70%');
    });

</script>


Что я уже пробовал:

Я пробовал много настроек, но все равно безуспешно.

0 Ответов