مشکل در نمایش محصولات

[sadegh.te]

سلام خدمت اساتید محترم مشکل اینه که این صفحه که عکسشو پایین میبیند مثلا محصولات ویژه فروشگاه رو تو صفحه اصلی نمایش بده من وقتی که میخوام اطلاعات رو از دیتابیس تو این قسمت

نمایش بدم یه مشکلی پیش میاد که کل اطلاعاتو ستونی میکنه عکشو با کدایی که براش نوشتم پایین میزارم اگه میشه راهنمایی کنید که اطلاعات افقی نمایش داده بشه البته با

HTMLGenericControl از دیتابیس میخونمش کداشم پایین گذاشتم.

123633

اینم عکس مشکل وقتی که از دیتابیس میخونمش

123634

اینم کداش


for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
HtmlGenericControl DIVowlcarousel = new HtmlGenericControl("DIV");
DIVowlcarousel.Attributes.Add("class", "owl-carousel");
DIVowlcarousel.Attributes.Add("data-max-items", "3");
HtmlGenericControl DIVproduct = new HtmlGenericControl("DIV");
DIVproduct.Attributes.Add("class", "product");
HtmlGenericControl DIVproductimage = new HtmlGenericControl("DIV");
DIVproductimage.Attributes.Add("class", "product-image");
DIVproductimage.Attributes.Add("alt", "Product1");
HtmlGenericControl image = new HtmlGenericControl("image");
string im;
im = ds.Tables[0].Rows[i][3].ToString();
image.InnerHtml = "<img src=\"/uploads/kala/" + im.ToString() + ".jpg\" />";

HtmlGenericControl DIVproductinfo = new HtmlGenericControl("DIV");
DIVproductinfo.Attributes.Add("class", "product-info");
HtmlGenericControl h5 = new HtmlGenericControl("h5");
h5.InnerHtml = "<h5>" + ds.Tables[0].Rows[i][1].ToString() + "</h5>";
HtmlGenericControl price = new HtmlGenericControl("price");
price.InnerText = ds.Tables[0].Rows[i][2].ToString();
HtmlGenericControl DIV = new HtmlGenericControl("DIV");

HtmlGenericControl DIVproductactions = new HtmlGenericControl("DIV");
DIVproductactions.Attributes.Add("class", "product-actions");
HtmlGenericControl span1 = new HtmlGenericControl("span");
span1.Attributes.Add("class", "add-to-cart");
HtmlGenericControl span2 = new HtmlGenericControl("span");
span2.Attributes.Add("class", "action-wrapper");
HtmlGenericControl ih = new HtmlGenericControl("ih");
ih.Attributes.Add("class", "icons icon-basket-2");
HtmlGenericControl span3 = new HtmlGenericControl("span");
span3.Attributes.Add("class", "action-name");
span3.InnerText = "افزودن به سبد خرید";
span2.Controls.Add(ih);
span2.Controls.Add(span3);
span1.Controls.Add(span2);
DIVproductactions.Controls.Add(span1);


HtmlGenericControl span4 = new HtmlGenericControl("span");
span4.Attributes.Add("class", "add-to-favorites");
HtmlGenericControl span5 = new HtmlGenericControl("span");
span5.Attributes.Add("class", "action-wrapper");
HtmlGenericControl ig = new HtmlGenericControl("i");
ig.Attributes.Add("class", "icons icon-heart-empty");
HtmlGenericControl span6 = new HtmlGenericControl("span");
span6.Attributes.Add("class", "action-name");
span6.InnerText = "افزودن به لیست مورد علاقه";
span5.Controls.Add(ig);
span5.Controls.Add(span6);
span4.Controls.Add(span5);
DIVproductactions.Controls.Add(span4);

HtmlGenericControl span7 = new HtmlGenericControl("span");
span7.Attributes.Add("class", "add-to-compare");
HtmlGenericControl span8 = new HtmlGenericControl("span");
span8.Attributes.Add("class", "action-wrapper");
HtmlGenericControl ik = new HtmlGenericControl("i");
ik.Attributes.Add("class", "icons icon-docs");
HtmlGenericControl span9 = new HtmlGenericControl("span");
span9.Attributes.Add("class", "action-name");
span9.InnerText = "مقایسه";
span8.Controls.Add(ik);
span8.Controls.Add(span9);
span7.Controls.Add(span8);
DIVproductactions.Controls.Add(span7);

DIVproductimage.Controls.Add(image);
DIVproductinfo.Controls.Add(h5);
DIVproductinfo.Controls.Add(price);
DIVproduct.Controls.Add(DIVproductimage);
DIVproduct.Controls.Add(DIVproductinfo);
DIVproduct.Controls.Add(DIVproductactions);
DIV.Controls.Add(DIVproduct);
DIVowlcarousel.Controls.Add(DIV);
box.Controls.Add(DIVowlcarousel);


}

