I’m implementing on Vue JS with Inertia a list where you can filter by name data() { return { selectedUser: this.value, selected: null, search: ”, } }, computed: { userlist: function(){ return this.users.filter(function(user){ return user.name.toLowerCase().match(this.search.toLowerCase()) }); } }, and the component <input class="form-input" placeholder="Search.." v-model="search"> <a href="#" class="block px-4 py-2 text-sm leading-5 text-gray-700 hover:text-gray-900 hover:bg-gray-100 ..
Category : inertiajs
I have a route defined as follows Route::post(‘s3/create/directory/{path?}’, [S3Controller::class, ‘createDirectory’]) ->name(‘s3.create.directory’) ->where(‘path’, ‘.*’); It works fine when posting to it, except when the path value is an empty string, then I get a blocked:mixed-content from Chrome. I have triple checked, and there are no HTTP requests on the page and because I am using InertiaJS, ..
I have this route in web.php Route::get(‘crm/projects/add’, [CRMController::class, ‘addProject’])->name(‘crm.addProject’)->middleware(‘auth’); this is in the CRMController class public function addProject(){ return Inertia::render(‘CRM/Projects/AddProjectPage’); } Regardless of the resource I tell the function to render it returns a 404 I am positive that the resource exists at CRM/Projects/AddProjectPage and I have tried with other resources which also have working ..
I use MUI datatable to display data from users, I want to use server-side pagination in my data but I don’t know how, I have searched in various references but it’s too confusing for me, I’m new to React import React from “react”; import MUIDataTable from “mui-datatables”; import Button from “@material-ui/core/Button”; import { InertiaLink } ..
I want to pass the ‘CourseId’ variable from a page view to a controller in order to delete it, but not sure why I can’t access the variable: view: this.$inertia.get(this.route(‘applications.courseDelete’, CourseId )) route: Route::get(‘applications/courseDelete’, [ApplicationsController::class, ‘courseDelete’])->name(‘applications.courseDelete’)->middleware(‘auth’); controller: public function courseDelete($courseId) { dd($courseId); } this returns the error, ‘too few arguments…’. ive tried adding the model ..
I need to populate parent layout from child layout or page component For example in blade I done it so. Layout <body class="has-sidebar-left @yield(‘sidebar_class’)"> Page @section(‘sidebar_class’, ‘hide-sidebar-left’) But.. how to do it in Inertia? Layout <div :class="[‘has-sidebar-left’, sidebar_class]"> <slot/> </div> Page ??? How to fill sidebar_class variable? I believe there should a simple solution, but ..
I would like to know how can I use tinymce-vue (@tinymce/tinymce-vue) with laravel-filemanager Currently I have this in my component : import Editor from ‘@tinymce/tinymce-vue’; … components: { Editor }, And in my template : <editor name="content" class="form-control my-editor" api-key="api-key" v-model="eventForm.body" :init="{ path_absolute : ‘/’, selector: ‘textarea.my-editor’, relative_urls: false, plugins: [ ‘advlist autolink lists link ..
I’m developing a personal project using Laravel with Inertia.js. I tried retrieving data from back-end to front-end through HandleInertiaRequests Middleware. I was wondering how will malicious people could get advantage of the data I show up in front-end. Inertia.js webpage discourages retrieving sensible data in this way, but I can’t figure out how that will ..
I am trying to use ziggy by importing in laravel inertiajs app (VUE3) without using @routes but i not able to use eg. route(‘home’).getting ctx.route is not a function error.. Please tell me how this is to be rightly put… app.js require(‘./bootstrap’); // Import modules… import { createApp, h } from ‘vue’; import { App ..
I’m building a Kanban Board with Vue 3, VueDraggable and Inertia.js. Both the columns and the column tasks are sortable, the idea is that you can drag and drop any task in any column. And you can drag the columns and place them in any order. With that said. here’s my task draggable component <draggable ..
I want to pass a the value of a form field in a child component to the parent before submitting the form. The parent contains the main form. I am using Inertiajs to do this. The onChildKeyup method below works fine and I can see the value I want is being passed from child to ..
Hi have a form where i want to bring in fields from different components such as personal details, programme details etc. However, when I click update, it doesnt update the child form fields. What am i missing? simplified parent form (main.vue): <form @submit.prevent="update"> <PersonalDetails :personalData="application" /> <button type="submit">Update</button> </form> export default { components: { PersonalDetails, ..
I have the following inertia link component <inertia-link v-for="project in $page.props.user.favorite_projects" :key="project.id" class="flex items-center px-6 py-2 mb-1 text-sm leading-6 text-gray-300 transition duration-150 ease-in-out group focus:outline-none focus:bg-gray-700 hover:text-white hover:bg-gray-700" :href="route(‘projects.show’,project.slug)"> <div class="w-3 h-3 mr-3 overflow-hidden rounded-full"> <div class="w-full h-full" style="background-color = {{ project.color }};"> </div> </div> {{ project.project_name }} </inertia-link> Where project.color contains a hex color ..
So I have the following method: methods: { submit() { this.$inertia.post(‘/projects’, this.form); this.openModal = false; }, }, But it closes my modal even if there are validation errors. I’ve also tried with this.$inertia.post(‘/projects’, this.form); if(!this.$page.props.errors) { this.openModal = false; } Which doesn’t close the modal if there are validation errors, but it doesn’t close it ..
I’m creating a search bar for a project model with Laravel, Inertia.js and Vue. Controller: public function index(Request $request) { return Inertia::render(‘Projects/Index’,[ ‘projects’ => Project::where(‘project_name’,’LIKE’,’%’.$request->search.’%’)->paginate(7) ]); } Index.vue Template <input id="search" type="text" class="form-input" placeholder="Search…" v-model="search" @keyup="searchProject"> Script data(){ return { search: ” } }, methods: { searchProject: _.throttle(function(){ this.$inertia.get("/projects", { search: this.search }, { preserveState: ..
I am using vuejs-datepicker and inertiajs, but when I try to update the database I am getting the error: Invalid datetime format: 1292 Incorrect date value: ‘2021-07-09T12:54:00.000Z’ for column ‘date_of_birth’ I tried formatting the date within the controller, but this doesn’t save anything. What am I missing here? eidt.vue: <datepicker v-model="form.date_of_birth" name="Date of birth" /> ..
I’m using a dynamic query in Laravel Inertia, my pagination is bugging because every time i try to change the pagination the mount() method of vue runs. data() { return { form: this.$inertia.form({ search: this.filters.search, order: "asc", column: "code", size: 5, }), }; }, mounted() { this.$inertia.get(this.route("groups.index"), pickBy(this.form), { preserveState: true, }); }, watch: { ..
well im planing to create a webapp for "one-way video interview " its when the company make a list of question for a job and let condidates response with a video . and i want any ideas about the invite link for interview , exactly ,the condidate dont have to register to pass the interview. ..
well im planing to create a webapp for "one-way video interview " its when the company make a list of question for a job and let condidates response with a video . and i want any ideas about the invite link for interview , exactly ,the condidate dont have to register to pass the interview. ..
I need help to how make a invite link with laravel with token or something. and the invited person dont have to register but i have get his answers thats a demo from hireflex.com the condidate get link wit token Sourc..
I want to have a dynamic sizing of my pagination, I’m using laravel vue and inertiaJS, I receive the value but can’t make it work on paginate inside when. This is the query. Group::where(‘company_id’, Auth::user()->company_id)->when($request->search, function($query,$term){ $query->where(‘code’, ‘LIKE’ , ‘%’ . $term. ‘%’) ->orWhere(‘name’, ‘LIKE’ , ‘%’ . $term. ‘%’) ->orWhere(‘description’, ‘LIKE’ , ‘%’ . ..
I’ve been trying to find the correct answer for my problem I know that the question has been asked before here and actually many other places, but no answers I found could suit my problem. The vue component FooterNewsletter.vue <template> <div class="lg:w-2/4 md:w-1/2 w-full px-8 border-l-2"> <p class="font-bold text-3xl"> Don’t want to miss the latest ..
I’m new to InertiaJS and I’m having trouble getting it to work on my production environment. It seems the @inertia directive in my Blade template is not recognized, it just gets rendered literally on the page. It just shows "@inertia" in the browser, inside the <body>. On my local dev environment, the page loads as ..
I have a script tag from CoreUI in my app.blade.php <script src="{{ asset(‘js/coreui.js’) }}" defer></script> the problem is in every route page the script isn’t being called thus not working the functions inside, I tried to require it in my app.js require(‘./coreui’) but still doesn’t work. To make it work I need to hard refresh ..
this question is related vue.js version 3. I have a App.vue componenet which defines the layout of the website and the code is as follows. <template> <div> <shuzia-navigation /> <slot></slot> //passing data from a component inside this slot tag down the <shuzia-music-player/> down there. <shuzia-footer /> <div class="mt-20"> <shuzia-music-player /> </div> </div> </template> <script> import ..
Web Development Company
Free Hosting Company
