How to add placeholders inside div tag

Question

How can i add a placeholder for my dropdown inside a div tag? I have a dropdown which is being called out from another blade.php and i call that with

<div class="col-md-4 dropdowns">
    @include('applicants.for-deployment.fields_edit_rider_type')
</div>

Tried inserting

<select>
    <option value="" disabled selected hidden>Select Rider Type</option>
</select>

But it made my dropdown a mess. So i was wondering how can i insert a placeholder for my dropdown? Can i do it in the div tag?

Update:

Output with my current code

Output with select and option tags

You can't modify the select dropdown? also read [this](https://stackoverflow.com/questions/5805059/how-do-i-make-a-placeholder-for-a-select-box) — Sfili_81, Sep 09 '20 at 13:05
Can you post a screenshot or post the html that is output by your php — Dan Mullin, Sep 09 '20 at 13:25
I have 3 dropdowns for this page but i have a script that hides unless an event change has been made. For this dropdown field i only have 2 options. I wanted to insert a placeholder to make this dropdown run smoothly. With my current code, i have to select the other option to show the next dropdown — Joshua, Sep 09 '20 at 13:40
It appears that your php is generating a drop down that isn’t in a select element. If you put the php inside of your select then change it to only output option tags, it will work as intended but might not be styled the way you want it. — Dan Mullin, Sep 09 '20 at 13:53

score 0 · Answer 1 · answered Sep 09 '20 at 13:57

If you have your php generate a list of option elements, then you could create the menu this way:

<select>
    <option value="" disabled selected hidden>Select Rider Type</option>
    @include('applicants.for-deployment.fields_edit_rider_type')
</select>

If the php generates a dropdown that isn’t in a select element you’ll have to come up with a custom solution to make your own placeholder

score 0 · Answer 2 · answered Sep 09 '20 at 14:18

change to this and bass you list selecte

<div class="col-md-4">
   @include('applicants.for-deployment.fields_edit_rider_type',['mylists' => $mylists,'selecte_id'=>$selecte_id])
</div>

in your blade dropdowns include

<select class="dropdowns">
    <option value="" disabled selected hidden>Select Rider Type</option>
       @forelse($mylists as $mylist)
           <option value="{{ $mylist->id }}" {{ $selecte_id == $$mylist->id ? 'selected' : '' }}> {{ $value }}</option>
       @empty
              <option value="" disabled>No Data</option>
       @endforelse
    </select>

How to add placeholders inside div tag

2 Answers2