[sadegh.te]

یعنی کسی جواب اینو نمیدونه؟؟؟

[mehrzad_ali]

از دیتالیست اسفاده کن و خاصیت repeatColumn رو 3 بذار

[mehrzad_ali]

repeatDirection رو هم روی Horizontal بذار

[sadegh.te]

میشه بیشتر توضیح بدین که چطور میتونم کد HTML رو بریزم تو دیتالیست تا به شکل عکس بالا در بیاد؟؟؟

آخه از کنترل ریپیتر استفاده کردم باز مشکل بالا رو داشتم.

ممنون میشم

[mehrzad_ali]

توی ItemTemplate دیتالیست با Table طراحی کن

[sadegh.te]

طراحی کردم ولی محصولاتمو تو 3 تا ستون زیر هم نشون میده با این کنترل نمیشه طراحیش کرد ممنون.

[aminmousavi]

سلام دوست عزیز .
سورس html ات رو بزار که بشه بررسی کرد

[sun2rise]

من برای این کارها از سی اس اس کمک میگیرم به طوری که یک دیو تعریف میکنم و طوری اندازه اون ها رو تنظیم میکنم که اگر سه تا کنار هم باشه باعث نشه که به خاطر کوچک بودن مانیتور به زیر هم برن
و خاصیت float اون دیو رو برابر با right یا left قرار میدم
به این صورت

float:right;


این روش اصلا دردسر نداره و همچنین بهینه هم هستش

[sadegh.te]

اینم سورس HTML



<div class="products-row row">

<!-- Carousel Heading -->
<div class="col-lg-12 col-md-12 col-sm-12">

<div class="carousel-heading">
<h4>محصولات ویژه</h4>
<div class="carousel-arrows">
<i class="icons icon-left-dir"></i>
<i class="icons icon-right-dir"></i>
</div>
</div>

</div>
<!-- /Carousel Heading -->

<!-- Carousel -->
<div class="carousel owl-carousel-wrap col-lg-12 col-md-12 col-sm-12">

<div class="owl-carousel" data-max-items="4">

<!-- Slide -->
<div>
<!-- Carousel Item -->
<div class="product">

<div class="product-image">
<img src="img/products/sample1.jpg" alt="Product1">
<a href="products_page_v1.html" class="product-hover">
<i class="icons icon-eye-1"></i> مشخصات
</a>
</div>

<div class="product-info">
<h5><a href="products_page_v1.html">Lorem ipsum dolor sit amet</a></h5>
<span class="price">$281.00</span>
<div class="rating readonly-rating" data-score="4"></div>
</div>

<div class="product-actions">
<span class="add-to-cart">
<span class="action-wrapper">
<i class="icons icon-basket-2"></i>
<span class="action-name">افزودن به سبد خرید</span>
</span >
</span>
<span class="add-to-favorites">
<span class="action-wrapper">
<i class="icons icon-heart-empty"></i>
<span class="action-name">اضافه به لیست مورد علاقه</span>
</span>
</span>
<span class="add-to-compare">
<span class="action-wrapper">
<i class="icons icon-docs"></i>
<span class="action-name">مقایسه</span>
</span>
</span>
</div>

</div>
<!-- /Carousel Item -->
</div>

[zahraaaaaa]

یه مقدار از کد بالاتون رو تو دیتا لیست گذاشتم و سه ستونه اش کردم

<asp:DataList ID="DataList1" runat="server" DataKeyField="pid" DataSourceID="SqlDataSource1" RepeatColumns="3" RepeatDirection="Horizontal">
<ItemTemplate>
<img src='<%# Eval("img", "images/product/{0}") %>' alt="Product1">
<a href="products_page_v1.html" class="product-hover">
<i class="icons icon-eye-1"></i> مشخصات
</a>
</ItemTemplate>
</asp:DataList>

[aminmousavi]

دوست عزیز کدی که نوشتید خیلی جاها با سورستون تفاوت داره . برای رفعش از خروجی که کدتون میده view source بگیرید متوجه اشکالاتش میشید .

[sadegh.te]

امین شما بجز HTMLGeneric چه روش دیگه ای برای درست کردنش پیشنهاد میکنید؟

[aminmousavi]

چون میخوای button تحت سرور هم قرار بدی همین روش رو فقط پیشنهاد میکنم (خودم همیشه از این روش استفاده میکنم ، شاید روش های بهتری هم باشه)

[sadegh.te]

خروجی view source که میگیرم کدش بهم ریختس معلوم نیس میشه شما کدو یه برسی کنید ببینید کجاش مشکل داره؟

[sadegh.te]

کسی هست بدونه که مشکل این چیه؟