Add image to button Laravel 5 - laravel-5

Hi my submit button is like this:
{!! Form::open([
'id' => 'form-id',
'method' => 'delete',
'action' => ['ToDoListController#delete', $task->id],
]) !!}
{!! Form::submit('Delete', [
'id' => 'my-id',
'name' => 'bt_add',
'image' => '../../images/delete.jpg',
]) !!}
{!! Form::close() !!}
I want to add image to my button but don't know how. Please help me.

Why not use a button?
<button type="submit" id="my-id" name="btn_add"><img src=""></button>

You can add a css class to your button and then define the image to be used in that class e.g.
{!! Form::submit('Delete', [
'id' => 'my-id',
'name' => 'bt_add',
'class' => 'bt_add',
]) !!}
In the css...
.bt_add {
background:url(/images/Btn.PNG) no-repeat;
width: 200px;
height: 100px;
border: none;
}
Sorry I haven't tested this (bit of a hurry) but this should give you the effect you want. See other posts on button images e.g. Setting an image button in CSS - image:active

Related

Missing Keys: title

I installed Bagisto and everything run smoothly until I added Laravel AliExpress Dropshipping.
There's error :
Webkul\Ui\Exceptions\ActionKeyException
Missing Keys: title (View: /Applications/MAMP/htdocs/bagisto/packages/Webkul/Dropship/src/Resources/views/admin/products/index.blade.php)
What does Missing Keys: title means
#extends('admin::layouts.content')
#section('page_title')
{{ __('dropship::app.admin.products.title') }}
#stop
#section('content')
<h1>
{{ __('dropship::app.admin.products.title') }}
</h1>
<div class="page-action">
<button class="btn btn-lg btn-primary" style="display: none">
{{ __('dropship::app.admin.products.import-btn-title') }}
</button>
</div>
I had a similar problem with Bagisto Bulk Upload extension. To fix it I added the 'title' key to both addAction at extension's DataGrid class.
public function prepareActions() {
$this->addAction([
'type' => 'Edit',
'method' => 'GET', // use GET request only for redirect purposes
'route' => 'marketplace.bulkupload.profile.edit',
'icon' => 'icon pencil-lg-icon',
'title' => ''
]);
$this->addAction([
'type' => 'Delete',
'method' => 'GET', // use GET request only for redirect purposes
'route' => 'marketplace.bulkupload.profile.delete',
'icon' => 'icon trash-icon',
'title' => ''
]);
$this->enableAction = true;
}
Source

Rendering chart from the controller to view

I am using laravel chart(laraveldaily)
controller
$options = [
'chart_title' => 'Animals by type',
'chart_type' => 'pie',
'report_type' => 'group_by_relationship',
'model' => 'App\Animal',
'relationship_name' => 'type', // represents function type() on Transaction model
'group_by_field' => 'category', // types.category
'filter_months' => 12, // show only transactions for last 30 days
];
$chart2 = new LaravelChart($options);
return view('admin.index', compact('users', 'chart2'));
In my view I have
<div class="row pl-lg-5" style="width: 40%;">
<h1>{{ $chart2->options['chart_title'] }}</h1>
{!! $chart2->renderHtml() !!}
<hr>
</div>
#section('scripts')
{!! $chart2->renderJs() !!}
{!! $chart2->renderChartJsLibrary() !!}
#endsection
I am getting only the title and there is no chart
Include the ChartJS library from CloudFlare before you render the JS code that uses Chart
#section('scripts')
{!! $chart2->renderChartJsLibrary() !!}
{!! $chart2->renderJs() !!}
#endsection
Hope this helps

Laravel 5.4 mail markdown 2 button inline

