elliotk

Experience

11,410

0 Best Reply Awards

  • Member Since 9 Months Ago
  • 107 Lessons Completed
  • 0 Favorites

24th November, 2017

elliotk started a new conversation Help Submitting Form • 8 hours ago

Hello,

I am working on some new concepts using a modal form in Bootstrap 4.

I have the modal form popping up, and data being passed through no problem. I am just having trouble submitting the form.

I have a table of tags, to output them, I loop through each one and create a new row in the table. At the end of the table, there are buttons to edit and delete. To delete, I'd like the modal pop up to confirm.

            <table class="table table-striped table-responsive" data-toggle="dataTable" data-form="deleteForm">>
                <thead class="thead-dark">
                    <tr>
                        <th scope="col">Tag ID</th>
                        <th scope="col">Name</th>
                        <th scope="col">Slug</th>
                        <th scope="col">Actions</th>
                        <th scope="col"></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($tags as $tag)
                    <tr>
                        <th scope="row">{{ $tag->id }}</td>
                            <td>{{ $tag->name }}</td>
                            <td>{{ $tag->slug }}</td>
                            <td>
                                <a href="/admin/tags/{{ $tag->slug }}/edit">
                                    <button type="button" class="btn btn-sm btn-primary">
                                        Edit
                                    </button>
                                </a>
                            </td>
                            <td>
                                <form action="/admin/tags/{{ $tag->slug }}" method="POST" class="form-delete">
                                    {{ csrf_field() }}
                                    {{ method_field('DELETE') }}
                                    <button id="delete-button" type="button" class="btn btn-sm btn-danager" data-toggle="modal" data-act="{{ $tag->name }}" data-target="#exampleModal">
                                        Delete
                                    </button>
                                </form>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>

That's the table, you'll see on the button for delete, it has a data-act property which is the tag name, which gets passed to the modal.

Here's the modal

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Confirm Deletion</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        PLACEHOLDER
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
        <button type="button" class="btn btn-danger" name="delete-confirm" id="delete-confirm">Delete</button>
      </div>
    </div>
  </div>
</div>

Here, we have a "delete-confirm" button.

I then have some JavaScript which listens for the modal opening, and set's the text on the modal itself. This is working fine.

 <script>
  $('#exampleModal').on('show.bs.modal', function (event) {
    var button=$(event.relatedTarget) // get the button
    var modal = $(this) // get the modal form
    modal.find('.modal-body').text('Are you sure you want to delete ' + button.data('tar')) // set the modal body text to include button data

    $('#exampleModal').modal({ backdrop: 'static', keyboard: false })
    .on('click', '#delete-confirm', function(){ // when the delete button is clicked on the modal
        $button.parentElement.submit(); // submit the form - attempt 1
        $button.form.submit(); // submit the form - attempt 2
    });
})
</script>

I am then trying to take the $button go up to the parent form and submit it.

I can't do something like

$('form#myForm').submit();

because, 1. I don't name the form or give it an ID, and 2. each tag I output get's it's own form, and they would have the same name. Hence the above.

Looking for some advice or guidance, any help appreciated.

Thanks

19th November, 2017

elliotk left a reply on Creating 2 Columns Of Data From Object • 5 days ago

Thanks @tykus that's just what I needed.

elliotk started a new conversation Creating 2 Columns Of Data From Object • 5 days ago

Hello,

I have an object of tags in my blade view, which I'd like to output in 2 columns instead of 1.

I'm not sure how to split my object in 2 so that I can run 2 foreach loops as below. I pass just "$tags" to my blade view.

            <div class="col-lg-6">
              <ul class="list-unstyled mb-0">
                @foreach ($tagsFirstHalf as $tag)
                <li>
                  <a href="#">$tag->name</a>
                </li>
                @endforeach
              </ul>
            </div>
            <div class="col-lg-6">
              <ul class="list-unstyled mb-0">
                @foreach ($tagsSecondHalf as $tag)
                <li>
                  <a href="#">$tag->name</a>
                </li>
                @endforeach
              </ul>
            </div>

