ziben69

ziben69

Member Since 1 Year Ago

Experience Points 3,580
Experience Level 1

1,420 experience to go until the next level!

In case you were wondering, you earn Laracasts experience when you:

  • Complete a lesson — 100pts
  • Create a forum thread — 50pts
  • Reply to a thread — 10pts
  • Leave a reply that is liked — 50pts
  • Receive a "Best Reply" award — 500pts
Lessons Completed 0
Lessons
Completed
Best Reply Awards 0
Best Reply
Awards
  • start-engines Created with Sketch.

    Start Your Engines

    Earned once you have completed your first Laracasts lesson.

  • first-thousand Created with Sketch.

    First Thousand

    Earned once you have earned your first 1000 experience points.

  • 1-year Created with Sketch.

    One Year Member

    Earned when you have been with Laracasts for 1 year.

  • 2-years Created with Sketch.

    Two Year Member

    Earned when you have been with Laracasts for 2 years.

  • 3-years Created with Sketch.

    Three Year Member

    Earned when you have been with Laracasts for 3 years.

  • 4-years Created with Sketch.

    Four Year Member

    Earned when you have been with Laracasts for 4 years.

  • 5-years Created with Sketch.

    Five Year Member

    Earned when you have been with Laracasts for 5 years.

  • school-session Created with Sketch.

    School In Session

    Earned when at least one Laracasts series has been fully completed.

  • welcome-newcomer Created with Sketch.

    Welcome To The Community

    Earned after your first post on the Laracasts forum.

  • full-time-student Created with Sketch.

    Full Time Learner

    Earned once 100 Laracasts lessons have been completed.

  • pay-it-forward Created with Sketch.

    Pay It Forward

    Earned once you receive your first "Best Reply" award on the Laracasts forum.

  • subscriber-token Created with Sketch.

    Subscriber

    Earned if you are a paying Laracasts subscriber.

  • lifer-token Created with Sketch.

    Lifer

    Earned if you have a lifetime subscription to Laracasts.

  • lara-evanghelist Created with Sketch.

    Laracasts Evangelist

    Earned if you share a link to Laracasts on social media. Please email [email protected] with your username and post URL to be awarded this badge.

  • chatty-cathy Created with Sketch.

    Chatty Cathy

    Earned once you have achieved 500 forum replies.

  • lara-veteran Created with Sketch.

    Laracasts Veteran

    Earned once your experience points passes 100,000.

  • 10k-strong Created with Sketch.

    Ten Thousand Strong

    Earned once your experience points hits 10,000.

  • lara-master Created with Sketch.

    Laracasts Master

    Earned once 1000 Laracasts lessons have been completed.

  • laracasts-tutor Created with Sketch.

    Laracasts Tutor

    Earned once your "Best Reply" award count is 100 or more.

  • laracasts-sensei Created with Sketch.

    Laracasts Sensei

    Earned once your experience points passes 1 million.

  • top-50 Created with Sketch.

    Top 50

    Earned once your experience points ranks in the top 50 of all Laracasts users.

17 Aug
5 days ago

ziben69 left a reply on Laravel 5.7 | Bootstrap Tabs - Problem With Multiple Tabs Generated From Laravel

