ایجاد دکمه Read More در سایت
با سلام
بنده یک سایتی مطابق تصویر پیوست درست کردم که با Entity Framework نوشته شده و آیمتها به صورت داینامیک و با String Builder ساخته میشن. حالا میخوام اگر رکوردهام بیشتر از 12 تا شد دکمه Read more فعال بشه و ادامه پست هام با کلیک بر روی دکمه Read More نمایش داده بشن ولی هر کاری کردم نتونستم. خواهشا کمک کنید چون بنده قبلا هم چند تا پست گذاشته بودم ولی کسی جواب نداد.
کد سی شارپ:
using (Entities context = new Entities()) {
StringBuilder sb = new StringBuilder();
int count = context.tblBooks.ToList().Count + context.tblCatalogs.ToList().Count +
context.tblDesigns.ToList().Count + context.tblDocuments.ToList().Count +
context.tblFilms.ToList().Count + context.tblMagazines.ToList().Count +
context.tblPaintings.ToList().Count + context.tblPhotoes.ToList().Count +
context.tblPostalCards.ToList().Count + context.tblPosters.ToList().Count +
context.tblPrints.ToList().Count + context.tblVoices.ToList().Count;
if (count > 12)
{
sb.Append("<div class='main-row-archive'>");
sb.Append("<div class='column-container'>");
foreach (var book in context.tblBooks.ToList())
{
string hashID = Helper.Encrypt(book.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box' id='box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(book.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + book.BookTitle + "</p>");
sb.Append("<p>" + book.BookSubject + "</p>");
sb.Append("<p>" + book.Publisher + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var catalog in context.tblCatalogs.ToList())
{
string hashID = Helper.Encrypt(catalog.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(catalog.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + catalog.CatalogTitle + "</p>");
sb.Append("<p>" + catalog.CatalogSubject + "</p>");
sb.Append("<p>" + catalog.Designer + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var design in context.tblDesigns.ToList())
{
string hashID = Helper.Encrypt(design.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(design.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + design.DesignTitle + "</p>");
sb.Append("<p>" + design.DesignSubject + "</p>");
sb.Append("<p>" + design.DesignDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var document in context.tblDocuments.ToList())
{
string hashID = Helper.Encrypt(document.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(document.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + document.DocTitle + "</p>");
sb.Append("<p>" + document.DocSubject + "</p>");
sb.Append("<p>" + document.DocDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var film in context.tblFilms.ToList())
{
string hashID = Helper.Encrypt(film.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(film.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + film.FilmTitle + "</p>");
sb.Append("<p>" + film.FilmSubject + "</p>");
sb.Append("<p>" + film.FilmDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var magazine in context.tblMagazines.ToList())
{
string hashID = Helper.Encrypt(magazine.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(magazine.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + magazine.MagazineTitle + "</p>");
sb.Append("<p>" + magazine.MagazineSubject + "</p>");
sb.Append("<p>" + magazine.Publisher + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var painting in context.tblPaintings.ToList())
{
string hashID = Helper.Encrypt(painting.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(painting.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + painting.PaintingTitle + "</p>");
sb.Append("<p>" + painting.PaintingSubject + "</p>");
sb.Append("<p>" + painting.PaintingDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var photo in context.tblPhotoes.ToList())
{
string hashID = Helper.Encrypt(photo.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(photo.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + photo.PhotoTitle + "</p>");
sb.Append("<p>" + photo.PhotoSubject + "</p>");
sb.Append("<p>" + photo.PhotoDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var postalCard in context.tblPostalCards.ToList())
{
string hashID = Helper.Encrypt(postalCard.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(postalCard.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + postalCard.PostaCardTitle + "</p>");
sb.Append("<p>" + postalCard.PostaCardSubject + "</p>");
sb.Append("<p>" + postalCard.PostalCardDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var poster in context.tblPosters.ToList())
{
string hashID = Helper.Encrypt(poster.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(poster.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + poster.PosterTitle + "</p>");
sb.Append("<p>" + poster.PosterSubject + "</p>");
sb.Append("<p>" + poster.PosterDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var print in context.tblPrints.ToList())
{
string hashID = Helper.Encrypt(print.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(print.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + print.PrintTitle + "</p>");
sb.Append("<p>" + print.PrintSubject + "</p>");
sb.Append("<p>" + print.PrintDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
foreach (var voice in context.tblVoices.ToList())
{
string hashID = Helper.Encrypt(voice.Id);
sb.Append("<a href=Detail.aspx?ID=" + hashID + " style ='text-decoration: none; color: #090b06;'>");
sb.Append("<div class='column-box'>");
sb.Append("<img class='archive-image' src='data:image/jpg;base64," + Convert.ToBase64String(voice.ArchiveImage) + "'/>");
sb.Append("<div class='photo-desc'>");
sb.Append("<p>" + voice.VoiceTitle + "</p>");
sb.Append("<p>" + voice.VoiceSubject + "</p>");
sb.Append("<p>" + voice.RecordDate + "</p>");
sb.Append("</div>");
sb.Append("</div>");
sb.Append("</a>");
}
sb.Append("</div>");
sb.Append("</div>");
outer.InnerHtml = sb.ToString();
}
}
کد aspx:
<div class="wrapper"> <a href="Home.aspx">
<img src="files/logo.png" class="logo" />
</a>
<div class="section section--menu" id="Viola">
<nav class="menu menu--viola">
<ul class="menu__list">
<li class="menu__item menu__item--current"><a href="Project.aspx" class="menu__link">پروژه</a></li>
<li class="menu__item"><a href="Magazine.aspx" class="menu__link">مجله</a></li>
<li class="menu__item"><a href="Book.aspx" class="menu__link">کتاب</a></li>
<li class="menu__item"><a href="Link.aspx" class="menu__link">پیوند</a></li>
<li class="menu__item"><a href="Archive.aspx" class="menu__link">آرشیو</a></li>
</ul>
</nav>
</div>
<div class="input-center">
<asp:TextBox runat="server" CssClass="search-box" ID="txtSearch" OnTextChanged="txtSearch_TextChanged" placeholder="جستجو..." AutoPostBack="true"></asp:TextBox>
</div>
<div class="checkbox-wrapper">
<label>کتاب</label>
<input type="checkbox" runat="server" id="chkBook" onserverchange="chkBook_ServerChange" />
<br />
<br />
<label>مجله</label>
<input type="checkbox" runat="server" id="chkMagazine" onserverchange="chkMagazine_ServerChange" />
<br />
<br />
<label>کاتالوگ</label>
<input type="checkbox" runat="server" id="chkCatalog" onserverchange="chkCatalog_ServerChange" />
<br />
<br />
<label>سند</label>
<input type="checkbox" runat="server" id="chkDocument" onserverchange="chkDocument_ServerChange" />
<br />
<br />
<label>طراحی</label>
<input type="checkbox" runat="server" id="chkDesign" onserverchange="chkDesign_ServerChange" />
<br />
<br />
<label>نقاشی</label>
<input type="checkbox" runat="server" id="chkPainting" onserverchange="chkPainting_ServerChange" />
<br />
<br />
<label>پوستر</label>
<input type="checkbox" runat="server" id="chkPoster" onserverchange="chkPoster_ServerChange" />
<br />
<br />
<label>چاپ</label>
<input type="checkbox" runat="server" id="chkPrint" onserverchange="chkPrint_ServerChange" />
<br />
<br />
<label>کارت پستال</label>
<input type="checkbox" runat="server" id="chkPostalCard" onserverchange="chkPostalCard_ServerChange" />
<br />
<br />
<label>عکس</label>
<input type="checkbox" runat="server" id="chkPhoto" onserverchange="chkPhoto_ServerChange" />
<br />
<br />
<label>فیلم</label>
<input type="checkbox" runat="server" id="chkFilm" onserverchange="chkFilm_ServerChange" />
<br />
<br />
<label>صدا</label>
<input type="checkbox" runat="server" id="chkVoice" onserverchange="chkVoice_ServerChange" />
<br />
<br />
<div class="seperator"></div>
<br />
<label>عنوان</label>
<input type="checkbox" runat="server" id="chkTitle" onserverchange="chkTitle_ServerChange" />
<br />
<br />
<label>موضوع</label>
<input type="checkbox" runat="server" id="chkSubject" onserverchange="chkSubject_ServerChange" />
<br />
<br />
<label>پدیدآور / هنرمند</label>
<input type="checkbox" runat="server" id="chkPublisher" onserverchange="chkPublisher_ServerChange" />
<br />
<br />
<label>تاریخ نشر / اثر</label>
<input type="checkbox" runat="server" id="chkPublishDate" onserverchange="chkPublishDate_ServerChange" />
<br />
<br />
<label>محل نشر</label>
<input type="checkbox" runat="server" id="chkPublishPlace" onserverchange="chkPublishPlace_ServerChange" />
<br />
<br />
<div class="seperator"></div>
<br />
<label>فارسی</label>
<input type="checkbox" runat="server" value="فارسی" id="chkPersian" onserverchange="chkPersian_ServerChange" />
<br />
<br />
<label>انگلیسی</label>
<input type="checkbox" runat="server" value="انگلیسی" id="chkEnglish" onserverchange="chkEnglish_ServerChange" />
<br />
<br />
<label>فرانسوی</label>
<input type="checkbox" runat="server" value="فرانسوی" id="chkFrench" onserverchange="chkFrench_ServerChange" />
<br />
<br />
<label>روسی</label>
<input type="checkbox" runat="server" value="روسی" id="chkRussia" onserverchange="chkRussia_ServerChange" />
<br />
<br />
<label>عربی</label>
<input type="checkbox" runat="server" value="عربی" id="chkArabic" onserverchange="chkArabic_ServerChange" />
<br />
<br />
</div>
<div id="outer" runat="server">
</div>
<span id="more"></span>
<button onclick="readMore()" id="myBtn">نمایش بیشتر</button>
<div class="footer">
<p>«پژوهش های فرهنگی تهران» در دو بخش «پروژه های پژوهشی» و «گردآوری اسناد » فرهنگ و هنر ایران فعال است. تمرکزش بر گردآوری موضوعی مستندات پراکنده‌ی گنجینه‌های دولتی و خصوصی، همچنین تعریف یا همکاری در پروژه های پژوهشی در این زمینه است، تا علاوه بر امکان دسترسی آسان تر هنرپژوهان به این مجموعه ها، با انتشارشان،ثبت و همگانی سازی بخش هایی از اسناد فرهنگ و هنر ایران را تسهیل نماید.</p>
<br />
<p>برای دست یابی به فایل با کیفیت تصاویر لطفا از طریق ایمیل با ما در تماس باشید:</p>
<div class="icons">
<a href="mailto:tehranculturalresearch@gmail.com" class="email">
<img src="fonts/gmail.svg" />
</a>
<a href="https://instagram.com/tehran_cultural_research?igshid=1is6g76qg8a8i" class="instagram">
<img src="fonts/instagram.svg" />
</a>
</div>
</div>
</div>
کد CSS:
#more { display: none;
}
#myBtn {
margin-bottom: 250px;
width: 884px;
height: 50px;
background-color: red;
margin-right: 250px;
text-align: center;
color: white;
}
کد جاوا اسکریپت:
function readMore() { var dots = document.getElementById("dots");
var moreText = document.getElementById("more");
var btnText = document.getElementById("myBtn");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "نمایش بیشتر";
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML = "نمایش کمتر";
moreText.style.display = "inline";
}
}
نقل قول: ایجاد دکمه Read More در سایت
نقل قول: ایجاد دکمه Read More در سایت
دوست عزیز این کدی که نوشتی، از فحش بدتره!!!
حالا اگه فرض بگیریم درست باشه، اینا رو چک کنید:
https://codepen.io/pbakaus/pen/gOYrwNp/
https://stackoverflow.com/questions/...llbar-in-a-div
نقل قول: ایجاد دکمه Read More در سایت
سلام کدهایی که نوشتید اصلا اصولی نیست بهتره در واکشی اطلاعات تجدید نظر کنی و روش دیگه ای رو به کار ببری
نمونه های زیادی برای این کار وجود داره مثلا با استفاده از jquery به صورت pagination
لینک زیر رو ببین:
https://www.c-sharpcorner.com/articl...e-integration/
نقل قول: ایجاد دکمه Read More در سایت
درباره WEBMETHOD تحقیق کن