18th November, 2017

elliotk started a new conversation Storing API Keys And Secrets In Database • 6 days ago

Hello Everyone,

I'm building an application which will allow users some control over integrations for services such as email sending.

I plan to allow the user to pick between Sparkpost, Mailgun or SES for example.

The user would then input their API Key and Secret, and the application would then use that service to send mail.

I'd like to store those credentials in the database so they can be configured without my intervention. I had in mind to use Laravel's Encrypter / Decrypter.

        $mailService->fill([
        'service' => 'mailgun',
        'domain' => domain,
            'secret' => encrypt($request->secret)
        ])->save();

Are there any best practices around this? Good idea? Bad idea?

31st October, 2017

elliotk left a reply on Help With Git Conflict / Laravel Forge • 3 weeks ago

Thanks @mushood how would I go about doing that? The "Themes" directory is just a folder, of folders, there are no files in it.

30th October, 2017

elliotk started a new conversation Help With Git Conflict / Laravel Forge • 3 weeks ago

Hello,

I need some help.

I am using a package shipu/themevel

It creates themes in a "Themes" root directory, with a sub directory of "themename".

Themes/theme1
Themes/theme2

When i commit my first theme, all works as expected.

After a second or third, when I deploy in Forge, I'm getting the following error:

Mon Oct 30 20:43:41 UTC 2017
From bitbucket.org:user/blog
 * branch            master     -> FETCH_HEAD
   a4e1f26..31bf12c  master     -> origin/master
error: The following untracked working tree files would be overwritten by merge:
    public/Themes
Please move or remove them before you can merge.
Aborting
Updating a4e1f26..31bf12c

On closer inspection, the timestamp on the Themes folder is being updated every-time a new theme is created.

It's using the Laravel File System to do this:

https://laravel.com/docs/5.5/filesystem#directories

Storage::makeDirectory($directory);

A full path name is being passed: /Users/elliot/Code/blog/Themes/theme2

I presume it must be something to do with that, but i've got no idea how to either rewrite the creation of the final directory, or stopping git throwing an error in Laravel Forge.

Any advice?

28th October, 2017

elliotk started a new conversation Help With Design Principle • 3 weeks ago

Hello,

I need some help please. I've been learning Laravel so am very familiar with Models and Controllers.

I now have a need to store some site configuration settings in the database for an admin to be able to edit - site name for example.

Following the principle of controllers with methods such as index and view, it feel's they are more closely linked to the UI side. So on the front end i'd use the SiteSettingsController to build some kind of admin panel to show all site settings, edit them, delete them, update them etc.

I'm now wondering where is the best place to store the logic to getAllSettings or getSettingbyKey. I've currently got that in my model, but is that right?

''' public static function getAllSettings() { $siteSettings = \App\SiteSettings::all()->pluck(['key', 'value']); return $siteSettings; } '''

In my AppServiceProvider.php boot method I am doing the following

       
            $siteSettings = \Cache::rememberForever('siteSettings', function () {
                return \App\SiteSettings::getAllSettings();
            });

            $view->with('siteSettings', $siteSettings);
        });

However, I'm not sure if putting this behaviour in the model is correct. If i'm going to have getters and setters, where do you create that logic?

Thanks

23rd October, 2017

elliotk left a reply on Laravel Mix With Shipu/themevel • 1 month ago

So i've done a bit more work on this, hope it helps others.

What I really wanted to use was

<link rel="stylesheet" href="{{ mix(themes('css/app.css')) }}">

However, I have found that themes() returns a fully qualified link to the css file inc domain, and as mix prefixes a / you end up with "/http://domain.com/css/app.css" which obviously won't load.

In my webpack.mix.js I have the following

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

mix.sass('Themes/cerulean/assets/css/app.scss', 'Themes/cerulean/assets/css');
mix.sass('Themes/cosmo/assets/css/app.scss', 'Themes/cosmo/assets/css');
mix.sass('Themes/cyborg/assets/css/app.scss', 'Themes/cyborg/assets/css');

Then, in my layout blade, I've used the below.

