【发布时间】：2016-07-26 18:19:24
【问题描述】：
我现在正在使用 Visual Studio 制作网站。 我的目标是将图像上传到数据库（不是 ASP.net 中的本地数据库）并显示该数据库中的图像。 这里最重要的是图像应该以图像滑块的形式显示。
现在我已经完成了将图像上传到数据库并使用 dataTable 显示图像。 另外，另外，我找到了一个很好的图像滑块代码。 但是，使用该代码（图像滑块）我只能在本地文件夹中显示图像，而不是数据库。
所以我想知道是否可以将这些连接到代码？ 我附上了两个代码。
http://www.codeproject.com/Tips/1010313/Image-Slider-From-Folder-Without-Database-in-MVC -> 这是图片滑块
下面是上传图片到数据库并在dataTable中显示的代码
(handler.ashx)
public void ProcessRequest(HttpContext context)
{
string connectionString = "";
MySqlConnection myConnection = new MySqlConnection (connectionString);
myConnection.Open();
string sql = "Select Content, ContentType from table where FileId=@FileId";
MySqlCommand cmd = new MySqlCommand(sql, myConnection);
cmd.Parameters.Add("@FileId", MySqlDbType.Int16).Value = context.Request.QueryString["id"];
cmd.Prepare();
MySqlDataReader dr = cmd.ExecuteReader();
dr.Read();
context.Response.ContentType = dr["ContentType"].ToString();
context.Response.BinaryWrite((byte[])dr["Content"]);
dr.Close();
myConnection.Close();
}
public bool IsReusable
{
get
{
return false;
}
}
}
(webform.aspx)
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="Upload" runat="server" Text="upload" OnClick="UploadFile"/>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField HeaderText="File Id" DataField="FileId" />
<asp:BoundField HeaderText="File Name" DataField="FileName" />
<asp:TemplateField HeaderText = "Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" Height="100" Width="100" ImageUrl='<%#"Handler.ashx?id=" + Eval("FileId")%>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
(webform.aspx.cs)
public partial class WebForm1 : System.Web.UI.Page
{
string connectionString = "";
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GridView1.DataSource = FetchAllImagesInfo();
GridView1.DataBind();
}
}
protected void UploadFile(object sender, EventArgs e)
{
string filename = Path.GetFileName(FileUpload1.PostedFile.FileName);
string contentType = FileUpload1.PostedFile.ContentType;
using (Stream fs = FileUpload1.PostedFile.InputStream)
{
using (BinaryReader br = new BinaryReader(fs))
{
byte[] bytes = br.ReadBytes((Int32)fs.Length);
using (MySqlConnection con = new MySqlConnection(connectionString))
{
string query = "INSERT INTO table(FileName, ContentType, Content) VALUES (@FileName, @ContentType, @Content)";
using (MySqlCommand cmd = new MySqlCommand(query))
{
cmd.Connection = con;
cmd.Parameters.AddWithValue("@FileName", filename);
cmd.Parameters.AddWithValue("@ContentType", contentType);
cmd.Parameters.AddWithValue("@Content", bytes);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
Response.Redirect(Request.Url.AbsoluteUri);
}
public DataTable FetchAllImagesInfo()
{
MySqlDataAdapter da = new MySqlDataAdapter("Select * from table", "Data Source=;");
DataTable dt = new DataTable();
da.Fill(dt);
return dt;
}
}
如果很难将这两者结合起来， 方法也可以告诉我
下面是滑块的代码 有了这个，它没有连接到数据库，它只是上传图片而不使用数据库，但我想要做的是将图像上传到数据库并以图像滑块格式从数据库显示
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" href="bjqs.css"/>
<link href='http://fonts.googleapis.com/css? family=Source+Code+Pro|Open+Sans:300' rel='stylesheet' type='text/css'/>
<link rel="stylesheet" href="demo.css"/>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/bjqs-1.3.min.js">
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="container">
<h2>Image slider</h2>
<div id="banner-fade">
<!-- start Basic Jquery Slider -->
<ul class="bjqs">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<li>
<img src='<%# DataBinder.Eval Container.DataItem,"Value") %>' title='<%# (DataBinder.Eval (Container.DataItem,"Text").ToString()).Split('.')[0].ToString() %>' alt=""></li>
</ItemTemplate>
</asp:Repeater>
</ul>
<!-- end Basic jQuery Slider -->
</div>
<script class="secret-source" style="display:none;">
jQuery(document).ready(function ($) {
$('#banner-fade').bjqs({
height: 320,
width: 620,
responsive: true
});
});
</script>
</div>
<script src="js/libs/jquery.secret-source.min.js"></script>
<script>
jQuery(function ($) {
$('.secret-source').secretSource({
includeTag: false
});
});
</script>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
namespace _imageslider
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string[] filePaths = Directory.GetFiles(Server.MapPath("~/img/"));
List<ListItem> files = new List<ListItem>();
foreach (string filePath in filePaths)
{
string fileName = Path.GetFileName(filePath);
files.Add(new ListItem(fileName, "img/" + fileName));
}
Repeater1.DataSource = files;
Repeater1.DataBind();
}
}
}
【问题讨论】：
-
什么不起作用？您收到错误消息吗？您的滑块代码在哪里？
-
@Alexander 用于图像滑块我使用来自“codeproject.com/Tips/1010313/…”的代码问题是我无法将这两件事结合起来。
-
向我们展示您的代码。
-
@Alexander 我在下面附加了附加代码
-
@Alexander 我想要做的是将图像上传到数据库并以图像滑块形式从数据库显示。我只是可以将图像上传到数据库，但我不知道以滑块形式显示它的方式
标签： jquery asp.net database image slider