laravel Livewire wire:click not firing the function - javascript

I want to do a SPA with laravel livewire, i want to use wire:click to fire a funtion in the component but it not working , excuse me if the code mess its my first time posting here and i am not sure of what to post here of my code to make these problem solve thank you
main.blade.php
#section('content')
<div>
<div class="row justify-content-center">
<div class="col-12">
<div class="card my-3">
<!-- header -->
<div class="card-header d-inline-flex">
<h3 class='mr-2'>Categories</h3>
<div>
Add NewCategory
</div>
</div><!-- header -->
<div class="card-body">
<!-- alerts -->
#include('admin.includes.alerts.errors')
#include('admin.includes.alerts.success')
<!-- alerts -->
<!-- if True , create form will show , if not will stay disabled -->
#if ($showCreateForm)
#livewire('admin.category.create' )
#endif
<!-- if True , create form will show , if not will stay disabled -->
<!-- Table -->
<div class="table-responsive">
<table id="example2" class="table table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>Image</th>
<th>Name</th>
<th>Slug</th>
<th>Status</th>
<th>Parent</th>
<th>Action</th>
</tr>
</thead>
<tbody>
#foreach ($categories as $category)
<tr>
<td>{{$category->id}}</td>
{{-- <td>{{storage_path(app\livewire-tmp\$category->image)}}" /></td> --}}
<td>{{$category->name}}</td>
<td>{{$category->slug}}</td>
<td class=" {{$category->isActive()==='Active'? 'text-success':'text-danger'}}">
{{$category->isActive()}}</td>
<td>{{ !empty($category->parent) ? $category->parent->name:'' }}</td>
<td>
Edit
Delete
</td>
</tr>
#endforeach
</tbody>
<tfoot>
<tr>
<th>ID</th>
<th>Image</th>
<th>Name</th>
<th>Slug</th>
<th>Status</th>
<th>Parent</th>
<th>Action</th>
</tr>
</tfoot>
</table>
<div>
{!!$categories->links()!!}
</div>
</div>
<!-- Table -->
</div><!-- body -->
</div>
</div>
</div>
</div>
#endsection
and The Component Main.php ,
<?php
namespace App\Http\Livewire\Admin\Category;
use App\Models\Admin\Category;
use Livewire\Component;
use Livewire\WithPagination;
class Main extends Component
{
use WithPagination;
protected $categories;
public $showCreateForm = false;
public $showEditForm = false;
public function render()
{
$categories = Category::orderBy('id','desc')->paginate(12);
return view('livewire.admin.category.main',[
'categories' => $categories,
]) ->layout('layouts.admin');
}
public function createCategory()
{
$this->showCreateForm = !$this->showCreateForm;
}
public function update_Category($id)
{
$categories = Category::whereId($id);
if ($categories) {
$this->emit('getCategoryid' , $categories);
$this->showEditForm = !$this->showEditForm;
$this->showCreateForm = false;
}
}
public function delete_Category($id)
{
$this->showCreateForm = !$this->showCreateForm;
}
}
//// Update ////
i tried iRestWeb Answer, I think it the right answer but i dont even understand what happening its 100% javascript related and its not my field of expertise , so here's my full code i hope some one understand , and again sorry if my code messy and give you hard time , thank youu.
create.blade.php
<div>
<form role="form" wire:submit.prevent="create" method="POST" enctype="multipart/form-data">
#csrf
<div class="card-body">
<div class="row">
<div class="col-6">
<div class="form-group">
<label for="exampleInputEmail1">Parent</label>
<select type="select" class="form-control" id="exampleInputEmail1" wire:model="parent_id" name="parent_id">
<option selected value> -- select an option -- </option>
{{-- #if (is_array($categories) || is_object($categories) || !empty($categories)) --}} #foreach ($categories as $category)
<option value="{{$category->id}}">{{$category->name}}</option>
#endforeach {{-- #endif --}}
</select>
</div>
</div>
<!-- 1 -->
<div class="col-6">
<div class="form-group">
<label for="exampleInputPassword1">Category Name</label>
<input type="text" class="form-control" id="exampleInputPassword1" placeholder="Name" wire:model="name" name="name"> #error('name') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 2 -->
<div class="col-6">
<div class="form-group">
<label for="exampleInputPassword1">Slug Name</label>
<input type="text" class="form-control" id="exampleInputPassword1" placeholder="Name" wire:model="slug" name="slug"> #error('slug') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 3 -->
<div class="col-6">
<div class="form-group">
<label for="exampleFormControlFile1">Image</label>
<input type="file" wire:model="image" class="form-control-file" id="exampleFormControlFile1" name="image"> #error('image') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 4 -->
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1" wire:model="is_active" name="is_active">
<label class="form-check-label" for="exampleCheck1">is Active</label> #error('is_active') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- /.card-body -->
<div class="card-footer">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
Create.php
<?php
namespace App\Http\Livewire\Admin\Category;
use Livewire\Component;
use App\Models\Admin\Category;
use Livewire\WithFileUploads;
use Illuminate\Support\Str;
use Livewire\WithPagination;
use Intervention\Image\Facades\Image;
class Create extends Component
{
use WithFileUploads;
use WithPagination;
public $slug , $name , $image , $parent_id , $is_active;
protected $rules = [
'slug' => 'required|unique:categories,slug',
'name' => 'required',
'image'=> 'nullable|image|max:1024'
];
protected $categories;
public function render()
{
$categories = Category::orderBy('id','desc')->paginate(12);
return view('livewire.admin.category.create' , [
'categories' => $categories,
]);
}
public function create()
{
$this->validate();
$data = [
'name' => $this->name,
'slug' => $this->slug,
'is_active'=> $this->is_active,
'image'=> $this->image,
'parent_id'=> $this->parent_id,
];
//image upload
try {
if ($image = $this->image) {
$filename = Str::slug($this->name).'.'.$image->getClientOriginalExtension();
$path = public_path('assets/image/'.$filename);
Image::make($image->getRealPath())->save($path,100);
}
Category::create($data);
$this->reset();
return $this->addError('success' , 'Created Successfuly');
} catch (\Throwable $th) {
return $this->addError('error', 'Something Wrong Happens');
}
}
}
edit.blade.php
<div>
<form role="form" method="POST" enctype="multipart/form-data" wire:submit.prevent="update">
#csrf
<div class="card-body">
<div class="row">
<div class="col-6">
<div class="form-group">
<label for="exampleInputEmail1">Parent</label>
<select type="select" class="form-control" id="exampleInputEmail1" wire:model="parent_id" name="parent_id">
<option></option>
{{-- #if (is_array($categories) || is_object($categories) || !empty($categories)) --}} #foreach ($categories as $category)
<option value="{{$category->id}}">{{$category->name}}</option>
#endforeach {{-- #endif --}}
</select>
</div>
</div>
<!-- 1 -->
<div class="col-6">
<div class="form-group">
<label for="exampleInputPassword1">Category Name</label>
<input type="text" class="form-control" id="exampleInputPassword1" placeholder="Name" wire:model="name" value='{{$category->name}}' name="name"> #error('name') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 2 -->
<div class="col-6">
<div class="form-group">
<label for="exampleInputPassword1">Slug Name</label>
<input type="text" class="form-control" id="exampleInputPassword1" placeholder="Name" wire:model="slug" name="slug" value='{{$category->slug}}'> #error('slug') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 3 -->
<div class="col-6">
<div class="form-group">
<label for="exampleFormControlFile1">Image</label>
<input type="file" class="form-control-file" id="exampleFormControlFile1" name="image">
<img value='{{$category->image}}' alt="" srcset=""> #error('image') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- 4 -->
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1" wire:model="is_active" name="is_active">
<label class="form-check-label" for="exampleCheck1">is Active</label> #error('is_active') <span class="error text-danger">{{ $message }}</span> #enderror
</div>
</div>
<!-- /.card-body -->
<div class="card-footer">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
Edit.php (uncompleted Task)
<?php
namespace App\Http\Livewire\Admin\Category;
use Livewire\Component;
use App\Models\Admin\Category;
class Edit extends Component
{
protected $categories , $cat_id;
public $slug , $name , $image , $old_image , $parent_id , $is_active;
protected $listeners = ['getCategoryid'=>'getID'];
public function mount()
{
$this->categories = Category::whereId($this->cat_id)->first();
}//mout
public function render()
{
$categories = Category::all();
return view('livewire.admin.category.edit' , [
'categories' => $categories,
]);
}//render
public function update($id)
{
}//update
public function getID($categories)
{
$this->categories = $categories;
// Data
$this->slug = $this->$categories['slug'];
$this->name = $this->$categories['name'];
$this->image = $this->$categories['image'];
$this->old_image = $this->$categories['old_image'];
$this->parent_id = $this->$categories['parent_id'];
$this->is_active = $this->$categories['is_active'];
}//getID
}

All HTML code should be covered with single <div>. Then it will work.

add liveWire's css and js in the base.blade.php file and it works:
<head>
...
#livewireStyles
</head>
<body>
...
#livewireScripts
</body>
</html>

You don't need the :click event to do this, you can simply use:
wire:$toggle('property')
And you don't need to use the a tag; you can simply use the button tag. So your button code will look like this:
<button type="button" wire:$toggle='showCreateForm' class="btn btn-success">Add New Category</button>

I think this will help you
Add New Category

use <livewire:styles /> and <livewire:scripts />
(instead #livewireStyles and #livewireScripts)

Related

JS Script crashes after temporaryURL is created with livewire

Does anyone know, How to resolve this issue of the crashed javascript script?
I am using 2 checkboxes to load some DOM.
1st checkbox is to expand textarea with the CKEditor script which is loaded with the JS but I have a wire model to send data to the controller.
Here is HTML for 1st checkbox:
<div class="form-group mt-25 d-flex flex-row">
<label class="checkbox-container form-group__label">
{{ __('Extended description') }}
<input type="checkbox" name="extended-description-checkbox" id="extended-description-checkbox" class="checkbox">
<span class="checkmark"></span>
</label>
</div>
<div class="form-group mt-25 cke d-none" id="extended-description-checkbox-div">
<label class="form-group__label" for="extended-description">{{ __('Extended description') }}</label>
<textarea wire:ignore.self wire:model.debounce.250ms.defer="extendedDescription" name="extended-description" id="extended-description" cols="30" rows="10"></textarea>
</div>
2nd checkbox is also handled with the JS and has a temporary URL method since the expanded DOM element should contain uploaded images for the gallery.
Here is HTML of the 2nd checkbox:
<div class="form-group mt-25 d-flex flex-row">
<label class="checkbox-container form-group__label">
{{ __('Use default images') }}
<input type="checkbox" name="use-default-images" id="use-default-images" class="checkbox">
<span class="checkmark"></span>
</label>
</div>
<div class="d-none" id="use-default-images-div">
<div class="form-group mt-25">
<label class="form-group__label">{{ __('Service images') }}</label>
<div class="form-group__uploaded-images">
#if ($additionalImages)
#foreach($additionalImages as $image)
<img src="{{ $image->temporaryUrl() }}" alt="Temporary image">
#endforeach
#endif
</div>
</div>
<div class="custom-file ml-auto">
<button type="button" class="ml-auto styled-link">{{ __('Add images') }}</button>
<div class="row mt-25">
<div class="col-4 col-md-8"></div>
<div class="col-8 col-md-4">
<input wire:ignore.self wire:model.defer="additionalImages" type="file" multiple>
#error('images.*') {{ $message }} #enderror
</div>
</div>
</div>
</div>
Here are the scripts for expanding of the both DOM elements:
const extendedCheckbox = document.querySelector('#extended-description-checkbox');
const extendedDiv = document.querySelector('#extended-description-checkbox-div');
extendedCheckbox.addEventListener('change', function() {
if(extendedCheckbox.checked) {
extendedDiv.classList.remove('d-none');
} else {
extendedDiv.classList.add('d-none');
}
});
const defaultImagesCheckbox = document.querySelector('#use-default-images');
const defaultImagesDiv = document.querySelector('#use-default-images-div');
defaultImagesCheckbox.addEventListener('change', function() {
if(defaultImagesCheckbox.checked) {
defaultImagesDiv.classList.remove('d-none');
} else {
defaultImagesDiv.classList.add('d-none');
}
});

Laravel - Dynamic Input Field Failed to Submit without Displaying any Error

I have been battling with this issue for some days now. I have a project on Laravel-5.8
I have two model classes
AppraisalGoal
protected $fillable = [
'goal_type_id',
'appraisal_identity_id',
'employee_id',
'company_id',
'is_published',
'is_approved',
'weighted_score',
'employee_comment',
'line_manager_comment',
'goal_title',
'start_date',
'end_date',
'created_by',
'created_at',
'updated_by',
'updated_at',
'is_active'
];
AppraisalGoalDetail
protected $fillable = [
'name',
'company_id',
'appraisal_goal_id',
'kpi_description',
'appraisal_doc',
'activity',
'created_by',
'created_at',
'updated_by',
'updated_at',
'is_active'
];
Appraisal Goal is the main model
StoreAppraisalGoalRequest
class StoreAppraisalGoalRequest extends FormRequest
{
public function rules()
{
return [
'goal_title' => 'required|min:5|max:100',
'goal_type_id' => 'required',
'weighted_score' => 'required|numeric|min:0|max:500',
'start_date' => 'required',
'end_date' => 'required|after_or_equal:start_date',
'appraisal_goal_id' => 'required',
'kpi_description' => 'required|max:300',
'activity' => 'required|max:300',
];
}
}
Controller
public function create()
{
$userCompany = Auth::user()->company_id;
$identities = DB::table('appraisal_identity')->select('appraisal_name')->where('company_id', $userCompany)->where('is_current', 1)->first();
$goaltypes = AppraisalGoalType::where('company_id', $userCompany)->get();
$categories = AppraisalGoalType::with('children')->where('company_id', $userCompany)->whereNull('parent_id')->get();
return view('appraisal.appraisal_goals.create')
->with('goaltypes', $goaltypes)
->with('categories', $categories)
->with('identities', $identities);
}
public function store(StoreAppraisalGoalRequest $request)
{
$startDate = Carbon::parse($request->start_date);
$endDate = Carbon::parse($request->end_date);
$userCompany = Auth::user()->company_id;
$appraisal_identity_id = AppraisalIdentity::where('company_id', $userCompany)->where('is_current',1)->value('id');
try {
$goal = new AppraisalGoal();
$goal->goal_type_id = $request->goal_type_id;
$goal->appraisal_identity_id = $appraisal_identity_id;
$goal->employee_id = $request->employee_id;
$goal->weighted_score = $request->weighted_score;
$goal->goal_description = $request->goal_description;
$goal->start_date = $startDate;
$goal->end_date = $endDate;
$goal->company_id = Auth::user()->company_id;
$goal->created_by = Auth::user()->id;
$goal->created_at = date("Y-m-d H:i:s");
$goal->is_active = 1;
$goal->save();
foreach ( $request->activity as $key => $activity){
$goaldetail = new AppraisalGoalDetail();
$goaldetail->kpi_description = $request->kpi_description[$key];
$goaldetail->appraisal_doc = $request->application_doc[$key];
$goaldetail->activity = $request->activity[$key];
$goaldetail->appraisal_goal_id = $goal->id;
$goaldetail->company_id = Auth::user()->company_id;
$goaldetail->created_by = Auth::user()->id;
$goaldetail->created_at = date("Y-m-d H:i:s");
$goaldetail->is_active = 1;
$goaldetail->save();
}
Session::flash('success', 'Appraisal Goal is created successfully');
return redirect()->route('appraisal.appraisal_goals.index');
} catch (Exception $exception) {
Session::flash('danger', 'Appraisal Goal creation failed!');
return redirect()->route('appraisal.appraisal_goals.index');
}
}
create.blade
<div class="row">
<div class="col-md-12">
<!-- general form elements -->
<div class="card card-secondary">
<div class="card-header">
<h3 class="card-title">Creating My 3 + 1 Goals: <b>{{$identities->appraisal_name}}</b></h3>
</div>
<!-- /.card-header -->
<!-- form start -->
<form method="POST" action="{{route('appraisal.appraisal_goals.store')}}">
#csrf
<div class="card-body">
<div class="form-body">
<div class="row">
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="control-label"> Goal Type:<span style="color:red;">*</span></label>
<select id="goal_type" class="form-control" name="goal_type_id">
<option value="">Select Goal Type</option>
#foreach ($categories as $category)
#unless($category->name === 'Job Fundamentals')
<option disabled="disabled" value="{{ $category->id }}" {{ $category->id == old('category_id') ? 'selected' : '' }}>{{ $category->name }}</option>
#if ($category->children)
#foreach ($category->children as $child)
#unless($child->name === 'Job Fundamentals')
<option value="{{ $child->id }}" {{ $child->id == old('category_id') ? 'selected' : '' }}> {{ $child->name }}</option>
#endunless
#endforeach
#endif
#endunless
#endforeach
</select>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="control-label"> Goal Title:<span style="color:red;">*</span></label>
<input type="text" name="goal_title" placeholder="Enter goal title here" class="form-control">
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<label>Goal Description</label>
<textarea rows="2" name="goal_description" class="form-control" placeholder="Enter Goal Description here ..."></textarea>
</div>
</div>
<div class="col-sm-12">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">Activity<span style="color:red;">*</span></th>
<th scope="col">KPI Description<span style="color:red;">*</span></th>
<th scope="col">Attachment</th>
<th scope="col"><a class="addRow"><i class="fa fa-plus"></i></a></th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" name="activity[]" class="form-control activity" ></td>
<td><input type="text" name="kpi_description[]" class="form-control kpi" ></td>
<td>
<div class="custom-file">
<input type="file" name="appraisal_doc[]" class="custom-file-input" id="customFile">
<label class="custom-file-label" for="exampleInputFile">Choose file</label>
</div>
</td>
<td><a class="btn btn-danger remove"> <i class="fa fa-times"></i></a></td>
</tr>
</tbody>
</table>
</div>
<div class="col-12 col-sm-4">
<div class="form-group">
<label class="control-label"> Weight:</label>
<input type="number" name="weighted_score" placeholder="Enter weighted score here" class="form-control">
</div>
</div>
<div class="col-12 col-sm-4">
<div class="form-group">
<label class="control-label"> Start Date:<span style="color:red;">*</span></label>
<input type="date" class="form-control" placeholder="dd/mm/yyyy" name="start_date" min="{{Carbon\Carbon::now()->format('Y-m-d')}}">
</div>
</div>
<div class="col-12 col-sm-4">
<div class="form-group">
<label class="control-label"> End Date:<span style="color:red;">*</span></label>
<input type="date" class="form-control" placeholder="dd/mm/yyyy" name="end_date" min="{{Carbon\Carbon::now()->format('Y-m-d')}}">
</div>
</div>
</div>
</div>
</div>
<!-- /.card-body -->
<div class="card-footer">
<button type="submit" class="btn btn-primary">{{ trans('global.save') }}</button>
<button type="button" onclick="window.location.href='{{route('appraisal.appraisal_goals.index')}}'" class="btn btn-default">Cancel</button>
</div>
</form>
</div>
<!-- /.card -->
</div>
<!--/.col (left) -->
</div>
javascript
<script type="text/javascript">
$(document).ready(function(){
$('.addRow').on('click', function () {
var isHod = {{ Auth::user()->is_hod == 0 ? 0 : 1 }};
var numRows = $('.activity').length
if (isHod || (!isHod && numRows<3)) {
addRow();
}
});
function addRow() {
var addRow = '<tr>\n' +
' <td><input type="text" name="activity[]" class="form-control activity" ></td>\n' +
' <td><input type="text" name="kpi_description[]" class="form-control kpi_description" ></td>\n' +
' <td><div class="custom-file"><input type="file" name="appraisal_doc[]" class="custom-file-input" id="customFile"><label class="custom-file-label" for="exampleInputFile">Choose file</label></div></td>\n' +
' <td><a class="btn btn-danger remove"> <i class="fa fa-times"></i></a></td>\n' +
' </tr>';
$('tbody').append(addRow);
addRemoveListener();
};
addRemoveListener();
});
function addRemoveListener() {
$('.remove').on('click', function () {
var l =$('tbody tr').length;
if(l==1){
alert('you cant delete last one')
}else{
$(this).parent().parent().remove();
}
});
}
</script>
When I click on submit button, it did not save any record but redirected to the index page. No error indicated, even in the Browser Network.
Then, I added this before the try{} in the store function of the controller:
$data = $request->all(); print_r($data); exit;
and I got this result:
Array ( [_token] => KbnpT9MAFywHJBfVoWllKvr2ELSsRNZmWM4B5Eui [goal_type_id] => 2 [appraisal_identity_id] => 8 [goal_title] => goal title1 [goal_description] => [activity] => Array ( [0] => activity2 [1] => activity3 ) [kpi_description] => Array ( [0] => kpi description2 [1] => kpi description3 ) [weighted_score] => 20 [start_date] => 2020-02-03 [end_date] => 2020-02-29 )
But when I added
print_r($goal); exit;
after
$goal->save();
There was no result.
How do I get this sorted out?
Thank you.
sometimes some dev using try catch statement but forget to look whats wrong while the code thrown an exception. so lets change your catch statement to this for figure out whats wrong.
}catch (Exception $exception) {
dd($exception->getMessage());
Session::flash('danger', 'Appraisal Goal creation failed!');
return redirect()->route('appraisal.appraisal_goals.index');
}

Laravael PHP, JavaScript help needed

First, I am developer for C, C++, C#, Android and Swift but I have absolutly no experience in JavaScript or PHP or Web development.
I bought some source code for my backend server. It is kind of shop where I can enter products and store them. Now, I got everthying to work (even with 0 knowdlege in web development), but there is a text input field which checks for integer values. I want to insert decimal values like a price information, e.g. 19.99. It then complains that it has to be 19 or 20. I can not find the place where to change that or which class/function is responsible for checking that entered value. There is something called Blade. It is in HTML and javaScript as it seems to me. I can not find any class or a route to a file where the entered values go and get checked. I don't even know which class/file is responsible for writing the values to the database. I mean, wtf? It can not be that complicated to find out which file is responsible to handle the entered values. It drives me crazy.
That is the input which only takes integer values.
This is the blade code:
{{-- resources/views/admin/dashboard.blade.php --}}
#extends('adminlte::page')
#section('title', 'Products')
#include('parts.header')
#section('content_header')
<div class="col-md-12">
<h2>Add new product</h2>
</div>
#stop
#section('content')
<div class="row">
<div class="col-sm-12">
<form method="post" action="{{ route('product.add') }}" enctype="multipart/form-data">
{{ csrf_field() }}
#if(!$errors->isEmpty())
<div class="alert alert-danger alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4><i class="icon fa fa-ban"></i> Alert!</h4>
#foreach ($errors->all() as $error)
<div>{{ $error }}</div>
#endforeach
</div>
#endif
<div class="col-sm-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Details</h3>
</div>
<!-- /.box-header -->
<!-- form start -->
<form role="form">
<div class="box-body">
<div class="row">
<div class="col-sm-4 form-group ">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" id="name" placeholder="Enter name" required>
</div>
<div class="col-sm-4 form-group ">
<label for="name">Description</label>
<input type="text" name="description" class="form-control" id="name" placeholder="Enter description" required>
</div>
<div class="col-sm-3 form-group ">
<label for="category">Select category</label>
<select name="category_id" class="form-control" required>
<option value="" disabled selected>Select your option</option>
#foreach($categories as $category)
<option value="{{ $category->id }}">{{ $category->name }}</option>
#endforeach
</select>
</div>
</div>
<div class="row">
<div class="col-sm-4 form-group">
<label for="price">Price</label>
<input type="number" name="price" class="form-control" id="price" placeholder="Enter price" required>
</div>
<div class="col-sm-4 form-group">
<label for="amount">Amount</label>
<input type="number" name="amount" class="form-control" id="amount" placeholder="Enter amount" required>
</div>
<div class="col-sm-3 form-group">
<div class="row">
<div class="col-sm-6">
<img id="myImg" alt="" style="width: 100%;">
</div>
<div class="col-sm-6">
<label for="image">Image</label>
<input class="fullwidth input rqd" type="file" name="image" id="image" accept="image/*" onclick="fileClicked(event)" onchange="fileChanged(event)" required>
<div id="log"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<h4>Variations</h4>
<div class="box-body table-responsive no-padding">
<table id="variationTable" class="table table-bordered table-hover dataTable" role="grid">
<thead>
<tr role="row">
<th rowspan="1" colspan="1">#</th>
<th rowspan="1" colspan="1">Owner</th>
<th rowspan="1" colspan="1">Remove</th>
</tr>
</thead>
<tbody>
<tr role="row" class="odd">
<td>1</td>
<td>
<input type="text" name="owner_id[]" placeholder="Enter owner" required>
</td>
<td>
<i class="fa fa-fw fa-remove"></i>
</td>
</tr>
</tbody>
</table>
</div>
<button type="button" class="btn btn-default btn-sm addrow pull-right" style="height: 34px;">
<span class="glyphicon glyphicon-plus-sign"></span> Add
</button>
<div class="clearfix"></div>
<div>
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
<div class="col-sm-6">
<h4>Siblings</h4>
<div class="form-group">
<select name="siblings[]" class="form-control select2" multiple>
#foreach($products as $product)
<option value="{{ $product->id }}">{{ $product->name }} </option>
#endforeach
</select>
</div>
</div>
</div>
</div>
<!-- /.box-body -->
</form>
</div>
</div>
</form>
</div>
</div>
#stop
#section('js')
#include('parts.footer');
#stop
Can somebody tell me where to find the code which handles the input? Where to find the function which checks for integer? I really searched every file, but somehow I am too stupid for that web stuff.
There is something like a class mentioned: col-sm-4 form-group but I can not find it?!?
Thanks.
Use step attribute for your number input
Float
<input type="number" step="0.01">
Int
<input type="number">
Go to app/Http directory; then you have to check for the controller that handles that very view. Look for validator method in the controller file. It is something like this:
<php?
protected function validator(array $data)
{
return Validator::make($data, [
'price' => 'required|string|min:19|max:20'
]);
}
You can change it as you want.
Add step="0.01"(for example 0.01) property to your price input.
If it's been checked on client side you can check resources/views/parts/footer and find out which javascript files are included in your template then check that javascript files for the validation.
If it's server side, most common place for validations is app/Http/Requests. but before going for requests you should check the Controller and action which is responsible for responding to that request and check which Request class is input paramter for that action then got to app/Http/Requests and find that class and edit validation rules

Laravel 5 autocomplete Jquery

I have a problem with my project.
I want an autocomplete input that gets the data from a database, so the problem starts when I enter the view where the autocomplete input is. The view only gives me a white screen with an array that contains all the values ​​in my "clientes" table (the values for the autocomplete input are taken from this table).
I think the problem may be on my routes, but I do not know what to do.
Routes:
Route::get('/nuevaVenta', 'ventas#index');
Route::get('/nuevaVenta', 'ventas#autocomplete');
Controller (ventas.php):
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Cliente;
use Illuminate\Support\Facades\Input;
class ventas extends Controller
{
public function index(){
return view('/nuevaVenta');
}
public function autocomplete(Request $Request){
$term = Input::get('term');
$results = array();
$queries = Cliente::where('nombre', 'LIKE', '%'.$term.'%')
->orWhere('apellido_paterno', 'LIKE', '%'.$term.'%')
->take(10)->get();
foreach ($queries as $query)
{
$results[] = [ 'id' => $query->id, 'value' => $query->nombre.' '.$query->apellido_paterno.' '.$query->apellido_materno];
}
return response()->json($results);
//\Response::json($results);
}
}
View (nuevaVenta.blade.php):
#extends('master')
#section('contenido')
<script src="{{asset("js/validaciones.js")}}"></script>
<script src="{{asset("js/nuevaVenta.js")}}"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<form class="form-horizontal" action="{{url('/nuevaVenta')}}" method="GET">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<br>
<div class="form-control" style="background-color: lightblue"><label>Registro de Ventas</label></div>
<div class="col-xs-12" style="border:1px solid lightblue">
<div class="form-group">
<label class="control-label col-sm-12" style ="color: #4cae4c">Clave:0001</label>
</div>
<div class="form-group">
<label class="control-label col-sm-1" style ="font-weight: normal">Cliente:</span></label>
<div class="col-sm-10">
<input type="text" name="cliente" class="form-control solo-letras" id="cliente" style="width: 40%;" placeholder="Buscar cliente..." required>
</div>
</div>
<hr>
<div class="form-group">
<label class="control-label col-sm-1" style ="font-weight: normal">Artículo:</label>
<div class="col-sm-10">
<input type="text" name="cliente" class="form-control" style="width: 40%; display: inline;" placeholder="Buscar Artículo..." required>
<span class="glyphicon glyphicon-plus btn btn-primary"></span>
</div>
</div>
<hr>
<div class="col-xs-12">
<table class="table">
<thead class="thead-inverse">
<tr>
<th>Descripción Artículo</th>
<th>Modelo</th>
<th>Cantidad</th>
<th>Precio</th>
<th>Importe</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
</form>
#stop
js file (ventas.js):
$(document).ready(function(){
$('#cliente').autocomplete({
autoFocus: true,
minLength:3,
dataType: "json",
source:'ventas/autocomplete',
select:function(event, ui){
alert(ui);
}
});
});
I'm using the autocomplete widget from the jquery-ui library
Your route seems duplicating, that is why, so use unique routes,
Route::get('/nuevaVenta', 'ventas#index');
Route::get('/nuevaVentaAutocomplete', 'ventas#autocomplete');

How to create pop up box in PHP laravel 5

i created one view.blade.php page. There in table added column action, inside that given to button, Delete and View/Edit. When i click on View/Edit button one form page should come as pop up box. For that how can i write javascript. I am a beginner in laravel. So can any one please help me out?
My view.blade page is given is given below
userAdmin.blade.php
#extends('app')
#section('content')
<div class="templatemo-content-wrapper" xmlns="http://www.w3.org/1999/html">
<ol class="breadcrumb">
<li><font color="green">Home</font></li>
<li class="active">user information</li>
</ol>
<div class="templatemo-content">
<h1>View/Edit user information</h1>
<div>
<div>
<div>
<table id="example" class="table table-striped table-hover table-bordered" bgcolor="#fff8dc">
<h3>Select User :</h3>
<thead>
<tr>
<th>User ID</th>
<th>User Desc</th>
<th>Contact Name</th>
<th>Contact Email</th>
<th>Time Zone</th>
<th>Active</th>
<th>Last Login (GMT+05:30)</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{{--{{ UserController::getIndex() }}--}}
#foreach($name as $nam)
<tr>
<td>{{ $nam->userID }}</td>
<td>{{ $nam->description }}</td>
<td>{{ $nam->contactName }}</td>
<td>{{ $nam->contactPhone }}</td>
<td>{{ $nam->timeZone }}</td>
<td>
#if($nam->isActive == '1')
Yes
#else
No
#endif
</td>
<td>{{ date('Y/m/d H:i:s',($nam->lastLoginTime)) }}</td>
<td>
{{--#if ( in_array($nam->isActive, array('Yes','No')) )--}}
<div class="btn-group">
<button type="button" class="btn btn-info">Action</button>
<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu">
{{--#if ($nam->isActive == 'Yes')--}}
<li data-toggle="modal" data-target="#acceptModal" data-bookingid="{{ $nam->userID }}">View/ Edit
</li>
{{--#endif--}}
<li>Delete</li>
</ul>
</div>
{{--#endif--}}
</td>
</tr>
#endforeach
</tbody>
</table>
{{$name->links()}}
</div>
</div>
</div>
</div>
</div>
</br>
<script type="text/javascript">
$(document).ready(function() {
$('#example').dataTable();
} );
</script>
#endsection
and the form page i need to pop up is
#extends('app')
#section('content')
<div class="templatemo-content-wrapper">
<div class="container">
<ol class="breadcrumb">
<li><font color="green">Home</font></li>
<li class="active">View/Edit User</li>
</ol>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-success">
<div class="panel-heading">View/Edit User Information</div>
<div class="panel-body">
#if (count($errors) > 0)
<div class="alert alert-danger">
<strong>Whoops!</strong> There were some problems with your input.<br><br>
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
<form class="form-horizontal" role="form" method="POST" action="{{ url('accountAdmin') }}">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<div class="form-group">
<label class="col-md-4 control-label">User ID</label>
<div class="col-md-6">
<input type="text" class="form-control" name="userID" value="{{ old('userID')}}" placeholder="Enter User ID">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Active</label>
<div class="col-md-6">
<select class="form-control" value="{{ old('isActive') }}" name="isActive" >
<option value="1">Yes</option>
<option value="0">No</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">User Description</label>
<div class="col-md-6">
<input type="text" class="form-control" name="description" value="{{ old('description') }}" placeholder="Enter the description">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Contact Name</label>
<div class="col-md-6">
<input type="text" class="form-control" name="contactName" value="{{ old('contactName') }}" placeholder="Enter Contact Name">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Contact Phone</label>
<div class="col-md-6">
<input type="text" class="form-control" name="contactPhone" value="{{ old('contactPhone') }}" placeholder="Enter Mobile Number">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Contact Email</label>
<div class="col-md-6">
<input type="email" class="form-control" name="contactEmail" value="{{ old('contactEmail') }}" placeholder="Enter E-Mail Address">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Notify Email</label>
<div class="col-md-6">
<input type="email" class="form-control" name="notifyEmail" value="{{ old('notifyEmail') }}" placeholder="Enter E-Mail Address">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Time Zone</label>
<div class="col-md-6">
<select class="form-control" value="{{ old('timeZone') }}" name="timeZone" >
<option value="0">GMT+05:30</option>
<option value="Inactive">xyz</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Authorized Group</label>
<div class="col-md-6">
<select class="form-control" value="{{ old('distanceUnits') }}" name="distanceUnits" >
<option value="0">all</option>
<option value="1">Km</option>
<option value="2">Nm</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">First Login page</label>
<div class="col-md-6">
<select class="form-control" value="{{ old('firstLoginPageID') }}" name="firstLoginPageID" >
<option value="0">Main Menu</option>
<option value="1">Liter</option>
<option value="2">IG</option>
<option value="3">ft^3</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Maximum Access Level</label>
<div class="col-md-6">
<select class="form-control" value="{{ old('maxAccessLevel') }}" name="maxAccessLevel" >
<option value="3">New/Delete</option>
<option value="1">Read/View</option>
<option value="2">Write/Edit</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-4">
<button type="submit" class="btn btn-warning">
Save
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
#endsection
userController page is
class UserController extends Controller
{
public $type = 'User';
public function getIndex()
{
$name = DB::table('user')->simplePaginate(10);
return view('user.userAdmin')->with('name', $name);
}
public function getData()
{
$name = DB::table('user');
return view('user.add')->with('name', $name);
}
public function userInsert()
{
$postUser = Input::all();
//insert data into mysql table
$data = array('userID'=> $postUser['userID']
);
// echo print_r($data);
$ck = 0;
$ck = DB::table('user')->Insert($data);
//echo "Record Added Successfully!";
$name = DB::table('user')->simplePaginate(10);
return view('user.userAdmin')->with('name', $name);
}
public function delete($id)
{
DB::table('user')->where('userID', '=', $id)->delete();
return redirect('userAdmin');
}
}
routes.php is
Route::any('userAdmin', 'UserController#getIndex');
Route::any('user/add', 'UserController#getData');
Route::any('user/delete/{id}', 'UserController#delete');
Route::post('userAdmin', 'UserController#userInsert');
Anyone please tell me how to write js code for that

Categories

Resources