Ok I did it like that:

 $service = Service::where('visible',1)->where('type','service')->orderBy('order', 'asc')->get();
        $organization = Service::where('visible',1)->where('type','organization')->orderBy('order', 'asc')->get();
        $other = Service::where('visible',1)->where('type','other')->orderBy('order', 'asc')->get();
        $production = Service::where('visible',1)->where('type','production')->orderBy('order', 'asc')->get();
        $weddings = Service::where('visible',1)->where('type','weddings')->orderBy('order', 'asc')->get();
        <ul class="nav nav-tabs">  
            <li class="active"><a data-toggle="tab" href="#weddings">Tab1</a></li>
            <li><a data-toggle="tab" href="#organization">Tab2</a></li>
            <li><a data-toggle="tab" href="#service">Tab3</a></li>
            <li><a data-toggle="tab" href="#production">Tab4</a></li>
            <li><a data-toggle="tab" href="#other">Tab5</a></li>
        </ul>

        <div class="tab-content">
            <div id="weddings" class="tab-pane fade in active">
                @foreach($weddings as $wedd)
                <h3>{{ $wedd->title }}</h3>
                <p>{!! $wedd->description !!}</p>
                @endforeach
            </div>
            <div id="organization" class="tab-pane fade in">
                @foreach($organization as $org)
                <h3>{{ $org->title }}</h3>
                <p>{!! $org->description !!}</p>
                @endforeach
            </div>
            <div id="service" class="tab-pane fade in">
                @foreach($service as $serv)
                <h3>{{ $serv->title }}</h3>
                <p>{!! $serv->description !!}</p>
                @endforeach
            </div>
            <div id="production" class="tab-pane fade in">
                @foreach($production as $pro)
                <h3>{{ $pro->title }}</h3>
                <p>{!! $pro->description !!}</p>
                @endforeach
            </div>
            <div id="other" class="tab-pane fade in">
                @foreach($other as $oth)
                <h3>{{ $oth->title }}</h3>
                <p>{!! $oth->description !!}</p>
                @endforeach
            </div>
        </div>

ziben69 left a reply on Laravel 5.7 | Bootstrap Tabs - Problem With Multiple Tabs Generated From Laravel

are you suggesting me make separate queries for each type one at a time?

So I have now in controller:

        $service = Service::where('visible',1)->where('type','service')->orderBy('order', 'asc')->get();
        $organization = Service::where('visible',1)->where('type','organization')->orderBy('order', 'asc')->get();
        $other = Service::where('visible',1)->where('type','other')->orderBy('order', 'asc')->get();
        $production = Service::where('visible',1)->where('type','production')->orderBy('order', 'asc')->get();
        $weddings = Service::where('visible',1)->where('type','weddings')->orderBy('order', 'asc')->get();

and what now?

ziben69 started a new conversation Laravel 5.7 | Bootstrap Tabs - Problem With Multiple Tabs Generated From Laravel

Hello guys,

I need to create tabs and I have something like that:

        <ul class="nav nav-tabs">
            @foreach($services as $serv)
            @if($serv->type != null)
            <li class="{{ $serv->id == 1 ? 'active' : ''}}"><a data-toggle="tab" href="#{{ $serv->id }}">
                @if( $serv->type === 'weddings' )
                Tab 1
                @elseif ( $serv->type === 'organization')
                Tab 2
                @elseif ( $serv->type === 'service')
                Tab 3
                @elseif ( $serv->type === 'production')
                Tab 4
                @elseif ( $serv->type === 'other')
                Tab 5
                @endif
                </a></li>
            @endif
            @endforeach
        </ul>

        <div class="tab-content">
            @foreach($services as $serv)
            @if($serv->type != null)
            <div id="{{ $serv->id }}" class="tab-pane fade in {{ $serv->id == 1 ? 'active' : ''}}">
                <h3>{{ $serv->title }}</h3>
                <p>{!! $serv->description !!}</p>
            </div>
            @endif
            @endforeach
        </div>

It works but not to end correct.

I get a result depending on the number of records in the database on the basis of: If the record is of the type e.g. "Tab 1" and I have 5 records having the type "Tab 1", I get 5 tabs called "Tab 1". How to make records of a particular type placed in appropriate tabs instead of creating another??

I need to have 5 tabs: Tab 1, Tab 2, Tab 3, Tab 4, Tab 5 Now I have: Tab 1, Tab 1, Tab 2, Tab 1, Tab 3 - multiple

Thanks for help!

16 Jul
1 month ago

ziben69 left a reply on Laravel 5.7 | External Server Router Error

yes, I did composer update before project upload

Hmm in composer.json I have:

        "php": "^7.1.3",

in PhpInfo() on server I have PHP in version 7.1.9. Maybe its problem?

ziben69 left a reply on Laravel 5.7 | External Server Router Error

Nice guide thanks, but that's all I've done in it. Unfortunately, it is not able to help me.

I wonder if this is not a server-side problem. Is it possible that it does not support the get, post, put, delete etc commands?

ziben69 started a new conversation Laravel 5.7 | External Server Router Error

Hello guys, I have problem with uploading my project to external server.

