I cant find a way to navigate to a new page when inertia-link is clicked when using a dynamic route in laravel.
route:
This two is not added together in the code. I tried both way to tested so i put both here
Route::get('/{clothesCategory}', 'ClothesController#getCalsas'); // this doesnt work
Route::get('/NotDynamic, 'ClothesController#getCalsas'); // this work
Html:
<inertia-link href="/NotDynamic">Not Working</inertia-link> //this only works with NotDynamic route
Working // this works with both routes
Why is this happening I dont understand the reason behind it? also how can I get the inertia-link to work with the Dynamic route?
You can simply follow this example:
<inertia-link :href="'/' + data.slug">Go To</inertia-link>
use the ":" (colon symbol) before "href". Then you can insert dynamic value into the link.
Found how to do this using :headers
<inertia-link href="/endpoint" :headers="{ clothesCategory: endpoint}">end point</inertia-link>
Related
I'm working on a dotnet 6 mvc application using RazorPages, and I'm having a problem with strange routing behavior.
I have a RazorPage /Pages/News.cshtml
This page is accessible using the default route /news
When called without any parameters this page will display an index of news articles.
I also want this page to be able to display a specific news article, via a path like this...
/news/1234-my-news-article
To achieve this, I've added a config like so...
builder.Services.AddRazorPages(options =>
{
options.Conventions.AddPageRoute("/News", "News/{id:regex(^\\d+\\-.*)?}");
});
In my templates, I can then use links like this...
<a asp-page="/News" asp-all-route-data="#(new Dictionary<string, string> { { "id", "1234-my-news-article" } })">My News Article</a>
or
<a asp-page="/News">All Articles</a>
However, once I've navigated to a specific article, the index link doesn't render correctly, and will instead link again to the same article. It appears to be re-using the current routing parameters.
Is there some way to avoid this?
update:
I've found a work-around, if I use this tag instead...
<a asp-page="/News" asp-route-id="">All Articles</a>
then it will link correctly to "/news".
It seems a bit counter-intuitive to have to explicitly set this to blank. I would have assumed it would default to unset, unless explicitly set otherwise.
This is known as ambient route values (https://www.learnrazorpages.com/razor-pages/tag-helpers/anchor-tag-helper#ambient-route-values), where the current route values are automatically added to outbound links which are generated by the anchor tag helper if the destination page is the same as the current page. In older versions of Razor Pages, this was the default behaviour for all pages.
As you have discovered, you can override this by setting the route value to an empty string, or as suggested elsewhere, to use a plain anchor tag for your link.
asp-page tag helper will add id value to the route by default.It is by design.If you don't want to add it,you can try to use href to replace asp-page:
All Articles
This is an extension from a post I made a few days ago: Change a page without refreshing - Laravel / Ajax
Basically, I'm trying to replicate the URL Structure of Soundcloud where you can click on a link, it'll load the content without refreshing the page however if you land directly on that page, it won't replicate design and effecitvely break.
I've been thinking of ways on how I can check in Laravel if the page is requested via Ajax or has been landed on without an Ajax call.
What's happening at the moment is that when I call the page, the view has a master template that's extended thus creating duplicate master templates on the one view.
I was thinking if I done something like
#if(!Request::ajax())
#extends('masterlayout')
#endif
It would work but tried and no luck.
Any help as always is greatly appreciated!
Thanks
Looks like #extends directive is always executed even in falsy if
You can add an empty layout and perform check like this:
#extends(Request::ajax()? 'layouts.empty' : 'layouts.master')
and you need add only this in layout empty.blade.php:
#yield('content')
or you can add ajax check in the master layout
#if(!Request::ajax())
// all layout code
#else
#yield('content')
#endif
You can check that in your controller action.
public function index(Request $request)
{
if($request->ajax()){
return "This is an AJAX call!";
}
return "Not an AJAX call...";
}
Thanks for all the answers, I eventually got this fixed by using #if(!Request::ajax()) on section that didn't need to be shown when the page was loaded via ajax.
Thank you again! :D
I would like to show the content instead of the url in my view. How can I use Laravel to make this work?
At the moment, in my Laravel view I have:
Link
<p>{!! route('plaats.text', ['plaats' => $plaatsje]) !!}</p>
<p>{!! action('TablesController#text', ['plaats' => $plaatsje]) !!}</p>
The first creates a link with a working active url, the second and third a death link: "http://mysecondsite.dev/koop/text/plaats/capelle-aan-den-ijssel".
Following the link itself (in all cases) returns the expected content of the url (So, my routing seems to be ok). But neither returns the underlying content.
regards
Peter
I think what you are looking for is blade service injection
It's bad practice to inject logic into views.
What you probably should do is do the operations before the view, and then pass the results (contents) to the view and echo them
I am trying to create posts with comments with CodeIgniter and I am trying to add voting for the comments with + and -.
But my problem is not actually this functionallity but more exactly creating the link and the method in controller/model for this.
I understand that there is some kind of link to methods.
If I have something like this:
public function like() {
echo 'Test Function';
}
and when I create link like this one sitename.com/posts/first-post/like theoritecally I will see blank page with "Test Function" text (and of course if I write proper routing rule but I cannor for now).
I can see a blank page with this working echo 'Test Function', but does this mean I have to load every methods and views for the entire page if I want to display the entire webpage with all the elements? I think that I mistake something very serious here but I don't know what.
The example with the "Create news" tutorial in ellislab.com didnt help me. They show something similar I think with /create/ section in the URL and create() methods.
If I have many links with functionallities do I have to add new routing rules for all of them? I really tried to search in Google and everywhere but I didnt find anything related.
Sorry for this lame question.
You need to use Ajax call and on callback you have to increase or decrease the count. For creating a link , once page is loading render the data and provided the default link like
for + http://<site.com>/<controller>/like?totalLike=<36>
for - http://<site.com>/<controller>/unlike?totalunLike=<3>
Once user will click + link then by using Ajax, call the controller method link/unlike and increase or decrease the count and repopulate the link again with fresh counter.
Hope it will resolve your problem.
When Meteor sends the email with the link to validate the account, the link looks like this:
"//localhost:3000/#/verify-email/jOCevGxWbWQfcGL7KAtQ"
If you click on the link it validates the account as a charm, but it sends the user to the 'ROOT' template.
I want to change this route. Clicking on the validation link have to route the user to another page, another then root route ('/').
I have tryied changing the link adding a new template:
"//localhost:3000/template/#/verify-email/jOCevGxWbWQfcGL7KAtQ"
... and it works partially.
It verifies the account perfectly and routes the user to the right template... but this solution breaks all the images in this "template".
What should I do?
Sounds like you got it, but I'll drop another option. To change the URL you can do something like:
Accounts.urls.verifyEmail = function (token) {
return Meteor.absoluteUrl('verify-email/'+token);
};
And even better, you can eliminate that horribly long link by changing the email html:
Accounts.emailTemplates.verifyEmail.html = function(user, url) {
var prettyEmail = "Click Me!";
return prettyEmail;
};
Make sure your images are referenced correctly. If your image is referenced using relative paths use an absolute path instead:
i.e
<img src="image.jpg"/>
<img src="images/image.jpg"/>
should be
<img src="/image.jpg"/>
<img src="/images/image.jpg"/>
Ok, here's what I have done.
I've stopped concatenating the url and made a dynamic link within the rendered function to route the app to the page I want in the moment of the e-mail link validation.
Thanks Askhat your answer was right on the spot, because the images src need the "/" to work as well.