Show images in DataGrid

xiaoxiao2021-03-06  109

Creating a Dadagrid template column

Dadagrid is a very important control in ASP.NET programming, which provides great convenience for improving its expression. In addition to direct binding to the data source, we can also customize the column of the DataGrid through the column binding template to display data according to the format we set.

For example, there is a field f_demoImage in the data table to store the path of the image (including the image file name), in order to display the actual picture in the DataGrid Cell, we can define a template column, then give the column to the value of the field f_demoimage, You can display pictures in the DataGrid Cell.

Webform1.aspx file:

<% @ Page language = "c #" codebehind = "wizard_select_template.aspx.cs" autoeventwireup = "false" inherits = "Webhatcher.Webform1"%>

Webform1 </ Title></p> <p><meta content = "Microsoft Visual Studio .NET 7.1" Name = Generator></p> <p><meta content = c # Name = code_language></p> <p><meta content = javascript name = vs_defaultclientscript></p> <p><meta content = http://schemas.microsoft.com/intellisense/ie5 name = vs_targetschema></p> <p><Link href = "./ styles / style.css" type = text / css rel = stylesheet></p> <p></ HEAD></p> <p><body ms_positioning = "gridLayout"></p> <p><form id = form1 method = post runat = "server"></p> <p><ask: DataGrid ID = DataGrid1 runat = "server" autogeneratecolumns = "false" width = "744px"></p> <p><Columns></p> <p><ask: templatecolumn></p> <p><Itemtemplate></p> <p><ask: image id = "image1" imageurl = '<% # databinder.eval (Container, "DataItem.f_demoImage")%>' Runat = "Server"> </ asp: image></p> <p></ Itemtemplate></p> <p></ asp: templateColumn></p> <p></ Columns></p> <p></ ask: DataGrid></p> <p></ form></p> <p></ body></p> <p></ Html></p> <p>//Webform1.aspx.cs file: using system;</p> <p>Using system.collections;</p> <p>Using system.componentmodel;</p> <p>Using system.data;</p> <p>Using system.drawing;</p> <p>Using system.Web;</p> <p>Using system.Web.SessionState;</p> <p>Using system.Web.ui;</p> <p>Using system.Web.ui.webcontrols;</p> <p>Using system.Web.ui.htmlcontrols;</p> <p>Using mydbaccess; // My namespace</p> <p>Namespace Web Hatcher</p> <p>{</p> <p>/// <summary></p> <p>/// WebForm1 summary description.</p> <p>/// </ summary></p> <p>Public class Webform1: System.Web.ui.page</p> <p>{</p> <p>Protected system.web.ui.webcontrols.dataGrid DataGrid1;</p> <p>Private Void Page_Load (Object Sender, System.EventArgs E)</p> <p>{</p> <p>/ / Place the user code here to initialize the page</p> <p>IF (page.ispostback)</p> <p>{}</p> <p>Else</p> <p>{</p> <p>// Display data in DataGrid (including images):</p> <p>MyTableAccess Odbtable = new myTableAccess (); // myTableAccess I am a defined database access class</p> <p>Odbtable.sdbpath = server.mappath ("./ Webhatcher.mdb");</p> <p>Odbtable.spassword = ""</p> <p>Odbtable.ssql = "select * from tabtemplate"; // tabTemplate is a data sheet containing the f_demoimage field</p> <p>DataGrid1.datasource = ODBTABLE.ReadFromTable ();</p> <p>DataGrid1.databind ();</p> <p>}</p> <p>}</p> <p>#Region web form designer generated code</p> <p>Override protected void oninit (Eventargs E)</p> <p>{</p> <p>// Codegen: This call is necessary for the ASP.NET Web Form Designer.</p> <p>InitializationComponent ();</p> <p>Base.onit (e);</p> <p>}</p> <p>/// <summary></p> <p>/// Designer supports the required method - do not use the code editor to modify the contents of this method.</p> <p>/// </ summary></p> <p>Private vidinitiRizeComponent ()</p> <p>{</p> <p>This.Load = New System.EventHandler (this.page_load);</p> <p>}</p> <p>#ndregion</p> <p>}</p> <p>}</p> <p>// Data Access Class definition:</p> <p>Using system;</p> <p>Using system.data;</p> <p>Using system.data.oledb;</p> <p>Namespace mydbaccess</p> <p>{</p> <p>/// Data Stock Namespace:</p> <p>/// Category Name: MyTableAccess</p> <p>/// Attributes:</p> <p>/// SDBPATH database path (including database file name)</p> <p>/// spassword database password</p> <p>/// ssql sql statement</p> <p>Public class myTableAccess</p> <p>{</p> <p>// Declare 3 properties (domain):</p> <p>Public String SDBPath = ""</p> <p>Public string spassword = ""; public string ssql = "";</p> <p>Private oledbconnection Oconn;</p> <p>Public void Opendb ()</p> <p>{</p> <p>Oconn = new oledbconnection ("provider = microsoft.jet.Oledb.4.0; data source =" sdbpath "; password =" spassword ";")</p> <p>Oconn.open ();</p> <p>}</p> <p>Public void closedb ()</p> <p>{oconn.close ();</p> <p>Public DataView ReadFromTable ()</p> <p>{</p> <p>OpenDB ();</p> <p>OLEDBDATADAPTER OADP = New OLEDBDataAdapter (SSQL, Oconn);</p> <p>DataSet OdtSt = New Dataset ();</p> <p>OADP.FILL (ODTST, "ATABLE");</p> <p>Closedb ();</p> <p>Return Odtst.Tables ["atable"]. defaultView; // Return to the default view</p> <p>}</p> <p>}</p> <p>}</p> <p>Zhang Qingzhangking@263.net</p> <p>http://www.why100000.com</p> <p>http://soft.why100000.com</p> <p>QQ: 9365852</p> <p>2004.5.28</p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-100087.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="100087" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.050</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = '96uFAlGJDCdEGe1VZNn_2FbWQOqo4xgWWpRlusTKYm5BLTZ0BAyDSmJUS5pRabTflYeZEE5EcUa0Zb5XOagD0WWQ_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>