Feat: Add target group selection dropdown in activities form

This commit is contained in:
Sallu9007
2025-04-20 22:42:48 +05:30
parent 36d36df47b
commit 1c978d14cb
3 changed files with 44 additions and 6 deletions

View File

@@ -40,7 +40,14 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<label for="target_audience" class="block text-sm font-medium text-gray-700">Target Audience</label>
<input type="text" name="target_audience" id="target_audience" class="block w-full mt-1 border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" required>
<select name="target_audience" id="target_audience" class="block w-full mt-1 border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" required>
<option value="">Select</option>
@if(isset($dropdowns['target_groups']) && is_array($dropdowns['target_groups']))
@foreach($dropdowns['target_groups'] as $key => $label)
<option value="{{ $key }}">{{ $label }}</option>
@endforeach
@endif
</select>
</div>
<div>
<label for="number_of_participants" class="block text-sm font-medium text-gray-700">Number of Participants</label>
@@ -174,7 +181,7 @@
}
}
document.addEventListener('DOMContentLoaded', function () {
document.addEventListener('DOMContentLoaded', function() {
// Initialize Select2 for resource_person_name
$('#resource_person_name').select2({
tags: true,
@@ -183,21 +190,28 @@
url: '{{ route('api.users.index') }}', // Adjust this route to fetch user names
dataType: 'json',
delay: 250,
processResults: function (data) {
processResults: function(data) {
return {
results: data.map(user => ({ id: user.name, text: user.name }))
results: data.map(user => ({
id: user.name,
text: user.name
}))
};
},
cache: true
}
});
$('#resource_person_name').on('change', function () {
$('#resource_person_name').on('change', function() {
const selectedValues = $(this).val();
document.getElementById('resource_person_name_hidden').value = selectedValues.join(', ');
});
// Initialize Select2 for activity_type, category, and level
$('#target_audience').select2({
placeholder: 'Select Target Audience',
allowClear: true
});
$('#activity_type').select2({
tags: true,
placeholder: 'Select Activity Type',

View File

@@ -47,8 +47,19 @@
<!-- Target Audience -->
<div>
<label for="target_audience" class="block text-sm font-medium text-gray-700">Target Audience</label>
<input type="text" name="target_audience" id="target_audience" value="{{ old('target_audience', $response->target_audience) }}" class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md" required>
<select name="target_audience" id="target_audience" class="block w-full mt-1 border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" required>
<option value="">Select</option>
@if(isset($dropdowns['target_groups']) && is_array($dropdowns['target_groups']))
@foreach($dropdowns['target_groups'] as $key => $label)
<option value="{{ $key }}" {{ old('target_audience', $response->target_audience ?? '') == $key ? 'selected' : '' }}>{{ $label }}</option>
@endforeach
@endif
</select>
</div>
<!-- <div>
<label for="target_audience" class="block text-sm font-medium text-gray-700">Target Audience</label>
<input type="text" name="target_audience" id="target_audience" value="{{ old('target_audience', $response->target_audience) }}" class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md" required>
</div> -->
<!-- Number of Participants -->
<div>
@@ -245,6 +256,10 @@
endDateField.addEventListener('change', calculateDays);
// Initialize Select2 for activity_type, category, and level
$('#target_audience').select2({
placeholder: 'Select Target Audience',
allowClear: true
});
$('#activity_type').select2({
tags: true,
placeholder: 'Select Activity Type',