<link href="{{ mix('/Themes/'.Theme::current().'/assets/css/app.css') }}" rel="stylesheet">

Like I said, hope others find it helpful to get up and running.

Cheers

22nd October, 2017

elliotk started a new conversation Laravel Mix With Shipu/themevel • 1 month ago

Is anyone using @shipu package Shipu/themevel alongside Laravel Mix? Would anyone mind giving me a few code pointers?

Thanks

12th August, 2017

elliotk left a reply on Best Practice For Controllers • 3 months ago

Thank you for your responses, very interesting.

I've decided to go for extra controllers and nest them inside an admin folder.

11th August, 2017

elliotk started a new conversation Best Practice For Controllers • 3 months ago

Hello,

I am looking for some best practice advice as I continue to learn Laravel.

I have a Post model and a PostController with index() and show() methods to display posts to the users on the front end.

I am now building an admin back end panel to manage the blog.

Within the admin panel, I have a table of posts that the administrator can see. They can add a new post and also click edit / delete which call the usual methods: edit(), update(), store(), create() and destroy().

To get the admin view, I've added an adminIndex() method, which returns the posts to the relevant admin view, which is a different view to what the users will see.

My question is, is that right? What do others do? Watching the videos here, I am really trying to stick with the standard controller methods.

To that end, I thought of the following options

  1. Create a new method on the existing controller (that's what I have done with adminIndex()).
  2. Create a second controller AdminPostController and then use the same Post model and then I can stick with the normal method names. Is it ok to have 2 different controllers use the same model?
  3. Create an AdminController for managing Posts, Users etc, but this again would stray away from using the standard methods.

Would really appreciate others thoughts here.

Thanks

Elliot

10th August, 2017

elliotk left a reply on Editing A Pivot Table Relationship • 3 months ago

Thanks @ashbakernz that was really helpful.

elliotk started a new conversation Editing A Pivot Table Relationship • 3 months ago

Hello everyone,

Working my way through tutorials and the forum building myself a basic blog application as I learn the framework.

I have a Post model and a Tag model. I can create Posts and associate them with many Tags.

I am now looking at how to edit existing posts, which is fine, apart from the tags.

In my edit function on my Posts Controller, I grab the post, and then all available tags. I then pass these to my view.

    public function edit(Post $post)
    {
        $tags = Tag::orderBy('name', 'asc')->get();
        return view('admin.posts.edit', compact('post', 'tags'));
    }

Question 1. I'm not sure how to eager load the existing tags on the post when using route model binding. My Post model does have a tags() method. I'd then pass this all to the view.

Putting that aside, when I get to the view, it's getting really ugly and in fact isn't working. I presume that I am now loading the tags by doing the @foreach ($post->tags as $postTag)?

                <select id="tag[]" multiple="multiple" class="form-control" name="tag[]">
                    @foreach ($tags as $tag)
                        <?php $selected = null; ?>
                        @foreach ($post->tags as $postTag)
                            @if ($tag == $postTag)
                                <?php $selected = 'selected="selected"'; ?>
                            @endif
                        @endforeach
                        <option value="{{ $tag->id }}" {{ $selected }}>{{ $tag->name }}</option>
                    @endforeach
                </select>

I go through all the tags, and check if the tag matches one of the tags already associated with the post to set it as selected.

Question 2. There must be a cleaner way of doing this?

Would appreciate any help and pointers.

Thanks

8th August, 2017

elliotk left a reply on How To Save Pivot Table Data • 3 months ago

Thanks @goatshark that was exactly what I needed. My request('tag') was already an array.

I've updated my code as follows and it worked perfectly.

        $post = Post::create ([
            'title' => request('title'),
            'user_id' => auth()->id(),
            'slug' => request('slug'),
            'body' => request('body')
        ]);

        $post->tags()->sync(request('tag'));

elliotk started a new conversation How To Save Pivot Table Data • 3 months ago

Hello,

I'm still learning Laravel, I am working through building a basic blog. I have the concept of tags for blog posts, which is a many to many relationship through a pivot table, I am now adding this to the UI.

I can receive an array of tags in to my store method on my controller, but I am not sure how to save that to the database.

I do some validation, and then call Post::create

My tags are in their own Tag model.

Would someone mind giving me a pointer on the bast way to save an array from request('tag');?

       Post::create ([
            'title' => request('title'),
            'user_id' => auth()->id(),
            'slug' => request('slug'),
            'body' => request('body')
        ]);

Thanks

Elliot

14th May, 2017

elliotk left a reply on API Working In Local, But 405 In Production • 6 months ago

All sorted.

Had to edit: /etc/nginx/webapps.hostname.conf

I've added PATCH and DELETE and it now works as expected.

if ($request_method !~ ^(GET|HEAD|POST|PATCH|DELETE)$ ) {
                return 444;
        }

Thanks for all your help.

elliotk left a reply on API Working In Local, But 405 In Production • 6 months ago

I wasn't really keen on installing the module, I see there are a lot of security concerns around that module. Instead, I have installed nginx.

Just got that up and running, hoping for no errors, but unfortunately, it's a new error now.

app.js:655 PATCH http://fastfrag.co.uk/replies/2 net::ERR_EMPTY_RESPONSE
app.js:717 Uncaught (in promise) Error: Network Error
    at createError (app.js:717)
    at XMLHttpRequest.handleError (app.js:567)

elliotk left a reply on API Working In Local, But 405 In Production • 6 months ago

Thanks Tim, appreciate your help.

So, looking in my routes, i think it looks good. And as I said in my original post, it does work fine using valet on my local machine.

Route::delete('/replies/{reply}', '[email protected]'); Route::patch('/replies/{reply}', '[email protected]');

How would I check what endpoint my Javascript is connected to?

In my Reply.vue file, I am calling destroy as follows

`destroy () { axios.delete('/replies/' + this.attributes.id);

            $(this.$el).fadeOut(300, () => {
                flash('Reply has been updated!');
            });
        }`

and for update

`update () { axios.patch('/replies/' + this.attributes.id, { body: this.body });

            this.editing = false;
            flash('Reply has been updated!');
        },`

13th May, 2017

elliotk left a reply on API Working In Local, But 405 In Production • 6 months ago

It's a good point, I wouldn't have it on normally, I just set debugging on to try and get some more details on what the issue is.

The UI might remove them / edit them, but if you refresh the page, you should see the changes don't apply and it reverts back to what it was before. That's the issue.

In chrome console I see the error throwing, hopefully you can see that too?

I'm not really sure how to debug further though.

elliotk started a new conversation API Working In Local, But 405 In Production • 6 months ago

Hello All,

I have been working through the forum series on here, and I have implemented the Vue delete and update on the forum reply section. In valet, it's working fine, but on my "production server" i get 405.

Please feel free to try it yourself....

http://www.fastfrag.co.uk

I get the following in the console.

app.js:717 Uncaught (in promise) Error: Request failed with status code 405 at createError (app.js:717) at settle (app.js:1270) at XMLHttpRequest.handleLoad (app.js:557)

Anyone come across this?

11th March, 2017

elliotk started a new conversation Using Bootswatch With Laravel 5.4 • 8 months ago

I thought I'd share how simple it is to use Bootswatch in Larvel 5.4 with this simple guide.

Create a fresh Laravel install.

laravel new mynewproject

Then, install the Bootswatch dependancies via npm.

npm install bootswatch

Following this, edit your resources/assets/saas/app.scss


// Fonts
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);

// Variables
// @import "variables"; - Default variables included with laravel no longer required

// Bootswatch Variables for your chosen theme
@import "node_modules/bootswatch/flatly/variables";

// Bootstrap
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

// Bootswatch theme main CSS files
@import "node_modules/bootswatch/flatly/bootswatch";

Install your npm dependancies

npm install

Finally, compile your saas.

npm run dev

You should then be using your chosen Bootswatch theme, in this case "flatly"

26th February, 2017

Edit Your Profile
Update

Want to change your profile photo? We pull from gravatar.com.