I made the following steps:

  1. place files on the server.
  2. I changed the path index in the file
  3. I changed the version of the php server to be compatible with my project (PHP 7.1)
  4. I changed the env file.
  5. Added .htaccess file:
AddHandler application/x-httpd-php71 php
<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

An error occurred:

Fatal error: Interface 'Illuminate\Contracts\Routing\BindingRegistrar' not found in /domains/example.com/public_html/example/vendor/laravel/framework/src/Illuminate/Routing/Router.php on line 29

Can someone help me? Thanks.

13 Jul
1 month ago

ziben69 started a new conversation Laravel 5.7 | Display Data From Column Table In 2 Bootstrap's Column

Hello guys, how can I display data in more than one column?

Now when I display data like

{{  $example->title }}

I have something like this:

A
B
C
D
E
F

How can I make:

A   B
C   D
E   F

I use in my project Bootstrap 4.

Thanks

11 Jul
1 month ago

ziben69 started a new conversation Laravel 5.7 | Multiple Post Metods In One View

Hello guys, how can I handle multiple post metods. I have something like this:

Routes:

Route::get('business/create','[email protected]')->middleware('auth');
Route::post('business/', '[email protected]')->middleware('auth');
Route::get('business/createDoctor','[email protected]')->middleware('auth');
Route::post('business/', '[email protected]')->middleware('auth');

View:

<div class="row">
        <div class="col-lg-6">
                  <a href="{{ URL::to('business/create') }}">Add Element</a>
       </div>
       <div class="col-lg-6">
                  <a href="{{ URL::to('business/createDoctor') }}">Add Doctor</a>
       </div>
</div>

BusinessController:

 public function create()
    {
        return view('pages.business.create');
    }
 public function store(Request $request)
    {
        $business = Business::create($request->all());
        return redirect()->action('[email protected]');
    }
public function createDoctor()
    {
        return view('pages.business.createDoctor');
    }
public function storeDoctor(Request $request)
    {
        $business = Business::create($request->all());
        return redirect()->action('[email protected]');
    }

And I have a problem with many post methods. One works, the second throws a error:

Action App\Http\Controllers\[email protected] not defined.

is there any way to fix it? So much thanks!

17 May
3 months ago

ziben69 left a reply on VUE.js | Reload Page On External Server After Update.

Hi, @sergiu17 I dont understand.

I have changed a few lines of code in the component and I would like to just refresh what I have on the page

ziben69 started a new conversation VUE.js | Reload Page On External Server After Update.

Hey guys, can you tell me how can I re-render content on page after update on external server?

Thanks so much.

26 Mar
4 months ago

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

Yup. After re-uploading project it started work... +1 from me to you for help! Thanks so much

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

Awww... still the same.

I don't have nerves anymore. Wait for the whole project to be blasted and see if there will be an effect

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

I am loading the app.js file.

But it works locally, except that the older version (before changes) of the application works without any complaints on the server, I threw it yesterday. It's all about these changes today

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

Ok it works, but only on xampp server. On external server still 0 effect. Should I upload more files than only component?

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

it works because above I have something like that:

 <tr v-for="(about, index) in aboutsNew">
            <td>{{ about.id }}</td>
        // more <td>
           <td>
                <div v-for="(photo, index) in about.photos" class="text-center">
                    <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" :data-target="'#photoModal-' + about.id" style="width: 30px; height:30px; padding: 0.25rem 0.25rem;">
                        <i class="fa fa-picture-o" aria-hidden="true"></i>
    </button>
                    <!-- The Modal -->
                    <div class="modal fade" :id="'photoModal-' + about.id">
                        <div class="modal-dialog"> 
                            <div class="modal-content">
                                <!-- Modal Header -->
                                <div class="modal-header">
                                    <h4 class="modal-title">{{ about.title }}</h4>
                                    <button type="button" class="close" data-dismiss="modal">&times;</button>
    </div>
                                <!-- Modal body -->
                                <div class="modal-body">
                                    <div class="admin-thumbnail">
                                        <img class="img-responsive" :src="photo.path"  style="width:300px; height:auto;"/>
    </div>
    </div>
                                <!-- Modal footer -->
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-danger" data-dismiss="modal">Zamknij</button>
    </div>
    </div>
    </div>
    </div>
    </div>
    </td>

