图像滑块无法随机工作

时间:2018-04-03 12:26:09

标签: c# jquery asp.net-mvc

我使用jQuery创建了一个Image Slider,但它并不是随机工作的。重新加载页面后,我收到以下错误:

Uncaught TypeError: Cannot read property 'indexOf' of undefined
at i.fn.init.i.fn.load (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at HTMLImageElement.<anonymous> (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at Function.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at i.fn.init.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at HTMLImageElement.<anonymous> (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at Function.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at i.fn.init.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at et (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at ft (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at k (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)

控制器:

 public class SliderController : Controller
{
    // GET: Slider
    public ActionResult Index()
    {
        using (BasDbContext db = new BasDbContext())
        {
            return View(db.gallery.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 != 356))
            //{
            //    ModelState.AddModelError("", "Image resolution must be 800 x 356 pixels");
            //    return View();
            //}

            // Upload your pic
            string pic = System.IO.Path.GetFileName(ImagePath.FileName);

            string path = System.IO.Path.Combine(Server.MapPath(@"\cdm\Content\images\"), pic);
            ImagePath.SaveAs(path);
            using (BasDbContext db = new BasDbContext())
            {
                Gallery gallery = new Gallery { ImagePath = @"\cdm\Content\images\" + pic };
                db.gallery.Add(gallery);
                db.gallery.Add(gallery).DateAdded = gallery.DateAdded = DateTime.Now;
                db.SaveChanges();
            }
        }
        return RedirectToAction("Index");
    }

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

    [HttpPost]
    public ActionResult DeleteImages(IEnumerable<int> ImagesIDs)
    {
        using (BasDbContext db = new BasDbContext())
        {
            try
            {
                foreach (var id in ImagesIDs)
                {
                    var image = db.gallery.Single(s => s.ID == id);
                    string imgPath = Server.MapPath(image.ImagePath);
                    db.gallery.Remove(image);
                    if (System.IO.File.Exists(imgPath))
                        System.IO.File.Delete(imgPath);
                }
                db.SaveChanges();
            }
            catch
            {
                TempData["AlertMessage"] = "Something went wrong, try again";
            }
        }
        return RedirectToAction("DeleteImages");
    }
}

}

指数:

@model IEnumerable<ConcremoteDeviceManagment.Models.Gallery>
@{
    ViewBag.Title = "Index";
    //Layout = "~/Views/Shared/_Layout.cshtml";

}
@if (TempData["AlertMessage"] != null)
{
    <p class="alert alert-danger" id="successMessage">@TempData["AlertMessage"]</p>
}
<h2>Index</h2>
<p>
    <button onclick="location.href='@Url.Action("AddImage", "Slider")';return false; " class="btn btn-primary">Add Image</button>
    <button onclick="location.href='@Url.Action("DeleteImages", "Slider")';return false; " class="btn btn-danger">Delete Image</button>
</p>
@Html.Partial("~/Views/Shared/SliderPartial.cshtml", Model)

SliderPartial:

 <div class="bxslider">
        @foreach (var image in Model)
        {
            <div><img src="@Url.Content(image.ImagePath)" /></div>
        }
</div>
<script>
    $(document).ready(function () {
        $('.bxslider').bxSlider({
            mode: 'fade',
            captions: true,
            slideWidth: 600
        });
    });
</script>

我认为SliderPartial出了问题。 控制器和指数似乎没问题。

我希望有人能够帮助我。 更多信息将在需要时提供

0 个答案:

没有答案