محمود خسروی
3 سال پیش توسط محمود خسروی مطرح شد
12 پاسخ

چگونه داده ها را پس از افزودن داده ها در جدول نشان دهم

فرم من به این شکل است

جدول

من در حال کار بر روی یک پروژه هستم و می خواهم بدانم که بهترین راه برای نشان دادن داده ها پس از قرار دادن یک رکورد بر روی پایگاه داده دارای ساختار پیچیده HTML بین استفاده از ساختار در Laravel یا jQuery ، کدام یک است.

من در حال ساخت سیستم مشاغل هستم. هنگامی که کاربر پست را می نویسد و آن را منتشر می کند ، یک تماس ajax عملکرد Laravel را فعال می کند و اطلاعات را در پایگاه داده وارد می کند. تا اینجا همه خوب است ، اما سپس باید درج پیام را بر روی دیوار کاربر نمایش دهم ، بنابراین کار نمی کند.

<form id="job-store" method="post">
<input type="hidden" value="{{ route('job.store') }}" name="url" />
@csrf
<div class="row">
    <div class="col-md-6 mb-3">
        <label for="employment_type">نوع استخدام</label>
        <select class="form-control selectpicker" title="چیزی انتخاب نشده است" id="employment_type" name="employment_type">
            <option value="حق التدریس">حق التدریس</option>
            <option value="رسمی">رسمی</option>
            <option value="پیمانی">پیمانی</option>
            <option value="قراردادی">قراردادی</option>
        </select>
    </div>
    <div class="col-md-6 mb-3">
        <label for="job_type">عنوان شغلی</label>
        <select class="form-control selectpicker" title="چیزی انتخاب نشده است" id="job_type" name="job_type">
            <option value="مربی درون سازمانی">مربی درون سازمانی</option>
            <option value="مربی حق التدریس">مربی حق التدریس</option>
            <option value="صنعتکار">صنعتکار</option>
            <option value="مدرس دانشگاه">مدرس دانشگاه</option>
            <option value="استادکار مهارتی">استادکار مهارتی</option>
            <option value="سایر">سایر</option>
        </select>
    </div>
    <div class="col-md-6 mb-3">
        <label for="history">سابقه (سال)</label>
        <input type="text" class="form-control" id="history" name="history">
    </div>
    <div class="col-md-6 mb-3">
        <label for="post_title">عنوان پست</label>
        <input type="text" class="form-control" id="post_title" name="post_title">
    </div>
    <div class="col-md-6 mb-3">
        <label for="state">استان محل خدمت</label>
        <input type="text" class="form-control" id="state" name="state">
    </div>
    <div class="col-md-6 mb-3">
        <label for="city">شهر محل خدمت</label>
        <input type="text" class="form-control" id="city" name="city">
    </div>
    <div class="col-md-6 mb-3">
        <label for="start_date">تاریخ شروع به كار</label>
        <date-picker type="date" id="start_date" name="start_date"></date-picker>
    </div>
    <div class="col-md-6 mb-3">
        <label for="end_date">تاریخ خاتمه كار</label>
        <date-picker type="date" id="end_date" name="end_date"></date-picker>
    </div>
</div>
<div class="row">
    <div class="col-md-6 mb-3">
        <button type="submit" class="btn btn-success job-store"><i class="fas fa-plus fa-xs"></i> افزودن</button>
    </div>
</div>
</form>
<div class="table-responsive">
<table class="table table-striped">
    <thead>
    <tr>
        <th>ردیف</th>
        <th>نوع استخدام</th>
        <th>تاریخ شروع کار</th>
        <th>تاریخ خاتمه کار</th>
        <th>استان محل خدمت</th>
        <th>شهر محل خدمت</th>
        <th>اکشن</th>
    </tr>
    </thead>
    <tbody id="showJobs">

    </tbody>
</table>
</div>

@section('script')
<script>
    $(document).ready(function (e) {
        showJobs();
        function showJobs() {
            let html = '' +
                '@foreach(auth()->user()->jobs as $job)'+
                '<tr>'+
                '<td class="fw-normal">{{ $job->id }}</td>'+
                '<td class="fw-normal">{{ $job->employment_type }}</td>'+
                '<td class="fw-normal">{{ $job->start_date }}</td>'+
                '<td class="fw-normal">{{ $job->end_date }}</td>'+
                '<td class="fw-normal">{{ $job->state }}</td>'+
                '<td class="fw-normal">{{ $job->city }}</td>'+
                '<td>'+
                '<form action="{{ route('job.destroy', $job->id) }}" method="post">'+
                '@csrf'+
                '@method('DELETE')'+
                '<div class="btn-group">'+
                '<a href="{{ route('job.edit', $job->id) }}" class="btn btn-info btn-sm">ویرایش</a>'+
                '<button type="submit" class="btn btn-danger btn-sm">حذف</button>'+
                '</div>'+
                '</form>'+
                '</td>'+
                '</tr>'+
                '@endforeach';
            $('#showJobs').append(html);
        }
    });