I uploaded the component from the ftp server again, I did it before and it worked, now isn't

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

Ah ok, it doesn't work.

I have always photoModal-0, in each record.

I changed for:

            <div v-for="(photo, index) in about.photos" class="text-center">
                    <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" :data-target="'#photoModal-' + about.id"><i class="fa fa-picture-o" aria-hidden="true"></i>
    </button>
                    <!-- The Modal -->
                    <div class="modal fade" :id="'photoModal-' + about.id">

Now its ok on xampp server. But on a external server I see still:

<button type="button" data-toggle="modal" data-target="#photoModal" class="btn btn-outline-secondary btn-sm" style="width: 30px; height: 30px; padding: 0.25rem;"><i aria-hidden="true" class="fa fa-picture-o"></i></button>

why it does not change after clearing the cache

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

My console effect:

<button type="button" data-toggle="modal" data-target="#photoModal" class="btn btn-outline-secondary btn-sm" style="width: 30px; height: 30px; padding: 0.25rem;"><i aria-hidden="true" class="fa fa-picture-o"></i></button>

Yes, I cleared cache. Still #photoModal here.

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

Still the same :/

<div v-for="(photo, index) in about.photos" class="text-center">
                    <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" :data-target="'#photoModal-' + index"><i class="fa fa-picture-o" aria-hidden="true"></i>
    </button>
                    <!-- The Modal -->
                    <div class="modal fade" :id="'photoModal-' + index">

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

I added:

<div v-for="(photo, index) in about.photos" class="text-center">
                    <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" data-target="'#photoModal-' + index"><i class="fa fa-picture-o" aria-hidden="true"></i>
    </button>
                    <!-- The Modal -->
                    <div class="modal fade" :id="'photoModal-' + index">

but in effect I have the same...

ziben69 left a reply on Vue.JS | Display Different Photos In Modals.

<div v-for="(photo, index) in about.photos" class="text-center">
                    <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" data-target="{{ about.id }}"><i class="fa fa-picture-o" aria-hidden="true"></i>
    </button>
                    <!-- The Modal -->
                    <div class="modal fade" id="{{ about.id }}">

Changed, but still the same

ziben69 started a new conversation Vue.JS | Display Different Photos In Modals.

Hello guys,

I have a problem with displaying photos in vue component (bootstrap modals).

My component: (AboutTableDraggable):

<template>
...
<td>
    <div v-for="(photo, index) in about.photos" class="text-center">
        <button type="button" class="btn btn-outline-secondary btn-sm" data-toggle="modal" data-target="#photoModal" style="width: 30px; height:30px; padding: 0.25rem 0.25rem;"><i class="fa fa-picture-o" aria-hidden="true"></i>
        </button>
<!-- The Modal -->
        <div class="modal fade" id="photoModal">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">{{ about.title }}</h4>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                <div class="modal-body">
                    <div class="admin-thumbnail">
                        <img class="img-responsive" :src="photo.path"  style="width:300px; height:auto;"/>
                    </div>
                </div>
<!-- Modal footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Zamknij</button>
            </div>
        </div>
    </div>
</div>
</div>
</td>
...
</template>

in Photo model I have:

protected $appends = ['path'];

    public function getPathAttribute()
    {
        return asset('storage/app/'.$this->filename);
    }

the problem is that it displays one and the same image from the first record under each modal's rekord. How to make it display the right photo for the record?

Details: I have blade view with draggable table component. Inside the table I have data, and one specific column with photos. In this column is a button that opens the modal. In the modal should be photos suitable for a given record. For now, under the action of each button, she displays me the modal with the same photo (assigned to the first record in the table). I don't have such a problem in pure Laravel, here it is.

I will add that in lavavel I have 2 loops.

@foreach($example as $exam)
@foreach($exam->photos as $photo)
.........
@endforeach
@endforeach

and then it works. What should it look like in Vue? Can anyone look at my code? Thanks!

ziben69 left a reply on Npm Run Watch Command Stuck

I have one more problem with Vue, but I will write for moment new subject :P

