How to access the value from select2 in django - ajax

I'm a beginner in this.I have a select2 plugin with multiple inputs.I want to get all the option values when submitted as an array (to query in views.py).
for eg: [2,134,4,65]
template
<div class="col-sm-9">
<h1>Hello {{user.first_name}} {{user.last_name}}....</h1>
<h4>Please Specify Your Symptoms</h4>
<select class="js-example-basic-multiple" name="states[]" multiple="multiple" style="width:300px">
{% for sym in all_symptoms %}
<option value={{sym.syd}}>{{sym.symptoms}}</option>
{% endfor %}
</select>
<button type="submit" class="btn btn-success">Submit</button>
</div>
<script>
$(document).ready(function() {
$('.js-example-basic-multiple').select2();
});
</script>
views.py

change this line
<select class="js-example-basic-multiple" name="states[]" multiple="multiple" style="width:300px">
to
<select class="js-example-basic-multiple" name="states" multiple="multiple" style="width:300px">
and in django view
request.POST.getlist('states')

Related

Select2 not showing dropdown list after changing page - livewire

Hi i have a problem about select2 and livewire, after go to another page and back to dashboard the dropdown list of select2 dissapeared, i checked the source the list still on there and not loaded
<script>
$(document).ready(function() {
$('.live-search').select2({
placeholder: 'Search Services',
// allowClear: true,
});
$('.live-search').on('change', function(e) {
Livewire.emit('servicesId', e.target.value);
});
});
</script>
<div class="form-group" wire:ignore>
<label>Services :</label>
<select class="form-control live-search" wire:model='servicesId'>
#foreach ($data as $service)
<option value="{{ $service->id }}">{{ Str::ucfirst($service->service_name) }} -
Rp.{{ $service->price }}
</option>
#endforeach
</select>
<hr />
</div>

I want to get data to the dropdown by using another dropdown in the same page

I have a dropdown on my page to load districts. And I have another dropdown to load Divisions according to that selected district. The below code I have got all the divisions. But I want only the divisions according to the selected districts. How can I do?
#php
$districtAll=\App\District::all();
#endphp
<div class="row">
<label class="col-md-4 control-label" for="district">9. District</label>
<div class="col-md-8">
<select name="district">
<option type="text" class="detail-wp" value="">Select District</option>
#foreach($districtAll as $all)
<option value="{{$all->DISTRICT_ID}}">{{$all->DISTRICT}} </option>
#endforeach
</select>
</div>
</div>
<br>
#php
$getDsAll=\App\DsDivision::all();
#endphp
<div class="row">
<label class="col-md-4 control-label" for="ds_division">10. DS Division</label>
<div class="col-md-8">
<select name="ds_division" class="form-control">
<option type="text" class="detail-wp" value=""></option>
#foreach($getDsAll as $all)
<option value="{{$all->DIVISION_ID}}">{{$all->DIVISION}} </option>
#endforeach
</select>
</div>
</div>
You can do it using ajax request:
$('select[name=district]').on('change', function(){
$districtId = $(this).val();
$.get('/division/district/'+$districtId).done(function(res){
$.each(res, function (key, value) {
$('select[name=ds_division]').append(`<option value='` + value.id + `'>` + value.name +`</option>`);
});
});
to make this working you will need a route like
Route::get("/division/district/{district}", "DivisionController#getByDistrictId");
DivisionController#getByDistrictIdwill be
public function getByDistrictId($district)
{
return Division::where('district_id',$district)->get();
}
this code just to give you an idea of how you can do it.

Get input value and pass it to route in same blade file Laravel 5.7

I want to pass selected value from dropdown to be passed throw routing from the same blade file
Here is my blade code :
<div class="form-group col-md-2">
<label>#lang('site.son')</label>
#if(Auth::user()->shortsign == '--')
<select class="select2-size-lg form-control border-primary" style="width: 100%;" name="sign">
#foreach ($users as $user)
<option value="{{ $user->shortsign }}">{{ $user->shortsign }}</option>
#endforeach
</select>
#else
<select class="select2-size-lg form-control border-primary" style="width: 100%;" name="sign" readonly>
<option value="{{ Auth::user()->shortsign }}">{{ Auth::user()->shortsign }}</option>
</select>
#endif
</div>
<div class="form-actions right">
<i class="la la-search" aria-hidden="true"></i> #lang('site.search')
</div>
Now the code iam using pass the last value from database not selected value
you can try this by giving id to your anchor tag
<script type="text/javascript">
$('.select2-size-lg').change(function () {
var id = $(this).val();
document.getElementById("abc").href="{{ url('/salereports/report/' . id) }}";
});
</script>

print result after submitting in laravel

how can I create a submit button that can show the pdf result of my form to print it directly?
this is my code below
<form method="post" action="{{ url('dashboard/generate') }}" enctype="multipart/form-data" id="form-ui">
{{ csrf_field() }}
<div class="col-md-6 col-xs-12">
<label for="exampleInputEmail1">Distributor</label>
<select name="distributor" id="type" class="form-control">
<option value="">Choose Distributor</option>
#foreach ($distributor as $item)
<option value="{{ $item->id }}">{{ $item->name }}</option>
#endforeach
</select>
</div>
<div class="col-md-6 col-xs-12">
<label for="exampleInputEmail1">Select Event</label>
<select name="event" id="type" class="form-control">
<option value="">Choose Event</option>
#foreach ($event as $item)
<option value="{{ $item->id }}">({{ $item->events->date }}, {{ $item->time }}, {{ $item->events->stage }})-{{ $item->title }}</option>
#endforeach
</select>
</div>
<div class="col-md-12 col-xs-12" style="margin-top: 10px;">
<button class="btn btn-success" type="submit" onclick="myFunction()">SUBMIT</button>
</div>
</form>
<script>
function myFunction() {
window.print();
}
</script>
but it just print the current page (the form page). any advice i can try?
try this onsubmit jquery event
<div class="col-md-12 col-xs-12" style="margin-top: 10px;">
<button class="btn btn-success" type="submit" name="submit">SUBMIT</button>
</div>
<script>
$(document).ready(function(){
$('body').on('submit', '.formsubmit', function(e) {
alert(1);
});

Flatpickr creates additional input field

I'm implementing a project in laravel. There is a view with some input fields. One of them should be viewed with flatpickr. Although default options are used, flatpickr adds always an additional input field. I want to use my defined input field with flatpickr.
Generated code:
I tried already to override the default option with altInput: false but this doesn't work at all.
#extends('layouts.app')
#section('content')
<div class="card">
<div class="card-header">
<h3>Buchung {{ isset($booking) ? 'ändern' : 'anlegen' }}</h3>
</div>
<div class="card-body">
<form method="post" action="{{ isset($booking) ? route('bookings.update', $booking->id) : route('bookings.store') }}">
#csrf
#if (isset($booking))
#method('PUT')
#endif
<div class="form-group">
<label for="project">Projekt</label>
<select name="project" class="form-control">
#foreach ($projects as $project)
<option value="{{ $project->id }}">{{ $project->name }}</option>
#endforeach
</select>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label for="date">Datum</label>
<input type="text" id="date" name="date" class="form-control">
</div>
...
#endsection
#section('scripts')
<script>
flatpickr('#date');
</script>
#endsection
I had a similar problem, flatpickr was creating a new input field - hidden, it did not create a new input field visible in the browser - because altInput: was set to true. I am not sure if you can set it to false without compromising what you want to achieve, but maybe this leads you in the right direction to fix it?

Resources