I am doing an inventory management page for my school project, and currently, the form whihroducts is shifted to the left.
How it looks like:
{% extends "base.html" %}
{% block title %}Adding a new product{% endblock %}
{% block content %}
{% from "includes/formHelper.html" import render_field %}
<h1 class="display-4">Add new product</h1>
<form method="POST" action="">
<!-- Container class for Form -->
<div id="container py-2">
<div class="form-group" >
<div class="col-sm-3 order-5 float-right py-2">
{{ render_field(form.name, class="form-control") }}
</div>
</div>
<div class="form-group">
<div class="col-sm-3 order-5 float-right py-2">
{{ render_fiel {{ render_field(form.type, class="form-control") }}
</div>
</div>
<div class="form-group">
<div class="col-sm-3 order-5 float-right py-2">
d(form.stock, class="form-control") }}
</div>
</div>
<div class="form-group">
<div class="col-sm-3 order-5 float-right py-2">
{{ render_field(form.price, class="form-control") }}
</div>
</div>
</div>
<input type="submit" value="Submit" class="btn btn-success btn-lg float-left">
</form>
I tried using CSS to float-right and row-reverse the entire form to the right of the page, but it still does not work out.
Related
I have a form in which some inputs are disabled but have default values generated and set before the form loads (I can see the default values on the form inputs which are disabled). On form submission, the controller validates the form values before creating an entry in the database. My problem is the disabled inputs with the default values are being seen as blank and I keep getting an error that the input values are requried
HTML
<form enctype="multipart/form-data" method="POST" action="{{ route('admins.store') }}">
#csrf
<div class="row">
<div class="col-md-5">
<div class="form-group">
<label class="bmd-label-floating">Admin Names</label>
<input type="text" name="name" class="form-control {{ $errors->has('name') ? 'error' : '' }}" id="name">
<!-- Error -->
#if ($errors->has('name'))
<div class="error">
{{ $errors->first('name') }}
</div>
#endif
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="bmd-label-floating">Admin ID</label>
<input type="text" name="adminID" value="{{ $adminID }}" class="form-control {{ $errors->has('adminID') ? 'error' : '' }}" id="adminID" disabled>
<!-- Error -->
#if ($errors->has('adminID'))
<div class="error">
{{ $errors->first('adminID') }}
</div>
#endif
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="bmd-label-floating">Admin Email</label>
<input type="email" name="email" class="form-control {{ $errors->has('email') ? 'error' : '' }}" id="email">
<!-- Error -->
#if ($errors->has('email'))
<div class="error">
{{ $errors->first('email') }}
</div>
#endif
</div>
</div>
</div>
<div class="row">
<div class="col-md-5">
<div class="form-group">
<label class="bmd-label-floating">Phone Number</label>
<input type="text" name="phonenumber" class="form-control {{ $errors->has('phonenumber') ? 'error' : '' }}" id="phonenumber">
<!-- Error -->
#if ($errors->has('phonenumber'))
<div class="error">
{{ $errors->first('phonenumber') }}
</div>
#endif
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="bmd-label-floating">Access Level</label>
<input type="text" name="accessLevel" value="admin" class="form-control {{ $errors->has('accessLevel') ? 'error' : '' }}" id="accessLevel" disabled>
<!-- Error -->
#if ($errors->has('accessLevel'))
<div class="error">
{{ $errors->first('accessLevel') }}
</div>
#endif
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label class="bmd-label-floating">Password</label>
<input type="text" name="password" value="{{ $password }}" class="form-control {{ $errors->has('accessLevel') ? 'error' : '' }}" id="password" disabled>
<!-- Error -->
#if ($errors->has('password'))
<div class="error">
{{ $errors->first('password') }}
</div>
#endif
</div>
</div>
</div>
<button type="submit" class="btn btn-primary pull-right">Add Admin</button>
<div class="clearfix"></div>
</form>
Controller:
if(Auth::check())
{
$this->validate($request, [
'name' => 'required',
'email' => 'required|email',
'phonenumber' => 'required|regex:/^([0-9\s\-\+\(\)]*)$/|min:10',
'adminID'=>'required',
'accessLevel'=>'required',
'password'=>'required'
]);
$admin = Admin::where('email', '=', $request->email)->first();
I'm currently working on a private social network for fun and to improve my skills.
Anyway, I want to display a form to leave a comment on a post using a loop but I have issues trying that.
I'm using Symfony, twig and bootstrap, and I'd like to keep js, jquery or ajax away.
Here is my code:
My form builder:
class CommentType extends AbstractType
{
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder
->add('title', null, [
"label" => "Your title"
])
->add('content', null, [
"label" => "Your content"
])
->add('submit', SubmitType::class, [
"label" => "Publish your shitty comment!"
]);
}
public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefaults([
'data_class' => Comment::class,
]);
}
}
and my view:
<ul class="nav col-4 offset-3">
{% for post in posts %}
<li class="postItem">
<article class="postItem">
<p> {{ post.title }} </p>
<img id="postPics" src="{{ asset('./pictures/posts/' ~ post.picture) }}">
{{ form(leaveCommentForm) }}
<h3>{{ post.title }}</h3>
<p>{{ post.content }}</p>
<author>{{ post.user.username }}</author>
<div class="commentPost">
{% for comment in post.comments %}
<article>
<h6 style="font-weight: bold">{{ comment.title }} -
By
<author>{{ comment.user.username }}
on {{ comment.dateCreated | date('Y-M-d') }}</author>
</h6>
<p>{{ comment.content }}</p>
</article>
{% endfor %}
</div>
<input type="hidden" value="{{ post.id }}" name="postId"> {{ post.id }}
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Leave a comment
</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Leave a comment</h4>
</div>
<div class="modal-body">
{{ form_start(leaveCommentForm) }}
<input type="hidden" value="{{ post.id }}" name="postId"> {{ post.id }}
{{ form_end(leaveCommentForm) }}
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</article>
</li>
{% endfor %}
</ul>
As you can see I want to display my form on each iteration of post (with or without modal I don't really care I was just trying some things).
My problems here are:
*If I use a modal, I can't get my post.id inside my modal and so I can't send it to my controller.
Actually I get the value of first post.id for every posts.
*If I don't use a modal I can't even see my form on my page.
If you have a solution that would be great!
Thanks in advance guys!
I am not a programming expert so bear with me.
I have put up a shopify site with the template Icon-Christian. It comes with newsletter popup. The thing is that after signing up, the popup window doesn't close automatically. How can I edit the code?
{% if settings.popup %}
<script type="text/javascript">
if($(window).width() > 500){
// Fancybox Join our mailing list popup
$(document).ready(function(){
var check_cookie = $.cookie('mailing_list_delay_popup');
if(check_cookie == null){
$.cookie('mailing_list_delay_popup', 'expires_seven_days', { expires: 7 });
//fire your fancybox here
setTimeout(function(){
$.fancybox({
href: "#subscribe_popup"
});
}, 3000);
}
});
};
</script>
{% endif %}
<div style="display:none">
<div id="subscribe_popup" class="row">
{% if settings.email_popup_image %}
<div class="left fifty">
<img src="{{ 'popup-image.jpg' | asset_url }}">
</div>
{% endif %}
<div class="right fifty">
<h3>{{ 'layout.homepage.mailing_list_join' | t }}</h3>
<p>{{ 'layout.homepage.mailing_list_text' | t }}</p>
<!-- BEGIN #subs-container -->
<div id="subs-container" class="clearfix">
<div id="mc_embed_signup">
<form action="{{ settings.mailchimp }}" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
<input value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="{{ 'general.newsletter_form.newsletter_email' | t }}" required="" type="email">
<input value="{{ 'general.newsletter_form.submit' | t }}" name="subscribe" id="mc-embedded-subscribe" class="button" type="submit">
</form>
</div>
</div>
<div class="clear"></div>
<ul id="footer-icons">
{% if settings.show_facebook %}<li><i class="icon-facebook icon-2x"></i></li>{% endif %}
{% if settings.show_twitter %}<li><i class="icon-twitter icon-2x"></i></li>{% endif %}
{% if settings.show_pinterest %}<li><i class="icon-pinterest icon-2x"></i></li>{% endif %}
{% if settings.show_tumblr %}<li><i class="icon-tumblr icon-2x"></i></li>{% endif %}
{% if settings.show_youtube %}<li><i class="icon-youtube icon-2x"></i></li>{% endif %}
{% if settings.show_googleplus %}<li><i class="icon-google-plus icon-2x"></i></li>{% endif %}
{% if settings.show_instagram %}<li><i class="icon-instagram icon-2x"></i></li>{% endif %}
</ul>
</div>
</div>
</div>
I added form to button (in left top in header) https://en.partizanstore.eu/
I checked form in page and it works, but when I added form to snippet and to button, it dont work, dont send letter.
Can anybody help?
And by the way, can I create form anywhere, except on pages?
{% capture contact_form %}
<div class="contact">
{% form 'contact', class: 'contact__form' %}
{% if form.posted_successfully? %}
<div class="alert alert--success">
<span class="alert-title">{{ 'contact.form.successfully_sent' | t }}</span>
</div>
{% endif %}
{% if form.errors %}
<div class="alert alert--error">
<span class="alert__title">{{ 'general.forms.errors' | t }}</span>
{% include 'form_errors' %}
</div>
{% endif %}
<div class="form__control">
<label class="form__label" for="contact__name">{{ [ 'contact.form.name' | t }}</label>
<input type="text" id="contact__name" name="contact[name]">
</div>
<div class="form__control">
<label class="form__label" for="contact__phone">{{ 'contact.form.phone' | t }}</label>
<input type="text" id="contact__phone" name="contact[phone]">
</div>
<input type="submit" class="button button--primary" value="{{ 'contact.form.submit' | t }}">
{% endform %}
</div>
{% endcapture %}
i have a bootstrap modal dialog which use laravel form to register a user.
Here's the code:
<div id="addPenggunaModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="ModalLabel">Tambah Pengguna Baru</h3>
</div>
<div class="modal-body">
{{ Form::open(array('url'=>'users/addpengguna','class'=>'form-horizontal', 'method'=> 'POST')) }}
<ul>
#foreach($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
<div class="control-group">
<label for="firstname" class="control-label">First Name:</label>
<div class="controls">
{{ Form::text('firstname', null, array('class'=>'span3', 'placeholder'=>'First Name')) }}
</div>
</div> <!-- /field -->
<div class="control-group">
<label for="lastname" class="control-label">Last Name: </label>
<div class="controls">
{{ Form::text('lastname', null, array('class'=>'span3', 'placeholder'=>'Last Name')) }}
</div>
</div> <!-- /field -->
<div class="control-group">
<label for="email" class="control-label">Email Address: </label>
<div class="controls">
{{ Form::text('email', null, array('class'=>'span3', 'placeholder'=>'Email Address')) }}
</div>
</div> <!-- /field -->
<div class="control-group">
<label for="password" class="control-label">Password:</label>
<div class="controls">
{{ Form::password('password', array('class'=>'span3', 'placeholder'=>'Password')) }}
</div>
</div> <!-- /field -->
<div class="control-group">
<label for="confirm_password" class="control-label">Confirm Password:</label>
<div class="controls">
{{ Form::password('password_confirmation', array('class'=>'span3', 'placeholder'=>'Confirm Password')) }}
</div>
</div> <!-- /field -->
<div class="control-group">
<label for="type_user" class="control-label">Tipe Pengguna:</label>
<div class="controls">
{{ Form::radio('level', '1'); }} Supervisor
{{ Form::radio('level', '0'); }} Sales
</div>
</div> <!-- /field -->
</form>
</div>
<div class="modal-footer">
{{ Form::submit('Simpan', array('class'=>'button btn btn-primary','id'=>'mdl_save_change'))}}
<button class="btn" data-dismiss="modal" aria-hidden="true">Batal</button>
</div>
{{ Form::close() }}
</div>
then i use the controller to save the details:
public function postAddpengguna(){
/* function to add user in data pengguna */
$validator = Validator::make(Input::all(), User::$rules);
if($validator -> passes()){
$user = new User;
$user->firstname = Input::get('firstname');
$user->lastname = Input::get('lastname');
$user->email = Input::get('email');
$user->password = Hash::make(Input::get('password'));
$user->level = Input::get('level');
/* save the following details */
$user->save();
return Redirect::to('pengguna');
} else {
return Redirect::to('index');
}
}
but the form doesn't save any data to database. I have another page called registration and it works.
my questions:
how to trace POST from laravel form submit, is there any browser extension?
how to trace error log in laravel
any ideas what's going on in my problem?
thank you in advance.
UPDATE
Here's the screenshot that describe how this works.
bootstrap modal:
when i press the submit button (blue button in modal) i want it to save the data to db. The function php is shown above.
PS. i don't use any AJAX to call the value from the FORM. But when i use the AJAX, it always error because TOKEN is missing.
First of all check the action and _token field of form . To add token field in your form you should include the following line in your form:
<input type="hidden" name="_token" value="{{csrf_token()}}">
To re-use bootstrap modal in your project you can check this Github link
In the latest versions of laravel 5 you can use a shortcut to get the token field.
<form ... >
{!! csrf_field() !!}
</form>
In this case you'll get something like
<input type="hidden" name="_token" value="hpyL7cUbCMFBGRfCi2dpzE5XHGj8WuyY2jqloKRx">
You can in any case get the token string calling csrf_token(), anyway I honestly prefer the csrf_field() alternative.
You may use this code with your ajax code:
$(function() {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': {!! json_encode(csrf_token()) !!}
}
});
});