ziben69 left a reply on Npm Run Watch Command Stuck

Oh yeah, Laravel Mix - Build successful :) Thank you for answers! You learned me how to reinstall modules! Bless you!

ziben69 left a reply on Npm Run Watch Command Stuck

I found error in one of vue components. After entering the command npm run production, it showed me the error of a particular component. Somewhere, I have a syntax error. I have to think where the error is. The empty component compiles without a problem, i.e. the error is in the component. I think I can deal with it, if not I hope I can count on you. Thank you

ziben69 left a reply on Npm Run Watch Command Stuck

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.18.0",
        "bootstrap": "^4.0.0",
        "cross-env": "^5.2.0",
        "jquery": "^3.2",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.5",
        "popper.js": "^1.12",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.17",
        "vue-template-compiler": "^2.6.8",
        "vuedraggable": "^2.19.1"
    },
    "dependencies": {
        "postcss-loader": "^3.0.0",
        "raw-loader": "^0.5.1"
    }
}

ziben69 left a reply on Npm Run Watch Command Stuck

@DIEGOAURINO - Ok, let's try :)

EDIT:

 14% building 35/54 modules 19 active ...able.vue?vue&type=template&id=25b3b81e&

now is 35/54 :/

ziben69 left a reply on Npm Run Watch Command Stuck

@DIEGOAURINO - Hey Diego, I use windows 10. So how can I install all modules again, I don't remember names of all modules :D

C:\xampp\htdocs\photography>npm run watch --verbose
npm info it worked if it ends with ok
npm verb cli [ 'C:\Program Files\nodejs\node.exe',
npm verb cli   'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
npm verb cli   'run',
npm verb cli   'watch',
npm verb cli   '--verbose' ]
npm info using [email protected]
npm info using [email protected]
npm verb run-script [ 'prewatch', 'watch', 'postwatch' ]
npm info lifecycle @~prewatch: @
npm info lifecycle @~watch: @

> @ watch C:\xampp\htdocs\photography
> npm run development -- --watch

npm info it worked if it ends with ok
npm verb cli [ 'C:\Program Files\nodejs\node.exe',
npm verb cli   'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
npm verb cli   'prefix',
npm verb cli   '-g' ]
npm info using [email protected]
npm info using [email protected]
npm verb exit [ 0, true ]
npm info ok
npm info it worked if it ends with ok
npm verb cli [ 'C:\Program Files\nodejs\node.exe',
npm verb cli   'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
npm verb cli   'run',
npm verb cli   'development',
npm verb cli   '--',
npm verb cli   '--watch' ]
npm info using [email protected]
npm info using [email protected]
npm verb run-script [ 'predevelopment', 'development', 'postdevelopment' ]
npm info lifecycle @~predevelopment: @
npm info lifecycle @~development: @

> @ development C:\xampp\htdocs\photography
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js "--watch"

 10% building 1/1 modules 0 active
webpack is watching the files…

 14% building 34/52 modules 18 active ...able.vue?vue&type=template&id=17a64db7&

ziben69 started a new conversation Npm Run Watch Command Stuck

Hello guys, I have big problem with npm run watch command

When I approve the command, it only goes to a certain point and stands:

 14% building 37/53 modules 16 active ...able.vue?vue&type=template&id=1e5566b8&

I've tried already to run

npm run development

command but still the same. Can you help me?

Thanks

20 Mar
5 months ago

ziben69 started a new conversation VUE.js | Redirecting To Outside Website

Hello guys, how can I redirect in Vue to outside website. I have something like this:

<a v-bind:href=" business.link " target="_blank">test</a>

but it gives me result:

http://localhost/business/www.example.com

I need only

http://www.example.com

Thanks so much!

19 Mar
5 months ago

ziben69 started a new conversation VUE.js | Limit Of Displayed Text | Filter

Hello guys, I need to display only few characters from DB, and I filter like this:

<td>{{ business.description|truncate(20) }}</td>

...
        filters: {
            truncate: function(value) {
                if (value.length > 20) {
                    value = value.substring(0, 17) + '...';
                }
                return value
            }
        },
...

And I have got error:

[Vue warn]: Error in render: "TypeError: Cannot read property 'length' of null".

