如何在laravel中使用jquery在编辑模态弹出窗口时获取旧值数据选择选项

我试图在弹出模态显示时显示旧值数据，但在模态中显示选择选项数据时，我仍然对逻辑感到困惑，以下是我代码。

调用模态和函数javascript

<button
        class="btn text-white d-flex justify-content-center align-items-center text-capitalize btn-update me-2"
        data-bs-title="Edit" data-bs-toggle="modal"
        data-id="{{ $item->id }}" data-bs-target="#edit_modal_users"
        style="background-color: #ff720c;width:50px;height:25px;font-size:12px; font-weight:500;"
        onclick="getDataMember('{{ $item->id }}','{{ $item->group_name }}', '{{ $item->role_name }}', '{{ $item->email }}')">
    Edit
</button>

函数javascript

函数getDataMember（ID、组名、角色名、电子邮件）{

document.getElementById('user_id').value = id;
     
        document.getElementById('edit_department_name').value = group_name;
        document.getElementById('edit_role_name').value = role_name;
        document.getElementById('edit_email').value = email;

    }

弹出时模式

<div class="modal fade" id="edit_modal_users" tabindex="-1" role="dialog" aria-labelledby="exampleModalMessageTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header" style="background: #19194b">
        <h6 class="font-weight-bolder text-white" style="font-weight: 600">Edit Member</h6>
        <button type="button" class="btn-close  text-white" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="card-text mt-4" id="basic-info">
          <div class="card-body pt-0">
            <form onsubmit="updateEmploye(event)">
              <div class="row">
                <input type="hidden" name="test" id="user_id">
                <div class="col-6">
                  <label class="form-label mt-2" style="color: black; font-weight:500">Department</label>
                  <div class="">
                    <select class="form-select " name="edit_department_name" id="edit_department_name">
                      <option value="">Select</option> @foreach ($data['list_department'] as $item_departement) <option value="{{ $item_departement->id }}" selected>
                        {{ $item_departement->group_name }}
                      </option> @endforeach
                    </select>
                  </div>
                </div>
                <div class="col-6">
                  <label class="form-label mt-2" style="color: black; font-weight:500">Role</label>
                  <div class="">
                    <select class="form-select " name="edit_role_name" id="edit_role_name">
                      <option value="">Select</option> @foreach ($data['list_role'] as $item_role) <option value="{{ $item_role->id }}" selected>{{ $item_role->role_name }}
                      </option> @endforeach
                    </select>
                  </div>
                </div>
                <div class="col-6">
                  <label class="form-label mt-2" style="color: black; font-weight:500">Role</label>
                  <div class="">
                    <input type="text" class="form-control" id="edit_email" name="edit_email">
                  </div>
                </div>
              </div>
              <div class="row mt-2 ">
                <div class="d-flex mt-4 justify-content-end mb-0">
                  <div class="mb-0">
                    <button class="btn text-white" data-bs-dismiss="modal" style="background-color: #D42A34">Cancel</button>
                    <button type="sumbit" class="btn text-white" style="background-color: #62ca50">Submit</button>
                  </div>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>

如何使用jquery获取旧值？

尝试将选择框的代码替换为以下代码。您可以使用以下任何选项：

J查询

$('#edit_department_name').find('option').each((i, v) => { 
// check for each option text to be similar to our group name and 
// then add a selected attribute dynamically.
    if(group_name === v.text) {
        $(v).attr("selected", "selected");
    }
});

或

$('#edit_department_name').find(`option[value="${group_id}"]`).attr("selected", "selected");

**Javascript：**正如您所使用的

const departItems = (selector='#edit_department_name') => [...document.querySelectorAll(selector)]; // get all the option items
departItems(`#edit_department_name option`).map(o => (group_name === o.text) ? $(o).attr("selected", "selected") : '' ); // loop through all the items

让人们知道谁为你工作。

如何在laravel中使用jquery在编辑模态弹出窗口时获取旧值数据选择选项

1条答案

相关问题

热门标签

最新问答