I've been trying multiple solutions but none of them worked out for me. Maybe because I am using
newest version of Laravel. So this place is my last hope.
All of these code snippets are inside one blade file.
#section('stylesheets')
<script src="https://cdn.tiny.cloud/1/[my-api-key]/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
<script>
tinymce.init({
selector: 'textarea',
menubar: false,
});
</script>
#endsection
And inside the content section I have this very simple code, later I will add other features,
but I am not moving on until this works out.
#section('content')
<div class="container">
<div class="card-body">
<form method="post">
#csrf
<div class="form-group row">
<label for="body" class="col-md-4 col-form-label text-md-right">Text</label>
<textarea name="body" id="body" class="form-control"></textarea>
</div>
</form>
</div>
</div>
#endsection
I have opened account on their website, and I have api key. But it doesn't work.
Also if you know some rich text editor other than Tinymce, that works fine with laravel 8, please share it.
The scripts are referring to wrong section, I moved everything inside content, and voila, it worked.
Related
I Am trying to open datepicker from textbox. Datepicker open but not showing properly. ( Check Ref Image ).
Can anyone help me ....
Script:-
<script>
$('#milksaledate').datepicker({
format: 'yyyy-mm-dd',
autoclose: true
});
</script>
Modal Text Box
<div class="col-md-3">
<div class="form-group">
<label>Date of Sale <span class="validate">*</span> :</label>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text"><i class="far fa-calendar-alt"></i></span>
</div>
<input type="text" class="form-control" name="milksaledate" id="milksaledate">
</div>
</div>
</div>
Script
<script src="plugins/datatables/jquery-3.5.1.js"></script>
<script src="plugins/jquery-ui/jquery-ui.min.js"></script>
[![enter image description here][1]][1]<script src="plugins/jquery-ui/jquery-ui.js"></script>
There could be multiple reasons for this:
Is it maybe possible you have multiple inputs where the id is milksaledate? I think in general it's better to use something like $('.datepicker').datepicker(..) and add class='datepicker' to each input which uses the datepicker.
When are you calling $('#milksaledate').datepicker(..)? Is it on page load, or after the modal has opened? Because if you call this code before a modal has initialized, the datepicker will not affect the modal.
Another reason could be due to z-index or other style issues concerned specifically to jquery-ui
``I am new in using ckeditor and working on simple crud application using ckeditor. it is working well in the create blade but not showing in the update blade.
here is my blade code
<script src="ckeditor/ckeditor.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.ckeditor').ckeditor();
})
</script>
</head>
<body>
<form method = "post" action="{{url('updateblog')}}" enctype = "multipart/form-data">
#csrf
#method('PATCH')
<label for="title">Title</label>
<textarea class="ckeditor form-control" name="title">{!!$blog ->title!!}</textarea><br>
</form>
Try this, this worked for me:
<textarea class="ckeditor form-control" name="title">{{ $blog->title }}</textarea>
I hope i can help you.
i'm using Laravel 5.7 and WampServer to develop a project thats giving me a weird problem: it is taking an eternity to load up on my browser and I don't know whats going on. I have another Laravel project that works just fine but this one just crashed for one day to another. What can I do in order to fix this? I don't know where to start.
EDIT 1: I've commented the next component and my project runs fine. Either way, I can't see a problem in there. Can anybody help me with it?
<template>
<div class="card">
<div class="card-header text-center text-uppercase">{{ userEmailNotFound ? 'Ingresa tu correo electrónico' : 'Responde a la siguiente pregunta' }}</div>
<div class="card-body">
<div class="input-group mb-3" v-show="userEmailNotFound">
<div class="input-group-prepend">
<span class="input-group-text mdi mdi-email" id="email-addon"></span>
</div>
<input v-model="userEmail" name="email" type="email" class="form-control" id="email" placeholder="Correo electrónico" aria-describedby="email-addon" required>
</div>
</div>
</div>
</template>
<script>
import axios from 'axios'
import swal2 from '../mixins/swal2'
// this.swalMixin('success', '¡Artículo creado!')
export default {
data() {
return {
userEmail: '',
userEmailNotFound: true
}
},
methods: {
//
}
}
</script>
<style lang="scss" scoped>
</style>
When I said "commented" i meant this:
#extends('layouts.app')
#section('content')
<div class="row justify-content-center">
<div class="col-md-6">
{{-- <question-password-component></question-password-component> --}}
</div>
</div>
#endsection
In my blade view, i have code like below:
<template v-if="section4">
<div class="progress-item mt-3">
<div class="progress-item-top text-align-center">
<span>TITLE</span>
#if($routeName === 'planner.home.show')
<div>
編集
<button class="btn btn-fill no_print" onclick="window.print();">印刷</button>
</div>
#endif
</div>
<div>
#include('planner.Meeting.mtr4')
</div>
</div>
</template>
It works fine in Chrome, but when i test in IE, it show nothing.
I tried to remove condition v-if in template tag and it worked!
So i think that IE has problem with template v-if="condition".
Any idea? Thank you!
Yes, IE11 doesn't support this tag <template>（from HTML5）, you should just change it to <div> tag and it will work the same way.
I'm stucked with this code. I can't make it work, and i don't get any errors. Which might mean that i need an aditional dependency? It's simply not showing. Please help me. Thanks.
app.js - file
Vue.component('message', require('./components/Message.vue'));
const app = new Vue({
el: '#app'
});
Message.vue - file
<template>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Message</div>
<div class="panel-body">
I'm the component!
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
ready () {
console.log('Component ready')
}
}
</script>
home.blade.php - file
#extends('templates.default')
#section('content')
<h3>Welcome to Site</h3>
<div class="container">
<div id="app">
<message></message>
</div>
</div>
#stop
You may also need to clear browser cache when working with frontend. On mac this is command + shift + R. Also make sure you did run gulp to compile your js file.
Also make sure you included compiled js file to your layout template before </body>:
<script src="/js/app.js"></script>
I think you're missing the .default from the line
Vue.component('message', require('./components/Message.vue').default);