How can I repair it? Thanks.

ziben69 started a new conversation VUE.js + Laravel | Display Videos | Foreach Loop

Hello guys, I have problem with displaying videos.

I have something like this.

Model:

class Video extends Model
{
    protected $fillable = [
        'filename',
        'business_id',
    ];
    protected $appends = ['path'];

    public function getPathAttribute()
    {
        return asset('storage/'.$this->filename);
    }
    public $timestamps = false;

    public function business()
    {
        return $this->belongsTo(Business::class, 'business_id');
    }

I will say that adding video to the database works. I have a sample video in the database. So uploading works. Hmm...

Here is part of vue.js file:

            <draggable :list="businessesNew" :options="{animation:200, handle:'.my-handle'}" :element="'tbody'" @change="update">

        <tr v-for="(business, index) in businessesNew">
            <td>{{ business.id }}</td>
            <td>{{ business.title }}</td>
            <td>{{ business.description }}</td>
            <td>{{ business.order }}</td>
            <td v-if="business.visible === 1">Tak</td>
            <td v-else>Nie</td>
            <td v-if="business.lang === 'pl'">Polski</td>
            <td v-else>Angielski</td>
            <td>
                <div v-for="(photo, index) in business.photos">
                    <div class="admin-thumbnail">
                        <img class="img-responsive" :src="photo.path"  style="width:30px; height:auto;"/>
    </div>
    </div>
    </td>
            <td>
                <div v-for="(video, index) in business.videos">
                    test
                    <div class="admin-thumbnail">
                        <video width="320" height="240" controls>  
                            <source :src="video.path" type="video/mp4"> 
    </video>
    </div>
    </div>
    </td>
            <td><a :href="'edit/' + business.id" class="btn btn-primary btn-sm"><i class="fa fa-pencil" aria-hidden="true"></i></a>
                <a :href="'delete/' + business.id"
                   onClick="return confirm('Czy na pewno usunąć?')" class="btn btn-danger btn-sm"><i class="fa fa-times" aria-hidden="true"></i></a>
                <a class="btn btn-dark btn-sm" style="cursor:move;"><i class="fa fa-arrows my-handle" aria-hidden="true" style="color:#fff;"></i></a>
    </td>
    </tr>
    </draggable>

Photos are displayed correctly, and the video doesn't, even the error in the console regarding the photos doesn't pop up.

It seems to me that it doesn't enter the loop at all

  <div v-for="(video, index) in business.videos">

Here is my function from controller:

 public function clist(BusinessRepository $busRepo)
    {
        $businesses = Business::orderBy('order')->get();
        $businessesVisible = $businesses->filter(function ($business, $key) {
            return $business->visible;
        })->values();
        $businessesNotVisible = $businesses->filter(function ($business, $key) {
            return ! $business->visible;
        })->values();
        return view('pages.business.list')->with([
            'businesses' => $businesses,
            'businessesVisible' => $businessesVisible,
            'businessesNotVisible' => $businessesNotVisible,
        ]);
    }

Photos and videos are combined in a one-to-many relationship with the business table. Photos are displayed, Video isn't. What can I do?

15 Mar
5 months ago

ziben69 left a reply on Vue.js | Get Data From CKeditor And Saving It To The Database

but how to pass data from input to "firstName" in axios

14 Mar
5 months ago

ziben69 started a new conversation Vue.js | Get Data From CKeditor And Saving It To The Database

Hello guys, Im looking for help with getting data from CKEditor.

I had 2 versions, and only 1 works (clear Laravel):

Controller (function store):

 public function store(Request $request)
    {
        $business = Business::create($request->all());
        if($request->has('photos')) {
            foreach ($request->photos as $photo) {
                $filename = $photo->store('public/photos');
                Photo::create([
                    'business_id' => $business->id,
                    'filename' => $filename
                ]);
            }
        }
        return redirect()->action('[email protected]');
    }

This method works for (clear Laravel):

<textarea class="form-control" rows="5" name="description" id="description"></textarea>

But I would like it to work from the vue.js level In component I have something like that (with Vue.JS component):

<template>
     <vue-ckeditor type="classic" v-model="editorData" :editors="editors"></vue-ckeditor>
</template>

<script>
    import VueCkeditor from 'vue-ckeditor5'

