Validation of invisible fields on submit - validation

(Symfony 2.8)
I want to insert data into a form as steps in a process.
The field to validate is in "Descripción" tab and the submit buttons are in the "Guardar/Revisión" tab.
When I click the submit button, it displays the error "An invalid form control with name='form[proDescripcion]' is not focusable" in the Chrome debug console.
Is it possible to correct the error without changing the design?
<div id="tabs-1">
<p>Descripción</p>
<div class="inputText">
<div class="label">
<label for='proDescripcion' >{{ form_label(form.proDescripcion) }}</label>
</div>
<div class="input">
{{ form_widget(form.proDescripcion) }}
</div>
</div>
</div>
<div id="tabs-2">
<p>Imagen/Documento</p>
</div>
<div id="tabs-3">
<p>Datos</p>
</div>
<div id="tabs-4">
<p>Guardar/Revisión</p>
{{ form_row(form.save) }}
{{ form_row(form.finish) }}
</div>

You can add a "novalidate" attribute to your form
{{ form_start(contact, {attr: {novalidate: 'novalidate'}}) }}
With this attribute, HTML5 will not try to validate your form on submit. Don't forget to do it on the server-side with assert annotation.

Related

i cant add image to my new blog post in django

kindly help me, i am using class based views now am about to create new post using Createview i added all the fields including an image which stands for the thumbnail so if i go to http://127.0.0.1:8000/pages/blog/new/ i get a form and if i fill in the fields and submit i get return back to the form saying the image fields is required meanwhile i already inserted an image , this is the error in picture
and this is my code below
views.py
class BlogCreateView(LoginRequiredMixin, CreateView):
model = Blog
fields = ['title', 'categories', 'overview', 'thumbnail', 'summary']
blog_form.html
<div class="content-section text-center">
<form method="POST">
{% csrf_token %}
<fieldset class="form-group ">
<legend class="border-bottom mb-4 h2">Blog Post</legend>
{{ form|crispy }}
</fieldset>
<div class="form-group">
<button class="btn btn-outline-info" type="submit">Post</button>
</div>
</form>
</div>
You need to add "enctype="multipart/form-data" to your form, so:
<form method="post" enctype="multipart/form-data">
See detailed explanation is this elaborate answer:
What does enctype='multipart/form-data' mean?

making pagination in laravel for image

Hello for everyone I have a problem in laravel that about the showing images in one view, the problem is: I have a page that just show the images but it show all the images stored in table with specific id but I want to show some of that and have a button (show more) and when click on button it show the other images I don't know hove can I do this if someone can help me please!
This is my controller code:
public function listHostel()
{
$hostels = Hostel::all();
return view('front/khabgah_list',compact('hostels'));
}
And this is my blade code:
#foreach($hostels as $hostel)
#foreach($hostel->attachments as $photo)
<div class=" col-12 col-sm-6 col-md-6 col-lg-3 px-1 mt-3">
<div class="card card-shadow custom-height-1 " style="border-radius: 0%">
<a href="">
<img src="/assets-/app/media/img/blog/hostels-img/{{$photo->file_name}}"
class="card-img-top card-img custom-card-img-height" alt="">
</a>
<div class="car-body">
<div class="card-footer">
<div class="custom-circle">
<p class="custom-circle-text card-text">
<b>
#if($hostel->type == 1)
{{ 'ذکور'}}
#else
{{ 'اناث' }}
#endif
</b>
</p>
</div>
<div class="custom-prices card-text text-left"> کرایه فی ماه
: {{$hostel->remark }}
</div>
</div>
</div>
</div>
</div>
#endforeach
#endforeach
Pagination is likely what you're looking for. Change your controller to:
public function listHostel()
{
$hostels = Hostel::all()->paginate(5);
return view('front/khabgah_list',compact('hostels'));
}
Then you can get the links in your Blade template:
{{ $hostels->links() }}
You might need to change it a bit to work for your specific situation. The documentation gives some more info: https://laravel.com/docs/5.8/pagination

view new div based on option value of select tag using laravel

i have a dropdown list when i select any one option from list i should display an another form with name of the teacher and subject of the teacher in textbox.The form is not displaying.when i select one item it should display the selected name and description box to add subjects of teachers that they interested please help me
view page
<div class="portlet light bordered row">
<h1>Add teacher subject</h1>
<div class="row">
<form action = "{{ url('subjectby/adding/process') }}" method = "POST">
{{ csrf_field() }}
<div class= "col-md-12">
<div class="form-group">
<h3>Choose Teachers </h3>
<div class="input-group">
<div class="ui-widget border-dropdown" style="margin-left:50px;">
<select id="teacher" name="teachers" placeholder="Select Teacher">
<option value="">Select Teacher</option>
#foreach($user as $tec)
<option value="{{$tec->id}}">{{$tec->name}}</option>
#endforeach
</select>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="new">
<div class="form-group">
<div class="col-sm-6">
<label for="inputFacebook">Teacher Name</label>
<input type=hidden value="{{$tec->id}}" name="id">
<input type="text" value="{{$tec->name}}" class="form-control" name="name">
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<label for="inputDescription">Subject Interested</label>
<textarea class="form-control" rows="8" name="intr" placeholder="Enter Subject Interest"> </textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="submit" value="add" name=b1>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
This isn't a Laravel specific problem. You are taking about DOM manipulation and so you best bet is to use jQuery or Vuejs or even vanilla Javascript if you so choose. Basically, you will write a script to watch for when your <select> changes, and then based on it's new value, show the part of the form you want.
Keep in mind that Laravel is a backend framework and so the user will never interact with it on a page. After a page loads, Laravel has done all it can do until another request is made. This is why Javascript was born - to let the user change things without reloading the page.

How to do autocomplete validation in Angular2?

I have been trying to implement an auto-complete to an input in my form in angular2. I want to show second hidden div if the input is invalid. Could you help me how to do that please?
<div class="form-group">
<div *ngSwitchCase="'organisation'">
<label [attr.for]="parameter.ObjectID" [innerHtml]="parameter.paramLabel"> </label>
<input [id]='parameter.ObjectID' class="form-control" type="text" [(ngModel)]="parameter.value" (keyup)="filter()" (change)="filter()" (blur)="filter()" [required]="parameter.mandatory" name="mandatory" #mandatory="ngModel">
<div *ngIf="companyNames.length > 0">
<ul *ngFor="let item of filteredCompanyList">
<li>
<a (click)="select(item)">{{item}}</a>
</li>
</ul>
</div>
<div [hidden]="!parameter.mandatory || mandatory.valid || mandatory.pristine" class="alert alert-danger">Please do not leave this field blank</div>
<div [hidden]="temp(mandatory)" class="alert alert-danger">The organisation entered was either not found or does not subscribe to the product</div>
</div>
The second hidden div will be displayed if your function temp() returns false.
All your checks (input valid?) you have to do in this function.
UPDATE:
Just use this [hidden]="filteredCompanyList.length > 0" to show/hide your div.

Bootstrap classes for laravel 5 form submit button

Below is the part of input field and submit button.
I want to increase the width of submit button as the input field using bootstrap.
Here is my code.
<div class="form-group col-md-6">
{!! Form::label('Event Photo') !!}
</div>
<div class="form-group col-md-6">
<input type='file' name='photo' id ='photo' class ='form-control'/>
</div>
<div class="form-group col-md-12">
{!! Form::submit('Add', array('class'=>'btn btn-primary')) !!}
</div>
But the button size can't get increased like that. Where am I wrong? How should I solve that?
The array() part of your form allows you to pass in any other parameters that you want.
Just as you are using it to define the class, you can use it to define the style:
<div class="form-group col-md-12">
{!! Form::submit('Add', array('class'=>'btn btn-primary', 'style' => 'width:50px;)) !!}
</div>
Just change 50px to whatever width you want to use.
Adding the class btn-lg will work.
You can find that in the documentation

Resources