Giriş yapmadınız.

#1 15.01.2019 12:22:02

Kevin-Mitnick
Üye
Kayıtlı: 26.05.2016
Mesajlar: 469

İnputa Null ise border vermek

Selamlar laravel + vue.js ile bir proje geliştiriyorum . Ama bir yerde takılmış durumdayım.Postu veri tabanına kayıt ediyorum. Textarea 20 karakterden küçükse falan  button çıkmıyor onlarda çalışıyor adam başlığı girmemiş ise button disable oluyor. Buda iyi ama

1-Title boş bırakılmış ise style nasıl verebilirim.

2- Sayfa Yenilenmeden Verileri veri tabanından nasıl çekebilirim ?

Teşkkürler.

              <div id="app">
                        <form @submit="formSubmit">
                            <label for="">Açıklama</label><br/>
                            <input type="text" v-model="deneme2" class="form-control">
                            <textarea v-model="description" class="form-control"  cols="20" rows="5"></textarea>
                                @{{  description.length  }} <br/>

                            <button v-if="description.length>=20 && description.length<250"  :disabled="!deneme2"  type="submit" class="btn btn-success" id="butonls">Gönder</button><br/>
                            <button v-if="description.length>=250" disabled class="btn btn-danger">Maximum Boyutu Aştınız</button>
                            <span v-if="description.length<20">En Az 20 Karakter Giriniz</span>
                        </form>
                    </div>
                </div>
                <div id="links">
                    <ul>
                        <li v-for="postlar in list">
                            @{{ postlar.title }}
                        </li>
                    </ul>
                </div>
var app = new Vue({
    el: '#app',
    data() {
        return {
            deneme2: '',
            description: '',
            output: ''
        };
    },
    methods: {
        formSubmit(e) {
            e.preventDefault();
            let currentObj = this;
            axios.post('/formSubmit', {
                title: this.deneme2,
                description: this.description
            })
                .then(function (response) {
                Swal({
                        position: 'top-end',
                        type: 'success',
                        title: 'Yazınız Başarı İle Paylaşıldı',
                        showConfirmButton: false,
                        timer: 1500
                    });
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    }
});

//VERİLERİ ÇEKMEK

var app2 = new Vue({

    el:'#links',

    data(){
        return  {
            list : []
        }
    },

    created(){
        axios.get('/post')
            .then(response=>this.list = response.data);
    }


});

Mister Koder

Çevrimdışı

Forum alt kısmı