    export default {
        components: {
            'vue-ckeditor': VueCkeditor.component
        },
        data(){
            return {
                editors: {
                    classic: ClassicEditor
                },
                editorData: '<p>Content of the editor.</p>',
            }
        },
    }
</script>

and calling the component in the view:

<vue-ck name="description" id="description"></vue-ck>

it isn't work. Can you help me with transferring values ​​from the editor to the database? So much thanks.

13 Mar
5 months ago

ziben69 left a reply on Vue.js | Ckeditor Integrate With Vue.js

@NORBERTHO - Yes:


ckeditor.js:5 ckeditor-version-collision: The global CKEDITOR_VERSION constant has already been set. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-ckeditor-version-collision
 {collidingVersion: "12.0.0", version: "11.2.0"}
error @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
n @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
n @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
(anonymous) @ ckeditor.js:5
(anonymous) @ ckeditor.js:5


app.js:40212 [Vue warn]: Property or method "value1" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

(found in <Root>)
12 Mar
5 months ago

ziben69 started a new conversation Vue.js | Ckeditor Integrate With Vue.js

Hello guys, I am trying to upload ckeditor to my project, but for 7 hours I try and it does not go away. I searched google, installed from 30 packages (npm), I did with tutorials and slowly give up. Please help, I need to configure wysiwyg editor globally for all views that contain id = "description".

I have something like that: component CKeditor.vue

<template>

</template>

<script>
    import ClassicEditor from '@ckeditor/ckeditor5-build-classic'
    import VueCkeditor from 'vue-ckeditor5'

    export default {
        components: {
            'vue-ckeditor': VueCkeditor.component
        },
        data(){
            return {
                value1: 'hello',
                value2: 'world',
                editors: {
                    classic: ClassicEditor
                }
            }
        },
        template: 
        `<vue-ckeditor type="classic" v-model="value1" :editors="editors"></vue-ckeditor>`
    }
</script>

View create.blade.php:

<ckeditor type="classic" v-model="value1" class="form-control" rows="5" name="description"
                                      id="description" placeholder="Description" maxlength="3000"></ckeditor>

app.js:

import Vue from 'vue'
import axios from 'axios'

Vue.prototype.$http = axios

require('./bootstrap');

Vue.component('ckeditor', require('./components/CKeditor.vue').default);

window.Vue = require('vue');
window.onload = function () {
    const app = new Vue({
        el: '#app'
    });
}

the works were on the tutorial from https://github.com/igorxut/vue-ckeditor5

please help me run this wysiwyg editor. So much thanks... :*

ziben69 left a reply on VUE.js | Display Photos From Storage

@EDOC - Yeah I have public storage, but still the same error - after changes. Hmm... When I upload project on web server I see photos, but in localhost xampp no.

ziben69 left a reply on VUE.js | Display Photos From Storage

Okey thanks for help I will try do it :)

ziben69 left a reply on VUE.js | Display Photos From Storage

@EDOC - ok I recompiled and now I have something like that:

GET http://localhost/storage/app/public/photos/E6Zx5QHJHRrlXikBQbRislhr2Q2y1eiDLAGpOVAa.jpeg 404 (Not Found)

ziben69 left a reply on VUE.js | Display Photos From Storage

@EDOC - Sure:

<template>
<table class="table">
    <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col">Nagłówek</th>
            <th scope="col">Opis</th>
            <th scope="col">Data dodania</th>
            <th scope="col">Pozycja</th>
            <th scope="col">Widoczność</th>
            <th scope="col">Język</th>
            <th scope="col">Obrazy</th>
            <th scope="col">Operacje</th>
    </tr>
    </thead>
    <draggable :list="businessesNew" :options="{animation:200, handle:'.my-handle'}" :element="'tbody'" @change="update">
        <tr v-for="(business, index) in businessesNew">
            <th scope="row">{{ business.id }}</th>
            <td>{{ business.title }}</td>
            <td>{{ business.description }}</td>
            <td>{{ business.created_at }}</td>
            <td>{{ business.order }}</td>
            <td>{{ business.visiblity }}</td>
            <td>{{ business.lang }}</td>
            <td>
                <div v-for="(photo, index) in business.photos">
                    <div class="admin-thumbnail">
