lundi 27 mars 2017

jQuery plugin not working inside a .vue component

I'm working in a vue component for my application in Laravel 5.3, I try to integrate the Laravel File Manager in a standalone button, but this not working, nothing happend when I clic on the button for choose an image, this component required a jQuery init setup, like the following line:

$('.lfm-img').filemanager('image');

I checked the component outside the .vue file and its working fine, only inside the .vue file is not working.

This is the vue component

<template>
    <div class="modal fade" 
            id="section-" 
            tabindex="-1" 
            role="dialog" 
            aria-labelledby="sectionLabel-">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" 
                            class="close" 
                            data-dismiss="modal" 
                            aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                    </button>

                    <h4 class="modal-title" id="sectionLabel-">
                        
                    </h4>
                </div>
                <div class="modal-body">
                    <!-- Field List -->
                    <div v-if="editing != true">
                        <ul class="list-group">
                            <li class="list-group-item" v-for="field in fields">
                                <div class="clearfix">
                                    <div class="pull-left">
                                        <span>
                                            
                                        </span>
                                    </div>
                                    <div class="pull-right">
                                        <button type="button" 
                                                class="btn btn-default" 
                                                data-toggle="tooltip" 
                                                title="Editar valor"
                                                @click="setField(field)">

                                            <i  class="fa fa-pencil-square fa-lg" 
                                                aria-hidden="true"></i>
                                        </button>
                                    </div>
                                </div>
                            </li>
                        </ul> 
                    </div>
                    <!-- / Field List -->
                    <!-- Save value form -->
                    <div v-else>
                        <form @submit.prevent="updateFieldValue()">
                            <!-- Fields types -->
                            <div v-if="field.fieldtype_id === 1">
                                <div class="form-group vertical-align">
                                    <label class="col-md-2 text-right">
                                        Texto
                                    </label>
                                    <div class="col-md-10">
                                        <input  type="text" 
                                                v-model="value" 
                                                placeholder="Ingrese el valor"
                                                class="form-control"
                                                required="required">
                                    </div>
                                </div>
                                <p><br></p>
                            </div>
                            <div v-if="field.fieldtype_id === 2">
                                <div class="form-group">
                                    <textarea   v-model="value" 
                                                placeholder="Ingrese texto"
                                                class="form-control"
                                                rows="5"
                                                required="required">
                                    </textarea>
                                </div>
                                <p><br></p>
                            </div>
                            <div v-if="field.fieldtype_id === 3">
                                <div class="form-group vertical-align">
                                    <label class="col-md-3 text-right">
                                        Seleccione una imagen
                                    </label>
                                    <div class="col-md-9">
                                        <div class="input-group">
                                            <span class="input-group-btn">
                                                <a  data-input="value" 
                                                    data-preview="holder" 
                                                    class="btn btn-primary lfm-img">
                                                    <i  class="fa fa-picture-o"
                                                        aria-hidden="true"></i> Seleccionar
                                                </a>
                                            </span>
                                            <input  id="value" 
                                                    v-model="value" 
                                                    class="form-control" 
                                                    type="text" 
                                                    name="value"
                                                    required="required">
                                        </div>
                                    </div>
                                </div>
                                <img id="holder" style="margin-top:15px;max-height:100px;">
                                <p><br></p>
                            </div>

                            <!-- Actions -->
                            <div class="clearfix">
                                <div class="pull-right">
                                    <button type="button" 
                                            class="btn btn-default" 
                                            data-dismiss="modal" 
                                            @click="finishEdit()">
                                            Cancelar
                                    </button>
                                    <button type="submit" 
                                            class="btn btn-primary">
                                            Guardar
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <!-- / Save value form -->
                </div>
                <div class="modal-footer">
                    <button type="button" 
                            class="btn btn-default" 
                            @click="finishEdit()" 
                            data-dismiss="modal">
                            Cerrar
                    </button>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        props: ['section'],

        data() 
        {
            return {
                fields: [],
                field: [],
                value: '',
                loading: true, // start the spin loader
                editing: false // show field list
            }
        },

        ready()
        {
            this.loading = false; // stop the spin loader
            this.getSectionFields();
        },

        methods: 
        {   
            startEdit()
            {
                this.editing = true;
            },

            finishEdit()
            {
                this.field = [];
                this.value = '';
                this.editing = false;
            },

            setField(field) {
                this.field = field;
                if (this.field.pivot.value !== null) {
                    this.value = this.field.pivot.value;
                }
                this.startEdit();
            },

            getSectionFields()
            {   
                var self = this; // store "this." scope
                // GET request
                this.$http.get('/api/getSectionFields/' + this.section.id )
                    .then((response) => {
                    // sucess callback
                    var json = JSON.parse(response.body); // json parse
                    self.fields = json.fields;
                    this.loading = false; // stop the spin loader
                }, function(response) {
                    // error callback
                    console.log(response);
                });
            },

            updateFieldValue()
            {   
                this.loading = true // start the spin loader
                var params = {  section : this.section.id, 
                                field : this.field.id, 
                                value : this.value 
                            };
                // POST request
                this.$http.post('/api/update-value', params)
                    .then((response) => {
                    // sucess callback
                    this.getSectionFields();
                    this.finishEdit();
                }, function(response) {
                    // error callback
                    console.log(response);
                    this.getSectionFields();
                });
            }
        }
    }