</script>
@endsection

در ضمن این کد، هیچ خطایی وجود ندارد


ثبت پرسش جدید
امیر علی
تخصص : طراح و توسعه دهنده fullstack
@ajdar9667 3 سال پیش مطرح شد
1

داداش یه جوری نوشتی!!!!! یکم روون تر بنویس بفهمیم چ نوشتی


محمود خسروی
تخصص : طراح و برنامه نویس
@oxbir 3 سال پیش مطرح شد
0

چجوری نوشتم 😆😆😆😆


علیرضا کفایتی
تخصص : برنامه نویس laravel, vue.js
@alirezakefayati 3 سال پیش مطرح شد
0

سلام

document.getElementById('onlineuser').refresh();

امیر علی
تخصص : طراح و توسعه دهنده fullstack
@ajdar9667 3 سال پیش آپدیت شد
0

خب الان منظورت از اینا چیه
۵۰۰۰/۴۹۷
نتایج ترجمه
بعد یعنی چی روی دیوار کاربر نشون بده


فرشید مرادی
تخصص : noob
@eniack 3 سال پیش مطرح شد
1

سلام وقت بخیر ،
چیزی که من فهمیدم اینه که شما میخوای همزمان که دیتا وارد دیتابیس میشه داخل جدول هم بیاد و بدون رفرش کاربر دیتا جدید رو ببینه؟!


علیرضا کفایتی
تخصص : برنامه نویس laravel, vue.js
@alirezakefayati 3 سال پیش مطرح شد
0

سلام
مجدد پاسخ میدهم کافیه بعد از افزودن این کد اجرا بشه :

document.getElementById('id اون div').refresh();

محمود خسروی
تخصص : طراح و برنامه نویس
@oxbir 3 سال پیش مطرح شد
0

@eniack

بله دقیقا


فرشید مرادی
تخصص : noob
@eniack 3 سال پیش آپدیت شد
1

@oxbir
یه آی دی واسه جدول بزارید :

<table class="table table-striped" id="twrap">
  <thead>
    <tr>
      <th>ردیف</th>
      <th>نوع استخدام</th>
      <th>تاریخ شروع کار</th>
      <th>تاریخ خاتمه کار</th>
      <th>استان محل خدمت</th>
      <th>شهر محل خدمت</th>
      <th>اکشن</th>
    </tr>
  </thead>
  <tbody id="showJobs">

  </tbody>
</table>

و کد جی کوئری زیر رو قرار بدید داخل بخش اسکریپت ها ، امیدوارم کمک کنه...

$('#twrap').load(document.URL + ' #showJobs');

یاری
@yari.mona67 3 سال پیش مطرح شد
0

سلام
من به این روش نوشتم
('#twrap').load(document ولی صفحه رفرش میشه اطلاعات رو‌نشون میده دلیلش چیه
میخوام بعد اینکه رکورد رو ثبت کردم از طریق ایجکس بلافاصله در table نمایش داده بشه بدون رفرش


یاری
@yari.mona67 3 سال پیش مطرح شد
0

@eniack سلام وقتتون بخیر
من ثبت رکورد رو با ایجکس نوشتم میخوام بلافاصله بعد ثبت رکورد در table برام نمایش بده بدون رفرش وبدون استفاده از تگ html داخل اسکریپت


فرشید مرادی
تخصص : noob
@eniack 3 سال پیش مطرح شد
0

@yari.mona67
سلام وقت بخیر ،
بعد از اینکه عملیات ajax به درستی انجام شد ، کد زیر رو بنویسید :

 $('.amount-of').load(document.URL + ' #totalAmount');

و html این کد هم به این صورته ، شما برای کدهای خودت شخصی سازیش کن

<span class="amount-of"><span id="totalAmount"></span></span>

میلاد خسروی
تخصص : برنامه نویس بامزه
@milwad 3 سال پیش مطرح شد

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام