I am facing very rear problem. I am trying to bind images path from database using listview control. Listview gets bind but img is not showing up. When I look at inspect I cant's see src attribute in img tag. Listview gets bind perfectly and path is also correct. If you see below screenshot & see the highlighted line which is that img tag which is missing src attribute.
<div class="row">
<asp:ListView ID="subCategoriesList" runat="server">
<ItemTemplate>
<div class="col-md-3">
<img id="myimag" runat="server" src='<%# Eval("icon") %>' />
<br /><%# Eval("name") %>
</div>
</ItemTemplate>
</asp:ListView>
</div>
ListviewBind Code
private void bindSubCatgoriesRightSide()
{
try {
string constr = ConfigurationManager.ConnectionStrings("conio2").ConnectionString;
using (MySqlConnection con = new MySqlConnection(constr)) {
using (MySqlCommand cmd = new MySqlCommand()) {
cmd.CommandText = "SELECT * FROM subcategory WHERE type = 'product' and category = 'mobile' and status = 'active'";
cmd.Connection = con;
using (MySqlDataAdapter sda = new MySqlDataAdapter(cmd)) {
DataTable dt = new DataTable();
sda.Fill(dt);
subCategoriesList.DataSource = dt;
subCategoriesList.DataBind();
}
}
}
} catch (Exception ex) {
Response.Write(ex);
}
}
I think you're looking at the wrong output section, in your listview item template, you are wrapping the image in <div class="col-md-3"></div ...
but in the screenshot, the image is wrapped in <div class="col-md-6 col-sm-6 col-xs-12 margin-bottom"></div
Unless you are changing the classes with JS
Related
I am doing a little school project with ASP.NET, and I'm trying to get all products from the Database, show it and have "Add to card" button for every one of them. I managed to do all this, except adding the button. I have a function that gets all the products and I'm binding it with ASP Repeater. The problem is, when I try to add a button, it says that I need to use the form tag first, when I add the form tag it says it needs to have runat="server", but when I add it, it says I can't have more than one runat="server". The Repeater tag is using it also, and I'm stuck. Can anyone suggest something? Thank you!
private void bindPopularProducts()
{
String CS = ConfigurationManager.ConnectionStrings["DatabaseConnectionString1"].ConnectionString;
using (SqlConnection con = new SqlConnection(CS))
{
using (SqlCommand cmd = new SqlCommand("SELECT * FROM Food", con))
{
using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
{
DataTable fFood = new DataTable();
sda.Fill(fFood);
popularFood.DataSource = fFood;
popularFood.DataBind();
}
}
}
}
and this
<asp:Repeater ID="popularFood" runat="server">
<ItemTemplate>
<div class="col-md-4">
<div><%# Eval("name") %></div>
<div><asp:Image ID="foodImage" runat="server" ImageUrl='<%# "~/images/food/" + Eval("image").ToString() %>' Visible="true" CssClass="img-responsive" /></div>
<div>
<div class="col-md-4 text-left"><%# "$"+Eval("price_small")+"/small" %></div>
<div class="col-md-8 text-right">
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
I'm trying to put the button inside the text-right div
Within your Repeater's ItemTemplate, add a button. In the button, set the CommandArgument to some key value that uniquely identifies the product.
<asp:Button ID="Button1" runat="server" Text="Click Me" CommandArgument='<%# Eval("Product.Key") %>' OnClick="Button1_Click" />
In your code, the event handler can use the button's CommandArgument to get the product key and execute your "Add to card" method.
protected void Button1_Click(object sender, EventArgs e)
{
string myProductKey;
// Use "myProductKey" to do something with the Product record...
myProductKey = ((Button)sender).CommandArgument;
}
My problem is when I click on the product page (in URL below). It works good but after some idle time on first click on product menu it wont load product images from database to Repeater control.
I am using Bootstrap and not using update-panel.
Please Refer Below Link.
MySite(See Product Page On First Time And Click After 5 to 10 minute of idle time)
My ASP.net code is
<asp:Repeater ID="rptrProduct" runat="server">
<ItemTemplate>
<div class="portfolio-item col-xs-12 col-sm-4 col-md-3">
<div class="recent-work-wrap hovereffect">
<img id="dtimg1" runat="server" class="img-responsive imggray" src='<%#Eval("ImagePath")%>' alt="" style="height: 185px!Important;" />
<div class="overlay1">
<div class="recent-work-inner">
<a id="aimg2" runat="server" href='<%#Eval("ImagePath")%>' rel="prettyPhoto">
<h2>
<%#Eval("ProductName")%></h2>
</a>
<p>
<a id="adtimg1" runat="server" class="preview" href='<%# string.Format("~/BMSubProduct.aspx?pro={0}", Eval("ProductId")) %>'>
<i class="fa fa-eye"></i>View Products</a>
</p>
</div>
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
I am just not getting that why on first time it won't load any images.
my C# page code is
if(!Page.IsPostBack)
{
DataTable dt = DBMaster.getQueryDataTableSchema(query);
if (dt.Rows.Count > 0)
{
string path = GlobalFunction.getPath(1);
NoProducts.Visible = false;
for (int i = 0; i < dt.Rows.Count; i++)
dt.Rows[i]["ImagePath"] = path + Convert.ToString(dt.Rows[i] ["ImagePath"]);
rptrProduct.DataSource = dt;
rptrProduct.DataBind();
}
else
{
NoProducts.Visible = true;
rptrProduct.DataSource = null;
rptrProduct.DataBind();
}
}
public static DataTable getQueryDataTableSchema(string query)
{
try
{
using (IDbConnection con = sq.Open())
{
IDbCommand cmd = con.CreateCommand();
cmd.CommandText = query;
IDbDataAdapter adp = sq.GetAdapter(cmd);
DataSet ds = new DataSet();
adp.FillSchema(ds, SchemaType.Source);
adp.Fill(ds);
con.Close();
return ds.Tables[0];
}
}
catch (Exception ex)
{
return new DataTable();
}
}
and masterpage code in page_load is
if (!Page.IsPostBack)
{
SQLString.Config = myconnectionString;
}
Here NoProduct => No Products Are Available Right Now.
I have tried many things like below:
EnableViewState="true" And EnableViewState="false" both for repeater and in page also.
Change connection string in web.config like
name="SQLConStr" connectionString="Server=localhost;Database=databasename; Uid = username; Pwd = password; Pooling = false; Connection Timeout = 30"
Here tried with and without connection timeout and pooling.
Note: Using MySQL database and using interface to open database connection.
Thanks in advance.
EnableViewState="true"
and try to use
<asp:Image and <asp:HyperLink controls
instead of
img and a tags with runat="server".
I am working in custom detailed view. I have a program page that views all the program. When a user clicks on update button, the user is redirected to manage programs page. The Manage Programs Page contains a method that fetches all the rows from.
public string ProgramsDetails()
{
using (SqlConnection con = new SqlConnection(str))
{
string htmlStr = "";
SqlCommand cmd = con.CreateCommand();
cmd.CommandText = " SELECT * from programs where ProgId=#ProgId";
cmd.Parameters.AddWithValue("#ProgId", "1");
con.Open();
SqlDataReader reader = cmd.ExecuteReader();
if (reader.Read())
{
int ProgId = reader.GetInt32(0);
string ProgTitle = reader.GetString(1);
string ProgBudget = reader.GetString(4);
string ProgStarDate = reader.GetString(5);
}
con.Close();
return htmlStr;
}
}
How can I access a variable from .aspx page? Lets say I would like to access ProgTitle.
I have used this method but seems it's not working
<%=ProjTitle%>
I would like to show the values of each column in there respected text box
<div class="cmrs-panel-body no-padding">
<div class="cmrs-form-inline">
<div class="cmrs-form-row bordered">
<label class="cmrs-form-label">Program Code Name</label>
<div class="cmrs-form-item">
<input type="text" name="Code" class="large">
</div>
</div>
</div>
<div class="cmrs-form-inline">
<div class="cmrs-form-row bordered">
<label class="cmrs-form-label">Program Title</label>
<div class="cmrs-form-item">
<input type="text" name="Title" class="large" value="<%=ProgTitle %>">
</div>
</div>
</div>
<div class="cmrs-form-inline">
<div class="cmrs-form-row bordered">
<label class="cmrs-form-label">Program Description</label>
<div class="cmrs-form-item">
<textarea class="large"></textarea>
</div>
</div>
</div>
</div>
Normally i would add the html code to method but this is not feasible so i want to get the variable value and display it in textbox.
htmlStr+="<table><tr><td>"+ProgTitle+"</td></tr></table>";
ProgTitle must be declared as protected or public in the code behind to make it accessible from .aspx. Change your code as below
protected string ProgTitle;
public string ProgramsDetails()
{
using (SqlConnection con = new SqlConnection(str))
{
string htmlStr = "";
SqlCommand cmd = con.CreateCommand();
cmd.CommandText = " SELECT * from programs where ProgId=#ProgId";
cmd.Parameters.AddWithValue("#ProgId", "1");
con.Open();
SqlDataReader reader = cmd.ExecuteReader();
if (reader.Read())
{
int ProgId = reader.GetInt32(0);
ProgTitle = reader.GetString(1);
string ProgBudget = reader.GetString(4);
string ProgStarDate = reader.GetString(5);
}
con.Close();
return htmlStr;
}
}
then you can access ProgTitle in your aspx code
<input type="text" name="Title" class="large" value="<%=ProgTitle %>">
If not using databinding, how about using session and allocate the variable then use it. On code Behing: SESSION.START(); SESSION["PjTitle"]=PrgTtile;
and then in aspx acces it with: <%= SESSION["PjTitle"] %>
I have this code:
$(document).ready(function () {
$('#Priroda').hide();
$('#priroda_').click(function () {
$('#Znamenitosti').hide();
$('#Priroda').show();
});
$('#znamenitosti_').click(function () {
$('#Priroda').hide();
$('#Znamenitosti').show();
});
});
</script>
<div class="meni">
<nav>
<ul>
<li class="active">Info</li>
<li>Znamenitosti</li>
<li>Priroda</li>
<li>Noken Zivot</li>
</ul>
</nav>
</div>
where I have few categories in the menu. When i click on specific category, i want to show the (div) tag for that specific category within the same .aspx page, and the other (div) tags for the other categories should be hidden.
This is the (div) tag for the category "Priroda":
<div class="Priroda" id="Priroda">
<asp:DataList ID="DataList1" runat="server" RepeatColumns="7" CellPadding="3">
<ItemTemplate>
<div class="boxButton">
<ul class="Gallery">
<li><a id="A1" href='<%# Eval("ime","~/Sliki/Ohrid/Priroda/{0}") %>' title='<%# "Од "+ Eval("userid")+ ", на " + Eval("datum")+ ", " + Eval("opis")%>' rel="FaceBox[gallery1]" runat="server" >
<asp:Image ID="Image1" ImageUrl='<%# Bind("ime", "~/Sliki/Ohrid/Priroda/{0}") %>' runat="server" Width="140" Height="140" AlternateText='<%# Bind("imeslika") %>' />
</a></li></ul></div>
</ItemTemplate>
</asp:DataList>
</div>
For binding the DataList i used this code in .cs file:
protected void BindDataList1()
{
String strConnString = System.Configuration.ConfigurationManager
.ConnectionStrings["makbazaConnectionString"].ConnectionString;
SqlConnection con = new SqlConnection(strConnString);
con.Open();
//Query to get ImagesName and Description from database
SqlCommand command = new SqlCommand("SELECT ime, imeslika, kategorija, datum, opis, slikapateka, userid FROM Ohrid WHERE kategorija='Priroda'", con);
SqlDataAdapter da = new SqlDataAdapter(command);
DataTable dt = new DataTable();
da.Fill(dt);
dlImages.DataSource = dt;
dlImages.DataBind();
con.Close();
}
Now i don't know how to call BindDataList1(); to show me data when i click on that category. I have different BindDataLists for each category. Can you tell me how to call specific BindDataList for the category that is selected from the menu? For example when i click on link Priroda show me the (div) tag Priroda and BindDalaList1();, when i click on link Znamenitosti show me the (div) tag Znamenitosti and BindDalaList2();
I think a simple way to do this would be to run your databind functions for all categories at once, for example in the PreRender event of "DataList1", so all of the data is on the page, and each bit is just hidden or shown through your jQuery.
Alternatively, could you use instead of tags, and have an OnClick property set to call your DataBind1 method.
I need to display multiple images from a database table and bind it to a repeater, how do I go about doing it?
This is my current code, but I have no idea on how to proceed to display images
Below is my method to load data to the repeater:
public void loadNoofNewJobsCompany()
{
DateTime lastlogged = Convert.ToDateTime(Session["LastLoginstaff"]);
string sqlStr = "SELECT * FROM Job ";
sqlStr += "WHERE ";
sqlStr += "UpdatedDateCmpRep <= #loggedin";
SqlCommand cmd = new SqlCommand(sqlStr, cnn);
cmd.Parameters.AddWithValue("#loggedin", lastlogged);
try
{
cnn.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
Label2.Text = dt.Rows.Count.ToString();
PagedDataSource pgdsc = new PagedDataSource();
pgdsc.DataSource = dt.DefaultView;
repeater1.DataSource = pgdsc;
repeater1.DataBind();
}
catch (Exception ex)
{
Response.Write("Error: " + ex.Message);
}
finally
{
if (cnn != null)
{
cnn.Close();
}
}
}
This is the repeater:
<asp:Repeater ID="repeater1" runat="server">
<ItemTemplate>
<div class="boxgrid caption">
<%--<img src="../../img/google.png" style="text-align:center"/>--%>
<div class="cover boxcaption">
<p>
<a href='../Job/ViewJobDetail.aspx?ID=<%# DataBinder.Eval(Container.DataItem, "JobID")%>' class="headerlink">
<%# getTitle(Eval("JobName").ToString()) %>
</a>
</p>
<p>
Salary Range:
<%# DataBinder.Eval(Container.DataItem, "JobSalaryRange")%>
</p>
... (more stuff - not relevant here) .....
</div>
</div>
</ItemTemplate>
</asp:Repeater>
For displaying images in gridview we need to create a Handler to read binary data from database.
here is good example of it.
I am assuming that the images are stored in the database.
Write .ashx(Http handler) to display the image.You can render the image using Response Header in the .ashx file directly from the database and use that .ashx file as follow in your repeater,the images will get displayed.
<img src="displayImage.ashx?id=111" style="text-align:center"/>
one more good example to look at
Display Images from database in ASP.NET GridView using HttpHandler