</script>



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2oaHI0m
via IFTTT

Access value before it's converted by an attribute accessor

I have an accessor on my model for a boolean column:

public function getActiveAttribute($value)
    {
        if ($value == 0) {
            return "No";
        } else {
            return "Yes";
        }
    }

The problem I am having is the corresponding form input, a radio button, does not have either options selected when I go to a create or edit view. I could amend the form so the values of the radio buttons are "Yes" and "No" and then write a mutator for the same field.

Is there a better way to do it?



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2ntQSXx
via IFTTT

Laravel submit doesn't work when form is in different containers

I'm working on a Laravel 5.3 project and I'm in the process of deploying to a staging server. For staging I used latest Laravel(5.4). Now, one of the problems is that locally, a form which is spread on some table cells is working, but on the staging version the submit button doesn't do anything (like it not part of the form).

<tbody>
    {!! Form::model($job = new \App\Models\Job, ['url' => 'admin/job']) !!}
    {!! Form::hidden('person', $person->id) !!}
        <tr>
          <td colspan="3" class="form-group">
              {!! Form::text('name', null, ['class' => 'form-control']) !!}
          </td>
          <td class="form-group">
              {!! Form::submit('Adauga', ['class' => 'btn btn-primary form-control']) !!}
          </td>
        </tr>
        {!! Form::close() !!}
        @foreach($jobs as $job)
             <tr> ....

On inspector both version are displaying the form opening and closing on the same line, but the local variant does send the request.

html in inspector

Does dividing a form's inputs in different containers is sloppy?



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2naSYce
via IFTTT

laravel groupby with orderby

    DB::table('group_lists')
        ->join('conversationsV2', 'group_lists.conversationsV2_id', '=', 'conversationsV2.id')
        ->join('messagesV2', 'group_lists.conversationsV2_id', '=', 'messagesV2.conversationsV2_id')
        ->whereIn('group_lists.conversationsV2_id', function ($query) use ($userID) {
            $query->select('conversationsV2_id')->from('group_lists')
                ->where('user_id', $userID)->get();
        })
        ->select('group_lists.user_id', 'conversationsV2.id', 'conversationsV2.type',
            DB::raw('max(messagesV2.id) as mid')
            , 'group_lists.conversationsV2_id')
        ->where('group_lists.user_id', '!=', $userID)
        ->groupBy('messagesV2.conversationsV2_id')
        ->orderBy('messagesV2.id', 'DESC')
        ->get();

MessageV2

Messagev2

grouplist enter image description here

Conversationv2 enter image description here

the Line ->orderBy('messagesV2.id', 'DESC') is not working due to ->groupBy('messagesV2.conversationsV2_id') so there any way i can groupby and orderby at the same time



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2mJPjpA
via IFTTT

Laravel Charts with erik.cat

I want to generate a random chart with Erik Charts but is not displaying anything!

$data = DB::table('disease')->get();

        $chart = Charts::create('bar', 'highcharts')
             ->title('My nice chart')
             ->elementLabel('My nice label')
             ->labels($data->pluck('disease_id'))
             ->values($data->pluck('disease_name'))

             ->responsive(true);



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2ntmIU2
via IFTTT

Laravel FacebookProvider Error. Undefined variable: access_token

I have strange problem with facebook provider in my project (Laravel 5.2);

Undefined variable: access_token vendor/laravel/socialite/src/Two/FacebookProvider.php 80

It's strange because it worked long time and now i have error. Nothing was changed in my code.



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2naFCNb
via IFTTT

Laravel + Vue JS: Get/store value of Eloquent Model from DB

I build a SPA with vue.js 2 for the frontend and Laraval as Backend API. Now I try to implement a validation if the user failed to sign in more than 3 times.

So I added a column 'login_attempts' (int) for my users table. My problem is, that I don't know how to get the 'login_attempts' value with Eloquent ORM in my laravel backend.

In addition I want to increase/reset that value if further validation of the login attempt has failed/passed.

// UserController.php
public function signin(Request $request) {

    $credentials = $request->only('email', 'password');
    $email = $request->input('email');

    // Check if login attempts above 3
    // Here I need to get the 'login_attempts' value
    $loginAttempts = App\User::where('email', $email)->value('login_attempts');
    if($loginAttempts >= 3){
       // Response: To many attempts
    }

    try{
        // Some JWT  Auth validation
        }
    } catch (JWTException $e) {
        // Increase failed login counter
        // $attemptedUser->   <--- Here i need to increase the 'login_attempts' for the user with the email of the login request
        $attemptedUser->save();
    }
    // Some more validation and response
}

Thanks for any help.



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2nanV0h
via IFTTT