• 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
حذف یک ردیف از جدول
#1
سلام
فرض کنید جدولی به شکل زیر داریم
کد پی‌اچ‌پی:
<table>
<
tr>
    <
td>first</td>
    <
td><button>delete</button></td>
</
tr>
<
tr>
    <
td>second</td>
    <
td><button>delete</button></td>
</
tr>
</
table
من میخوام با کلیک بر دکمه delete اون ردیفی از جدول که دکمه مذکور در اون قرار داره حذف بشه
به صورت آجاکس
بدون استفاده از ای دی و کلاس برای ردیف ها (چون همچین امکانی رو ندارم)
لطفا راهنماییم کنید .
  پاسخ
تشکر شده توسط :
#2
خداوکیلی اینجا اللاهی نوشتم برات ببین کار میکنه
کد پی‌اچ‌پی:
<td><button onclick="del()">delete</button></td>
<
script>
function 
del()
{
    $(
this).parent('tr').remove();
}
</
script
Big Grin
  پاسخ
تشکر شده توسط : Reza
#3
(۱۳۹۵ مرداد ۰۶, ۰۷:۴۳ ب.ظ)kasbookar نوشته: خداوکیلی اینجا اللاهی نوشتم برات ببین کار میکنه
کد پی‌اچ‌پی:
<td><button onclick="del()">delete</button></td>
<
script>
function 
del()
{
    $(
this).parent('tr').remove();
}
</
script
Big Grin

سلام برادر
متاسفانه کار نکرد
فکر کنم کمی پیچیده تر باشه
  پاسخ
تشکر شده توسط :
#4
کد پی‌اچ‌پی:
<script>
function 
del()
{
    $(
this).parent.parent('tr').remove();
}
</
script
این رو امتحان کنید ، این قضیه اصلا پیچیده نیس انقد راحته که پیچیده به نظر میاد
کد بالارو ببینید درست میشه فک کنم با کد اولی فقط td حذف میشه , ولی با tr

به این توضیح دقت کن
شما میخواید tr رو حذف کنید که داخلش دکمه دلت هستش
خب دکمه دلتت داخل یک td هست پس این میشه یک parent و td داخل یک tr هست اینم میشه parent (منظور از این تگ والد یا پدر هستش همون تگی که مشخصه داخل اون هست)
کل کد بالا یعنی اینکه بیا پدر پدر رو حذف کن( در واقه میشه بابابزرگشBig Grin)
  پاسخ
تشکر شده توسط :
#5
(۱۳۹۵ مرداد ۰۷, ۰۴:۱۳ ب.ظ)kasbookar نوشته:
کد پی‌اچ‌پی:
<script>
function 
del()
{
    $(
this).parent.parent('tr').remove();
}
</
script
این رو امتحان کنید ، این قضیه اصلا پیچیده نیس انقد راحته که پیچیده به نظر میاد
کد بالارو ببینید درست میشه فک کنم با کد اولی فقط td حذف میشه , ولی با tr

به این توضیح دقت کن
شما میخواید tr رو حذف کنید که داخلش دکمه دلت هستش
خب دکمه دلتت داخل یک td هست پس این میشه یک parent و td داخل یک tr هست اینم میشه parent (منظور از این تگ والد یا پدر هستش همون تگی که مشخصه داخل اون هست)
کل کد بالا یعنی اینکه بیا پدر پدر رو حذف کن( در واقه میشه بابابزرگشBig Grin)
خوب بازم کار نکرد Big Grin
  پاسخ
تشکر شده توسط :
#6
کسی نیست کمک کنه !؟
  پاسخ
تشکر شده توسط :
#7
سلام،
بفرمایید. اینی که نوشتم رو آزمایش کردم و کار میکنه. لینک سایت jsfiddle رو گذاشتم. [ لینک]
ولی اگر بخوای اون رکورد رو از پایگاه داده هم حذف کنی. باید آی‌دی اون رکورد رو داشته باشی، اینجوری نمیشه.
غایب
  پاسخ
تشکر شده توسط : kasbookar Reza
#8
(۱۳۹۵ مرداد ۰۹, ۰۲:۴۳ ب.ظ)Alaa نوشته: سلام،
بفرمایید. اینی که نوشتم رو آزمایش کردم و کار میکنه. لینک سایت jsfiddle رو گذاشتم. [ لینک]
ولی اگر بخوای اون رکورد رو از پایگاه داده هم حذف کنی. باید آی‌دی اون رکورد رو داشته باشی، اینجوری نمیشه.

سلام
خیلی ممنون
میشه بپرسم این event چیه ؟ برای چی گذاشتینش ؟
چه موقعی استفاده میشه !؟
چرا پشت button دوتا نقطه قرار دادید !؟
-------------------------------------
ولی اگر بخوای اون رکورد رو از پایگاه داده هم حذف کنی. باید آی‌دی اون رکورد رو داشته باشی، اینجوری نمیشه.
میشه بیشتر توضیح بدید !؟
  پاسخ
تشکر شده توسط :
#9
نقل قول:میشه بپرسم این event چیه ؟ برای چی گذاشتینش ؟
چه موقعی استفاده میشه !؟

این event صرفا یک متغیر هست. کاری که انجام میده، یه سری از مشخصات اون elementی از صفحه که روش کلیک شده رو بر میگردونه. (اگه از خود event یکبار console.log بگیرین می‌تونین ببینین چه چیزهایی در اون متغیر هست.)

نقل قول:چرا پشت button دوتا نقطه قرار دادید !؟

اون ۲ تا نقطه رو بهش میگن selector. معنیش این میشه که تمام buttonهای صفحه رو زیر نظر داره، روی هر کودوم کلیک شد مشخصاتیش رو میگیره، میزاره توی اون eventی که تعریف شده.

نقل قول:میشه بیشتر توضیح بدید !؟

الان این کدی که من نوشتم فقط وظیفه‌اش حذف کردن ظاهری اون ردیف از جدول هست. اگر صفحه رفرش بشه خب دوباره اون ردیف‌ها بر میگردن. اگر شما بخواین اون ردیف از پایگاه داده هم حذف بشه، باید ID اون رکورد رو داشته باشین. مثلا توی دکمه‌ای که دارین، میزارین:
کد:
<button data-recordID=12"></button>
اون عدد ۱۲ میشه آی‌دی رکورد توی پایگاه داده.
که میتونین با استفاده از این روش آی‌دی رو بخونین و عملیات حذف رو انجام بدین.
اگر این روندی که توضیح دادم براتون یکم گیج کننده است شاید بهتر باشه کمی راجع‌به کار با پایگاده داده‌ها تحقیق کنین.
غایب
  پاسخ
تشکر شده توسط :
#10
ممنون توضیحتون عالی بود
الان من کد ها رو قرار دادم به این شکل
ولی برای من کار نکرد
مشکلش چیه !؟
کد پی‌اچ‌پی:
<html>
<
head>
<
script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<
script type "text/javascript">
$(
':button').click(function(event){
    $(
event.target).parent().parent().remove();
});
</
script
<
style>
    
table  {
        
border1px solid black;
    }
</
style>
</
head>
<
body>
<
table>
<
tr>
    <
td>first</td>
    <
td><button>delete</button></td>
</
tr>
<
tr>
    <
td>second</td>
    <
td><button>delete</button></td>
</
tr>
<
tr>
    <
td>third</td>
    <
td><button>delete</button></td>
</
tr>
<
tr>
    <
td>fourth</td>
    <
td><button>delete</button></td>
</
tr>
</
table
</
body>
</
html
  پاسخ
تشکر شده توسط :


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان