I have a form in my view which asks for education qualification of students(I have provided the code below). I want the user (in my case a Student) while filling up the form should be able to dynamically add his/her subjects, total marks and marks obtained in the database table. All thing works fine when i add only one subject. But the problem comes when i try to add multiple subjects. Looking forward for a solution from you people..
This is the form in my view :
<form action="/edu_details" method="post">
#csrf
<div class="jumbotron">
<div class="form-row">
<div class="form-group col-md-12">
<label for="institution">Institution Last Attended</label>
<input type="text" class="form-control" name="institution" id="institution" value="{{old('institution')}}">
#if ($errors->has('institution'))
<div class="error" style="color:red;">{{ $errors->first('institution') }}</div>
#endif
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="yop">Year of Passing</label>
<input type="text" class="form-control" name="yop" id="yop" value="{{old('yop')}}">
#if ($errors->has('yop'))
<div class="error" style="color:red;">{{ $errors->first('yop') }}</div>
#endif
</div>
<div class="form-group col-md-8">
<label for="board">Board</label>
<div class="col-sm-12">
<select name="board" id="board" class="form-control">
<option hidden disabled selected value> -- Select an option -- </option>
<option>SEBA</option>
<option>CBSE</option>
<option>Other</option>
</select>
</div>
#if ($errors->has('board'))
<div class="error" style="color:red;">{{ $errors->first('board') }}</div>
#endif
</div>
</div>
</div>
<div class="jumbotron">
<table class="table table-bordered">
<thead>
<tr>
<th>Name of the Subject</th>
<th>Total Marks</th>
<th>Marks Obtained</th>
<th>+</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="text" name="subj[]" class="form-control">
#if ($errors->has('subj'))
<div class="error" style="color:red;">{{ $errors->first('subj') }}</div>
#endif
</td>
<td>
<input type="text" name="totl" class="form-control">
#if ($errors->has('totl'))
<div class="error" style="color:red;">{{ $errors->first('totl') }}</div>
#endif
</td>
<td>
<input type="text" name="obtn" class="form-control">
#if ($errors->has('obtn'))
<div class="error" style="color:red;">{{ $errors->first('obtn') }}</div>
#endif
</td>
<td>
-
</td>
</tr>
</tbody>
</table>
</div>
<div class="jumbotron">
<div class="form-row">
<label for="sub_group">Group of subjects the applicant wishes to opt :</label>
<div class="form-group col-md-12">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="sub_group" id="sub_group" value="Major">
<label class="form-check-label" for="sub_group">Major</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="sub_group" id="sub_group" value="General">
<label class="form-check-label" for="sub_group">General</label>
</div>
</div>
#if ($errors->has('sub_group'))
<div class="error" style="color:red;">{{ $errors->first('sub_group') }}</div>
#endif
</div>
<div class="form-row">
<div class="col-sm-4">
<label for="pref1">1st Preference</label>
<select name="pref1" id="pref1" class="form-control">
<option hidden disabled selected value> -- Select an option -- </option>
<option>Sub1</option>
<option>Sub2</option>
<option>Sub3</option>
</select>
#if ($errors->has('pref1'))
<div class="error" style="color:red;">{{ $errors->first('pref1') }}</div>
#endif
</div>
<div class="form-group col-md-8">
<label for="prefgroup1"> </label>
<div class="col-sm-12">
<select name="prefgroup1" id="prefgroup1" class="form-control">
<option hidden disabled selected value> -- Select an option -- </option>
<option>Sub1</option>
<option>Sub2</option>
<option>Sub3</option>
</select>
#if ($errors->has('prefgroup1'))
<div class="error" style="color:red;">{{ $errors->first('prefgroup1') }}</div>
#endif
</div>
</div>
</div>
<div class="form-row">
<div class="col-sm-4">
<label for="pref2">2nd Preference</label>
<select name="pref2" id="pref2" class="form-control">
<option hidden disabled selected value> -- Select an option -- </option>
<option>Sub1</option>
<option>Sub2</option>
<option>Sub3</option>
</select>
#if ($errors->has('pref2'))
<div class="error" style="color:red;">{{ $errors->first('pref2') }}</div>
#endif
</div>
<div class="form-group col-md-8">
<label for="prefgroup2"> </label>
<div class="col-sm-12">
<select name="prefgroup2" id="prefgroup2" class="form-control">
<option hidden disabled selected value> -- Select an option -- </option>
<option>Sub1</option>
<option>Sub2</option>
<option>Sub3</option>
</select>
</div>
#if ($errors->has('prefgroup2'))
<div class="error" style="color:red;">{{ $errors->first('prefgroup2') }}</div>
#endif
</div>
</div>
</div>
<button type="submit" class="btn btn-primary btn-block">Submit Data</button>
</form>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(".addRow").on('click', function(){
addRow();
return false;
});
function addRow(){
var tr = '<tr>'+
'<td><input type="text" name="subj[]" class="form-control">#if ($errors->has('subj'))
<div class="error" style="color:red;">{{ $errors->first('subj') }}</div>
#endif </td>'+
'<td><input type="text" name="totl" class="form-control"></td>'+
'<td><input type="text" name="obtn" class="form-control"></td>'+
'<td>-</td>'+
'</tr>';
$('tbody').append(tr);
$('tbody').on('click','.delRow',function(){
$(this).parent().parent().remove();
return false;
});
}
</script>
This is my controller's save method :
public function store(Request $request)
{
$validatedData = $request->validate([
'institution' => 'required|max:255',
'yop' => 'required',
'board' => 'required|max:255',
'subj' => 'required|max:255',
'totl' => 'required',
'obtn' => 'required',
'sub_group' => 'required|max:255',
'pref1' => 'required|max:255',
'prefgroup1' => 'required|max:255',
'pref2' => 'required|max:255',
'prefgroup2' => 'required|max:255',
]);
//Insert student data if validated
$edudetail = new EduDetail();
$edudetail->user_id = Auth::user()->id;
//$edudetail->user_id = DB::table('pictures')->where('user_id', $user_id)->value('id');
$edudetail->institution = $request->input('institution');
$edudetail->yop = $request->input('yop');
$edudetail->board = $request->input('board');
foreach($request->get('subj') as $subj) {
$edudetail->subj[] = $subj;
$edudetail->save();
}
$edudetail->totl = $request->input('totl');
$edudetail->obtn = $request->input('obtn');
$edudetail->sub_group = $request->input('sub_group');
$edudetail->pref1 = $request->input('pref1');
$edudetail->prefgroup1 = $request->input('prefgroup1');
$edudetail->pref2 = $request->input('pref2');
$edudetail->prefgroup2 = $request->input('prefgroup2');
$edudetail->save();
return redirect('/student_dox_upload')->with('success','Education Details saved.');
}
I have tried to see if the values are passed as arrays in case of the subject field using print_r method.. And the values are seen in arrays... that's working fine.. but when i go to save only the last record of the dynamic row gets added.. For example if i add 3 subjects English, Maths and Science.. I want all 3 subjects to be added in a column but only Science is getting added.. Any help is appreciated..
Like the bottom, make a fillable for the input values inside the model
$fillable=['institution',...];
Rules in the file in the request on the path
app \ Http \ Request
Define in a file
And then save the data in the form below
public function store(NewServiceRequest $request,Variable $variable,Variable $variable){
$variable->fill($request->only($variable->getFillable()));
$variable->save();
$variable->variable()->save($variable);
.
.
.
}
I did exactly what you said and it worked for the subjects field... But when I tried to implement your solution with the totl field and obtn field i got an error..
I tried this :
$edudetail = new EduDetail();
$edudetail->user_id = Auth::user()->id;
//$edudetail->user_id = DB::table('pictures')->where('user_id', $user_id)->value('id');
$edudetail->institution = $request->input('institution');
$edudetail->yop = $request->input('yop');
$edudetail->board = $request->input('board');
$edudetail->subj = json_encode($request->get('subj'));
$edudetail->totl = json_encode($request->get('totl'));
$edudetail->obtn = json_encode($request->get('obtn'));
$edudetail->sub_group = $request->input('sub_group');
$edudetail->pref1 = $request->input('pref1');
$edudetail->prefgroup1 = $request->input('prefgroup1');
$edudetail->pref2 = $request->input('pref2');
$edudetail->prefgroup2 = $request->input('prefgroup2');
$edudetail->save();
I got this error :
Illuminate \ Database \ QueryException (22007)
SQLSTATE[22007]: Invalid datetime format: 1366 Incorrect integer value: '["100","100","100","100"]' for column cas_db.edu_details.totl at row 1 (SQL: insert into edu_details (user_id, institution, yop, board, subj, totl, obtn, sub_group, pref1, prefgroup1, pref2, prefgroup2, updated_at, created_at) values (1, Little Flower School, 2004, CBSE, ["Science","Maths","Computer","English"], ["100","100","100","100"], ["72","76","80","78"], General, Sub2, Sub1, Sub3, Sub2, 2019-07-28 11:21:24, 2019-07-28 11:21:24))
I try to make it possible to lend two books at once my problem is that only one value gets forwarded. The form looks like this:
In the view I tried to rename the field to "serial number2" because I thought that he just ignored the second serial number because of the same name.
This is my View:
<div class="card">
<div class="card-header">{{ __('Lend a book') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('borrow.store') }}">
#csrf
<div class="form-group row">
<label for="serialnumber" class="col-md-4 col-form-label text-md-right">{{ __('Please scan the Serialnumber of the book') }}</label>
<div class="col-md-6">
<input id="serialnumber" type="text" class="form-control{{ $errors->has('serialnumber') ? ' is-invalid' : '' }}" name="serialnumber" value="{{ old('serialnumber') }}" required #if (Session::has('autofocus')) autofocus #endif>
#if ($errors->any())
<div class="alert alert-danger">The book is not in stock.
<ul>
</ul>
</div>
#endif
</div>
</div>
<div class="form-group row">
<label for="serialnumber" class="col-md-4 col-form-label text-md-right">{{ __('') }}</label>
<div class="col-md-6">
<input id="serialnumber" type="text" class="form-control{{ $errors->has('serialnumber') ? ' is-invalid' : '' }}" name="serialnumber" value="{{ old('serialnumber') }}" required #if (Session::has('autofocus')) autofocus #endif>
#if ($errors->any())
<div class="alert alert-danger">The book is not in stock..
<ul>
</ul>
</div>
#endif
</div>
</div>
<div class="form-group row">
<label for="comment" class="col-md-4 col-form-label text-md-right">{{ __('comment') }}</label>
<div class="col-md-6">
<!-- <input id="ma_id" type="text" class="form-control{{ $errors->has('ma_id') ? ' is-invalid' : '' }}" value="{{ old('ma_id') }}" required> -->
<input id="comment" type="text-field" class="form-control" name="comment" placeholder="Test">
#if ($errors->has('comment'))
<span class="invalid-feedback">
<strong>{{ $errors->first('comment') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="ma_id" class="col-md-4 col-form-label text-md-right">{{ __('scan membercard to identify yourself') }}</label>
<div class="col-md-6">
<!-- <input id="ma_id" type="text" class="form-control{{ $errors->has('ma_id') ? ' is-invalid' : '' }}" value="{{ old('ma_id') }}" required> -->
<input id="ma_id" type="password" class="form-control" name="ma_id" required>
#if ($errors->has('ma_id'))
<span class="invalid-feedback">
<strong>{{ $errors->first('ma_id') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('send') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
#endsection
This is my Controller:
public function store(bookRequest $request)
{
//if( !book::find($request->get('serialnumber'))->exists() ) {
$this->middleware('guest');
request()->validate([
'serialnumber' => 'required',
'serialnumber' => 'required',
'ma_id' => 'required'
]);
book::create($request->all());
return redirect()->route('book.index');
}
There is no error but the problem is that he writes only one serial number into the database as described above and completely ignores the other one that comes into the second field. My question is what I have to adjust so that the second serial number with the same data can be written into the database.
You cannot have two items with the same name (for example serialnumber) in the same form, otherwise only one value is going to be processed. Please check the inspection tool in the browser. If you need multiple inputs with the same "name" append [] to the name (for example name=serialnumber[]).
More info at HTML 5 spec
In the other hand, you have multiple items with the same ID. That's another issue to fix in some point.
Once you have your data in the controller you will have to generate your insert data accordingly
$requestData = $request->validated();
$data = [
[
'serialnumber' => $requestData['serialnumber'][0],
'comment' => $requestData['comment'],
'ma_id' => $requestData['ma_id']
],
[
'serialnumber' => $requestData['serialnumber'][1],
'comment' => $requestData['comment'],
'ma_id' => $requestData['ma_id']
]
];
Book::insert($data);
Make input's name as array.
Replace name="serialnumber" with name="serialnumber[]". When form is submitted, you will receive an array with both serial numbers.
I'm working on a Laravel application. In my view i have a form, what I'm trying to do is when submitting the form and one field is not valid, it returns the values of valid fields, so the user will have to edit the wrong field only, not the full form.
This is my form and an example. In here, the user didn't enter the url, so it shows an error message and return the values of the correct fields (client, domain provider, etc...) The problem i'm facing is this is not working for the avatar field and service field!
I'm returning the value by adding value="{{ old('client') }}" to the input tag , as shown in code below:
<div class="form-group row">
<label class="col-lg-3 col-form-label">Client:</label>
<div class="col-lg-9">
<input type="text" class="form-control" name="client" value="{{ old('client') }}">
<small class="error">{{$errors->first('client')}}</small>
</div>
</div>
QUESTION: How to add it for avatar and select service fields?
Avatar: - currently its not returning the value
<div class="form-group row">
<label class="col-lg-3 col-form-label">Attach avatar:</label>
<div class="col-lg-9">
<input type="file" class="form-input-styled" data-fouc="" name="avatar" value="{{ old('avatar') }}">
<small class="error">{{$errors->first('avatar')}}</small>
</div>
</div>
Select service:
<div class="form-group row">
<label class="col-lg-3 col-form-label">Select Service:</label>
<div class="col-lg-9">
<select data-placeholder="Select service" class="form-control form-control-select2" data-fouc="" name="service" >
<option></option>
<option value="Website">Website</option>
<option value="Application">Application</option>
</select>
<small class="error">{{$errors->first('service')}}</small>
</div>
</div>
For the select tag ,
you must put a condition for every option tag ,
if the last submitted value is equal to this option value put selected
attribute to this option
something like that ....
<div class="form-group row">
<label class="col-lg-3 col-form-label">Select Service:</label>
<div class="col-lg-9">
<select data-placeholder="Select service" class="form-control form-control-select2" data-fouc="" name="service" >
<option></option>
<option value="Website" {{ old('service') == "Website" ? "selected" : ""}}>Website</option>
<option value="Application" {{ old('service') == "Application" ? "selected" : "">Application</option>
</select>
<small class="error">{{$errors->first('service')}}</small>
</div>
</div>
hi for select tag this work for me
<div class="form-group row">
<label class="col-lg-3 col-form-label">Select Service:</label>
<div class="col-lg-9">
<select data-placeholder="Select service" class="form-control form-control-select2" data-fouc="" name="service" >
<option></option>
#foreach($Listservice as $key)
<option value ="{{$key->id}}"> {{$key->Website}}
{{$key>Application}}</option>
#endforeach
</select>
</div>
</div>
and in your model add these
$listservice = Service::get();
i hope it s help
I have a form which contain a date picker / calender, email, city name and hotel name, I want a user to select a date and enter other fields and submit the data.
This is what I have.
HTML:
<form [formGroup]="angForm" class="form-element">
<div class="form-group">
<label for="dateOfBirth">Date of Birth</label>
<input id="dateOfBirth" name="dateOfBirth" [(ngModel)]="dateOfBirth" type="text" bsDatepicker class="form-control" />
</div>
<div class="form-group form-element_email">
<input type="email" class="form-control info" placeholder="Email" formControlName="email" #email (ngModelChange)="onChange($event)">
</div>
<div *ngIf="angForm.controls['email'].invalid && (angForm.controls['email'].dirty || angForm.controls['email'].touched)"
class="alert alert-danger">
<div *ngIf="angForm.controls['email'].errors.required">
Email is required.
</div>
</div>
<div class="input-group mb-3 form-element_city">
<select class="custom-select" id="inputGroupSelect01" #cityName>
<option selected *ngFor="let city of cities" [ngValue]="city.name">{{city.name}}</option>
</select>
</div>
<div class="input-group mb-3 form-element_hotel">
<select class="custom-select" id="inputGroupSelect01" #hotelName>
<option selected *ngFor="let hotel of hotels" [ngValue]="hotel.name">{{hotel.name}}</option>
</select>
</div>
<div class="form-group">
<button type="submit" (click)="addReview(email.value, cityName.value , hotelName.value)" class="btn btn-primary btn-block form-element_btn"
[disabled]="!validEmail">Book</button>
</div>
</form>
This dispalys the following result: wrong one
Instead of that input with date picker , I just want the full calender to be display on the left side ,
Here is what I want . Good one
I tried many solution online I could not be able to solve my problem,
What do I need to change in my code to get the result I want? please Am newbie though, thanks
You can actually provide placement in the element which uses bdDatepicker directive.
Just set this placement property to left value.
Here is example in documentation.
https://valor-software.com/ngx-bootstrap/#/datepicker#placement
I am trying to create a search form similar to the one found on eBay
using bootstrap. I would like to combine my input and select fields so that they look as the input and select fields in the eBay search bar, but I can't seem to format it to make it look like it.
This is what I have so far:
<form class="form-inline text-center" style="padding-top:50px" role="form" method="get" action="addauction.php">
<fieldset style="padding-top:50px">
<!-- Search Name -->
<div class="form-group">
<label class="sr-only" for="item-name">Product Name</label>
<input id="item-name" name="item-name" placeholder="Product Name" class="form-control">
</div>
<!-- Search Category -->
<div class="form-group">
<label class="sr-only" for="item-category">Product Category</label>
<select id="item-category" name="item-category" class="form-control">
<option selected disabled hidden>Category</option>
<?php
$sql = 'SELECT * FROM Category';
foreach ($db -> query($sql) as $row) { ?>
<option value = "<?php echo $row['category_id']; ?>"><?php echo $row['category']; ?></option>
<?php } ?>
</select>
</div>
<!-- Search Auction -->
<div class="form-group">
<label class="sr-only" for="submit">Ready to Submit?</label>
<button type="submit" class="btn btn-primary"><span
class="glyphicon glyphicon-search" aria-hidden="true"></span></button>
</div>
</fieldset>
</form>
And this is how it looks:
https://jsfiddle.net/DTcHh/17749/
I have been reading about using input-group but from what I have gathered it makes it way harder to get the selected value. Any help on how to amend my code so that it looks like the eBay search form by only modifying the HTML or CSS would be deeply appreciated.
Thanks in advance!