How to send information from the vue.js file to the controller like an id? Laravel - Inertia-vue

Question

I'm trying to open a page from a button, but I need to send the id of the item where the button is in. For context this is a discussion forum page, in the users dash they are shown the forums they can comment on and there is a button on the bottom of each, what I need to send is that forums id, so that when they click on the button it takes them to the correct forum view.

How can I do this?

I'm trying different ways

<el-button type="primary" @click="submit(f.id)">
    Answer
</el-button>

submit($id) {
    var link = 'comments/' + $id;

    this.$inertia.visit('comments/' + $id, {
        $id,
    });
},

<inertia-link class="el-button el-button--warning"
    :href="'comments/' + f.id">
        Answer
</inertia-link>

In my routes web.php

Route::resource('comments', 'ReplyController');
Route::get('comments/{id}', 'ReplyController@index');

The index in the controller

public function index($id)
{
    $forum = DiscussionForum::where('id', $id)
        ->with('comment', 'user')->first();
    $comment = Reply::with('discussionForum', 'user')
        ->where('discussion_forum_id', $forum->id)
        ->orderByDesc('updated_at')->get();

    return Inertia::render('Forum/Comment.vue', [
        'forum' => $forum,
        'comments' => $comment
    ]);
}

This is not working, the redirect shows me a blank window inside the main page? How can I send the forum id correctly?

What does the f variable output? Have a look in your developer tools in the networking tab to see if you get any 500 errors, or the like. Is APP_DEBUG set to true? — Linus Juhlin
– Linus Juhlin, Commented Nov 19, 2019 at 14:59

Luca Rossi · Accepted Answer · 2019-12-05 07:32:53Z

3

The best way to do this is to add a name to the route so:

Route::get('comments/{id}')->name('comments')->uses('ReplyController@index');

Then you can pass your id in the inertia-link in this way:

<inertia-link class="el-button el-button--warning"
    :href="route('comments', { f.id })">
        Answer
</inertia-link>

This way can be used with Ziggy as mentioned in the docs. https://inertiajs.com/routing

edited Dec 5, 2019 at 7:32

answered Nov 29, 2019 at 7:51

Luca Rossi

7761 gold badge6 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Linus Juhlin Over a year ago

This answer only works if you're using Ziggy by TightenCo(or if you have sort of other route method wired up somewhere).

Luca Rossi Over a year ago

Ziggy is suggested to use when working with Inerita. It's said also in the offical documentation

Linus Juhlin Over a year ago

Sure, I didn't dispute that. You just didn't mention that it would be needed for your answer to work.

tony19 · Accepted Answer · 2022-07-15 00:38:27Z

0

Use the emit function here: https://v2.vuejs.org/v2/guide/components-custom-events.html

Something like this:

yourMethod() {
  this.$emit(
    "someName",
    this.id
  );
}

edited Jul 15, 2022 at 0:38

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Nov 13, 2019 at 16:10

Fabi D

991 silver badge6 bronze badges

2 Comments

Nancy Over a year ago

what about the redirect?

Lux Scotty Ilustre Over a year ago

@Nancy location.reload();

Collectives™ on Stack Overflow

How to send information from the vue.js file to the controller like an id? Laravel - Inertia-vue

2 Answers 2

3 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related