//HERE
                        <img class="img-responsive" :src="'photo.path"  style="width:30px; height:auto;"/>
    </div>
    </div>
    </td>
            <td><a :href="'edit/' + business.id" class="btn btn-primary btn-sm"><i class="fa fa-pencil" aria-hidden="true"></i></a>
                <a :href="'delete/' + business.id"
                   onClick="return confirm('Czy na pewno usunąć?')" class="btn btn-danger btn-sm"><i class="fa fa-times" aria-hidden="true"></i></a>
                <a class="btn btn-dark btn-sm" style="cursor:move;"><i class="fa fa-arrows my-handle" aria-hidden="true" style="color:#fff;"></i></a>
    </td>
    </tr>

    </draggable>
    </table>
</template>

<script>
    import draggable from 'vuedraggable'

    export default {
        components: {
            draggable
        },

        props: ['businesses'],
        
        data(){
          return {
              businessesNew: this.businesses,
          }  
        },
        
        methods: {
          update(){
              this.businessesNew.map((businesses, index) => {
                  businesses.order = index + 1;
              })
              
              axios.put('/business/updateAll', {
                  businesses: this.businessesNew
              }).then((response) =>{
                  //success message
              })
          }  
        },
        
        mounted() {
        console.log('Component mounted.')
    }
    }
</script>

ziben69 left a reply on VUE.js | Display Photos From Storage

@EDOC - still error :/

'%20+%20photo.filename:1 GET http://localhost/business/'storage/app/'%20+%20photo.filename 404 (Not Found)

ziben69 started a new conversation VUE.js | Display Photos From Storage

Hello guys,

how can I correctly display photos from storage. In Laravel I had something like that:

        @foreach(($business->photos) as $photo)
        <div class="admin-thumbnail">
        <img class="img-responsive" src="{{ url('storage/app/'.$photo->filename) }}"  style="width:30px;            height:auto;"/>
        </div>
        @endforeach

and now I'm trying to do the same in Vue:

<div v-for="(photo, index) in business.photos">
    <div class="admin-thumbnail">
        <img class="img-responsive" :src="'storage/app/' + photo.filename"  style="width:30px; height:auto;"/>
     </div>
 </div>

but I get error in console:

Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost/business/'storage/app/'%20+%20photo.filename

Thanks so much!

11 Mar
5 months ago

ziben69 left a reply on Truncate Table With Foreign Key

@STEREOH - That's work! Yeah time to analyze what you wrote.

<3 Thank you and everyone for help!

ziben69 left a reply on Truncate Table With Foreign Key

But tell me how we can update photo, now we are still deleting it

@stereoh - at the moment we are deleting photos after moving the row in the table. Now how do I load this picture from scratch?

ziben69 left a reply on Truncate Table With Foreign Key

@GORAKH - It deleting my photos from DB

ziben69 left a reply on Truncate Table With Foreign Key

@STEREOH -

I added in migration:

    public function up()
    {
        Schema::table('photos', function(Blueprint $table){
            $table->integer('business_id')->unsigned()->change()->nullable();
            $table->foreign('business_id','photos_business_id_foreign')->references('id')->on('businesses')->onDelete('set null');
        });
    }

and back with controller function updateAll to:

    public function updateAll(Request $request)
    {
        Business::truncate();

        foreach($request->businesses as $business){
            Business::create([
                'id' => $business['id'],
                'title' => $business['title'],
                'description' => $business['description'],
                'order' => $business['order'],
                'visiblity' => $business['visiblity'],
                'lang' => $business['lang'],
            ]);
        }
        return response('Update Successful.',200);
    }

php artisan migrate:fresh done

and again I have error:

"message": "SQLSTATE[42000]: Syntax error or access violation: 1701 Cannot truncate a table referenced in a foreign key constraint (`photography`.`photos`, CONSTRAINT `photos_business_id_foreign` FOREIGN KEY (`business_id`) REFERENCES `photography`.`businesses` (`id`)) (SQL: truncate `businesses`)",