लार्वेल - जावास्क्रिप्ट, PHP, लार्वेल में विकल्प टैग के आधार पर एक टेबल प्रस्तुत करना

मैं एक टेबल प्रस्तुत करने की कोशिश कर रहा हूं जो डेटा प्रदर्शित करता हैएक विकल्प तत्व से संबंधित उपयोगकर्ता उपयोगकर्ता ड्रॉपडाउन से चुनता है। असल में तालिका केवल उनके चयन के आधार पर दिखने वाली जानकारी है, लेकिन मैं (एंट्री लेवल प्रोग्रामर होने के नाते) को यह नहीं पता कि यह कैसे करना है। कोई विचार? यहां मेरा कोड है:

<style>
.tableContainer {
display: none;
}
</style>

<script type="text/javascript">
$(document).ready(function() {

$(".js-example-basic-single").select2();

$("#renderBtn").on("click", function(){
$(".tableContainer").css("display", "block");
});
});
</script>

<select class="js-example-basic-single">
<optgroup label="HTML">
@foreach ($assetList as $asset)
@if($asset->asset_type_id == 1)
<option data-id="{{$asset->asset_id}}" value="{{$asset->title}}">{{$asset->title}}</option>
@endif
@endforeach
</optgroup>
<optgroup label="PDF">
@foreach ($assetList as $asset)
@if($asset->asset_type_id == 2)
<option data-id="{{$asset->asset_id}}" value="{{$asset->title}}">{{$asset->title}}</option>
@endif
@endforeach
</optgroup>
<optgroup label="VIDEO">
@foreach ($assetList as $asset)
@if($asset->asset_type_id == 3)
<option data-id="{{$asset->asset_id}}" value="{{$asset->title}}">{{$asset->title}}</option>
@endif
@endforeach
</optgroup>
</select>
<button id="renderBtn" class="btn">Render Table</button>
<div id="tableContainer" class="tableContainer">
<table id="userAssetTable" class="table">
<thead>
<tr>
<td>Asset ID</td>
<td>Asset</td>
<td>Action Type</td>
<td>Message</td>
<td>Created At</td>
<td>Updated At</td>
</tr>
</thead>
@foreach ($actionList as $action)
<tr>
<td>{{$action->asset_id}}</td>
<td>
@foreach ($assetList as $asset)
@if($action->asset_id == $asset->asset_id)
{{$asset->title}}
@endif
@endforeach
</td>
<td>{{$action->action_type_id}}</td>
<td>{{$action->message}}</td>
<td>{{$action->created_at}}</td>
<td>{{$action->updated_at}}</td>
</tr>
@endforeach
</table>
</div>

उत्तर:

जवाब के लिए 0 № 1

क्या आपने बस इसका उपयोग करने की कोशिश की है डेटा-आईडी में विशेषता विकल्प तत्व, फिर जावास्क्रिप्ट के माध्यम से अपना रास्ता काम करते हैं? उदाहरण के लिए:

<option data-id="exampleID">Option1</option>
<script>
*Use a loop to filter through data here*
</script>

संबंधित सवाल
सबसे लोकप्रिय