Ajax将图像从文件夹绑定到Datalist的图像控件？ [英] Ajax Bind Images From Folder To Image Controls Of Datalist?

问题描述

如何将应用程序文件夹中的图像（来自数据库的名称）绑定到datalist项目模板的图像控件？



我试过下面



/*asp.net * /

How to bind images from application's folder (which name come from databse) to image controls of datalist item template?

I tried like below

/*asp.net */

<asp:DataList ID="dlImages" runat="server" RepeatColumns="6">
<ItemTemplate>
<a id="imageLink" href='<%# Eval("ImageName","~/images/fabrics/{0}") %>' title='<%#Eval("Descript") %>' rel="lightbox[Brussels]"  runat="server" >
<asp:Image ID="Image1" ImageUrl='<%# Bind("ImageName", "~/images/fabrics/{0}") %>' runat="server" Width="100px" Height="60px" hspace="20px"/><br />
<asp:Label ID="lbl1" runat="server" Text='<%#Eval("ImageAssignedName") %>' Height="30px"></asp:Label>
</a>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" VerticalAlign="Bottom"/>
</asp:DataList>

/ * Jquery Ajax电话* /

/*Jquery Ajax call */

<script type="text/javascript">
$(document).ready(function () {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "WebForm2.aspx/BindDatatable",
data: "{}",
dataType: "json",
success: function (data) {
alert('Hello 1');
for (var i = 0; i < data.d.length; i++) {
alert(data.d[i].ImageAssignedName);
$("#dlImages").append(data.d[i].ImageName + data.d[i].Descript + data.d[i].ImageAssignedName);
}
},
error: function (result) {
alert("Error");
}
});
});
</script>

/ * c＃代码落后* /

/*c# code behind*/

[WebMethod]
public static UserDetails[] BindDatatable()
{
DataTable dt = new DataTable();
List<UserDetails> details = new List<UserDetails>();
using (SqlConnection connnection = new SqlConnection(ConfigurationManager.ConnectionStrings["dbconnection"].ConnectionString.ToString()))
{
using (SqlCommand cmd = new SqlCommand("SELECT Fabrics.ImageName,Fabrics.Descript,ImageAssignedName from Fabrics", connnection))
{
connnection.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
foreach (DataRow dtrow in dt.Rows)
{
UserDetails user = new UserDetails();
user.ImageName = dtrow["ImageName"].ToString();
user.Descript = dtrow["Descript"].ToString();
user.ImageAssignedName = dtrow["ImageAssignedName"].ToString();
details.Add(user);
}
}
}
return details.ToArray();
}
public class UserDetails
{
public string ImageName { get; set; }
public string Descript { get; set; }
public string ImageAssignedName { get; set; }
}

推荐答案

（document）.ready（function（）{

(document).ready(function () {

.ajax（{
类型：POST，
contentType：application / json; charset = utf-8，
url：WebForm2.aspx / BindDatatable，
数据：{}，
dataType：json，
成功：函数（数据）{
alert（'Hello 1'）;
for（var i = 0; i< data.d.length; i ++）{
alert（data.d [i] .ImageAssignedName）;

.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: "WebForm2.aspx/BindDatatable", data: "{}", dataType: "json", success: function (data) { alert('Hello 1'); for (var i = 0; i < data.d.length; i++) { alert(data.d[i].ImageAssignedName);

（＃dlImages）。append（ data.d [i] .ImageName + data.d [i] .Descript + data.d [i] .ImageAssignedName）;
}
}，
error：function（result）{
alert（错误）;
}
}）;
}）;
< / script>

("#dlImages").append(data.d[i].ImageName + data.d[i].Descript + data.d[i].ImageAssignedName); } }, error: function (result) { alert("Error"); } }); }); </script>

/ * c＃代码落后* /

/*c# code behind*/

[WebMethod]
public static UserDetails[] BindDatatable()
{
DataTable dt = new DataTable();
List<UserDetails> details = new List<UserDetails>();
using (SqlConnection connnection = new SqlConnection(ConfigurationManager.ConnectionStrings["dbconnection"].ConnectionString.ToString()))
{
using (SqlCommand cmd = new SqlCommand("SELECT Fabrics.ImageName,Fabrics.Descript,ImageAssignedName from Fabrics", connnection))
{
connnection.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
foreach (DataRow dtrow in dt.Rows)
{
UserDetails user = new UserDetails();
user.ImageName = dtrow["ImageName"].ToString();
user.Descript = dtrow["Descript"].ToString();
user.ImageAssignedName = dtrow["ImageAssignedName"].ToString();
details.Add(user);
}
}
}
return details.ToArray();
}
public class UserDetails
{
public string ImageName { get; set; }
public string Descript { get; set; }
public string ImageAssignedName { get; set; }
}

这篇关于Ajax将图像从文件夹绑定到Datalist的图像控件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！