Как показать / Скрыть в соответствии с перенаправлением страницы?

Question

снимок экрана2

screenshot1

У меня 4поля в форме

1. Поле продукта.
2. Поле бренда.
3. Поле услуг.

Я хочу показать их все виндекс, но когда я иду к URL продукта, я хочу показать только поле продукта и поле услуг

Я попробовал метод .show and hide, но он скрывает поле для всех URL

Iя пытаюсь скрыть этот метод, и теперь он скрывается в соответствии с моим запросом, но идет на компромисс в поле формы, и я не хочу, чтобы там было пустое пробел.

Проблема была другой, и теперь она исправлена.Я создал другой идентификатор и вызвал конкретный идентификатор без ущерба для поля и всего, и теперь он работает как шарм.

<div style="display:none;" class="appointment" id="booking-form-modal" data-backdrop="static" data-keyboard="false">

  <form method="POST" action="/submit-request" onsubmit="submitRequest();">
  <input type="hidden" name="_token" value="{{ csrf_token() }}">

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
        <select id="productDropdown" class="form-control" name="product" required>
        <option value="">Select Products</option>
        @foreach($products as $product)
        <option value="{{ $product['id']}}">{{ $product['name']}}</option>
        @endforeach

          </select>
        </div>
      </div>
    </div>

      <div  class="row" >
        <div class="col-md-12">
          <div class="form-group">
          <select id="brandDropdown" class="form-control" name="brands" required>
            <option value="">Select Brands</option>
          </select>
          </div>
        </div>
      </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
        <select id="serviceDropdown" class="form-control" name="services" required>
          <option value="">Select Services</option>
        </select>
        </div>
      </div>
    </div>
  </form>
</div>

Скрипт для перенаправления в соответствии с запросом

    <script type="text/javascript">
 window.addEventListener('load', function() {
    if(/services|1800/.test(window.location.href))
    {
      document.getElementById('brandDropdown').style.display = 'none';
    }
});



</script>

Answer 1

Решение было в том, что я добавил еще один идентификатор, чтобы он не скомпрометировал мои поля формы. Пожалуйста, найдите решение ниже.

<div id="branddrop-row" class="row" >
    <div class="col-md-12">
      <div class="form-group">
      <select id="brandDropdown" class="form-control" name="brands" required>
        <option value="">Select Brands</option>
      </select>
      </div>
    </div>
  </div>

А вот и скрипт для сокрытия согласно запросу. Я называю div id вместо select id, чтобы он не скомпрометировал мои поля формы.

 <script type="text/javascript">
 window.addEventListener('load', function() {
    if(/services|1800/.test(window.location.href))
    {
      document.getElementById('branddrop-row').style.display = 'none';
    }
});



</script>

Answer 2

Как выглядит ваш URL и когда вы вызываете предоставленный фрагмент? Не могли бы вы также предоставить более подробный пример кода?

Полагаю, вы хотите скрыть элементы "onload"? Если это так, то вам нужно дождаться загрузки ваших элементов.

window.addEventListener('load', function() {
    if(/repair/.test(window.location.href)) 
    { 
      document.getElementById('brandDropdown').closest('.row').style.display = 'none'; 
    }
});