I would like to know how to place the button next to each other.
Now it is on a separate line.
#component('mail::message')
Dear {{$vendor_name}}
Product {{$product_id}} : {{$product_name}} price id : {{$price_id}} will expire on {{$date_expire}}.
Please renew price.
#component('mail::button', ['url' => 'http://phuketjettour.com/', 'color' => 'green'])
Phuket Jet Tour
#endcomponent
#component('mail::button', ['url' => 'http://phuketjettour.com/s/vendors'])
Vendor submission
#endcomponent
Thanks,<br>
Phuket Jet Tour
#endcomponent
Dynamic number of inline buttons
For me the following worked to create 2, 3, 4 (dynamic number) of buttons inline in Laravel markdown mails:
1) Add a new directory for your custom component
First lets extend the mail configuration to include our new directory for components:
config/mail.php
<?php
// ...
'markdown' => [
'theme' => 'default',
'paths' => [
resource_path('views/vendor/mail'),
resource_path('views/emails/components') // <-- This line was added
],
],
2) Create the new component for inline buttons
You need to create both, the HTML and the text version of the component. Otherwise you will get a InvalidArgumentException "View $name not found":
www/resources/views/emails/components/html/buttons.blade.php
This is the HTML file:
<table class="action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="center">
<table width="100%" border="0" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="center">
<table border="0" cellpadding="0" cellspacing="0" role="presentation">
#if(null !== ($headline ?? null))
<tr><td><h2 style="text-align: center;">{{ $headline }}</h2></td></tr>
#endif
<tr>
<td>
#foreach($buttons as $button)
{!! $button['slot'] !!}
#endforeach
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
www/resources/views/emails/components/text/buttons.blade.php
This is the text file
#if(null !== ($headline ?? null))
{{ $headline }}
------------------------------
#endif
#foreach($buttons as $button)
{!! $button['slot'] !!}: {{ $button['url'] }}
#endforeach
3) Include the new component in your mails:
Now you can just include the component in your markdown emails like so:
Example with 2 inline buttons and a headline:
#component('mail::buttons', [
'headline' => 'Share link',
'buttons' => [
[
'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
'slot' => 'WhatsApp',
],[
'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
'slot' => 'Telegram',
]
]
])
#endcomponent
Example with 3 inline buttons without a headline:
#component('mail::buttons', [
'buttons' => [
[
'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
'slot' => 'WhatsApp',
],[
'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
'slot' => 'Telegram',
],[
'url' => 'https://twitter.com/intent/tweet?text=' . urlencode('Twitter text'),
'slot' => 'Twitter',
]
]
])
#endcomponent
Example with 3 inline buttons with different colours:
#component('mail::buttons', [
'buttons' => [
[
'url' => 'https://wa.me/?text=' . urlencode('Whatsapp text'),
'slot' => 'WhatsApp',
'color' => 'blue' // This is the default
],[
'url' => 'https://t.me/share/url?text=' . urlencode('telegram text'),
'slot' => 'Telegram',
'color' => 'green'
],[
'url' => 'https://twitter.com/intent/tweet?text=' . urlencode('Twitter text'),
'slot' => 'Twitter',
'color' => 'red'
]
]
])
#endcomponent
I have done it like this, ofcourse the css should be in a separated file
<style>
.email-row {
}
.email-col-2 {
width: 49%;
display: inline-block;
}
</style>
#component('mail::message')
<div class="email-row">
<div class="email-col-2">
#component('mail::button', ['url' => '453634', 'color' => 'light'])
btn1
#endcomponent
</div>
<div class="email-col-2">
#component('mail::button', ['url' => '123', 'color' => 'green'])
bnt2
#endcomponent
</div>
</div>
#endcomponent
When passing a variable to a blade template, use a single quote ( ' ) instead of a double quote ( " ).
$btn_style = " color: #FFF; border: 1px solid #FEFEFE; padding: 5px 30px;";
$buttons = '<span style="text-align: center; width: 100%; display: inline-block;">
Accept
Decline
</span>';
To render this code:
Edit your App\Mail
$this
->subject('Subject')
->markdown('emails.tempalte')
->with([
'buttons' => $buttons,
]);
Blade Template view\emails:
{!! $buttons !!}
Hope this helps.
you can put it in one <div>
For example:
<div class = "row>
your buttons here
</div>
If it doesn't help please share your code
Try this:
<span style="display: inline;">
#component('mail::button', ['url' => 'http://phuketjettour.com/', 'color' => 'green'])
Phuket Jet Tour
#endcomponent
#component('mail::button', ['url' => 'http://phuketjettour.com/s/vendors'])
Vendor submission
#endcomponent
</span>
It's just a work around. I've inspect the email from a laravel project.
try this in place of your component for button :
Phuket Jet Tour
SAMPLE !
it inlines your button. then just adjust other element. If you want to put the button on the markdown then you do like:
On your markdown:
$button1= " Phuket Jet Tour";
$button2 = "SAMPLE !";
$emailMarkdown = $this->markdown('your_email_template')
->subject('your_subject)
//you will define here the variables you need to pass in the template
->with([
'emailBody' => $emailBody,
'button_first' => $button1,
'button_second' => $button2,
]);
return $emailMarkdown;
then on the email template:
#component('mail::message')
Dear {{$vendor_name}}
Product {{$product_id}} : {{$product_name}} price id : {{$price_id}} will expire on {{$date_expire}}.
Please renew price.
{!!$button_first!!} {!!$button_second!!}
#endcomponent
To fix the issue, just place this code in email blade file:
<div style="text-align: center">
Cancel
Reschedule
Confirm
</div>

How to call an on click action for button in Laravel 5?

Below is my submit button code.
{!! Form::submit('Update', array('class'=>'btn btn-primary','style'=>'width: 200px')) !!}
I want to change that by adding onclick event as below.
onclick="if( ! confirm('Are you sure you want to delete?')){return false;}">
How to code that in laravel?
If you're not using the jQuery then you can add it to array like:
{!! Form::submit('Update', array(
'class' => 'btn btn-primary',
'style' => 'width: 200px',
'onclick' => "if( ! confirm('Are you sure you want to delete?')){return false;}"
)) !!}

Putting image as submit button Laravel

I can't seem to find a way to put image as submit button in blade, is there a way to do this?
{!! Form::submit('Search', array('class'=>'btn')) !!}
Form::input should do the trick:
{!! Form::input('image', 'Search', array('class'=>'btn', 'src' => '...')) !!}
You can create the submit with pure html instead of laravelcollective like that
<input type="image" src="sourse for image" width="48" height="48" alt="Submit" />
For Laravel Collective version 6.2 the solution This small example shows the sending of a variable by means of a button with an image (src='../path/to/file) using the 'submit' passing as parameters the dimensions of the button (30,30).
Note: var_to_send can have a string like $ansver - > 'Hello World' or another value and it will pass it from the controller and it will print it.
// new.blade.php
{!! Form::open([ 'action'=> 'StorageController#save', 'method' => 'POST', 'files' => true]) !!}
{!! Form::hidden('var_to_send', $answer) !!}
{!! Form::image(url('../img/A.png'), 'submit', ['width' => '30', 'height' => '30']) !!}
{!! Form::close() !!}
// StorageController.php
class StorageController extends Controller
{
public function save(Request $request)
{
return $request->input('var_to_send');
}
}
// route wep.php
Route::post('storage/create', 'StorageController#save');

Resources