690 search results
Learn Symfony 6
Upgrading & What's New in Symfony 6!
…error. And second, if you're using Turbo, this is needed so that Turbo knows that your form validation failed. You get that for free just by using the new shortcut method. Next, Symfony comes with some nice and optional Docker integration for local development…
Learn JS
Symfony UX: Turbo
…Nothing magic yet. When we refresh, there's our link... a fantastically boring edit link. Thanks to Turbo Drive, clicking it feels pretty good. And with a bit more work, we could add a link back to the public show page. Heck, we could even…
…see that an Ajax call failed! So... we all know that - despite our awesomeness - errors happen. When you work with turbo frames, these errors are harder to see since everything happens in a background Ajax call. To see it, you can go to the network…
Symfony UX: Stimulus
…The 422 status code means "unprocessable entity". And it's a pretty standard status code for validation errors. As a bonus, doing this on your forms will play super nicely with Stimulus's sister technology Turbo. Oh, and by the way, in Symfony 5.3…
…any full page refresh. Quick side note about this. Our next tutorial in this series - which will be about Stimulus's sister technology "Turbo" - will show an even easier way to submit any form via Ajax. So definitely check that out. But doing this with…
Learn Symfony
30 Days with LAST Stack
…dropdowns: a little JavaScript so that when we click, this opens and closes. We're not using this at SymfonyCasts... and it doesn't play well with Turbo. At least not out of the box. We prefer to create tiny Stimulus controllers to power things…
…the response right back inside the modal. Because... of course! That's the whole point of a Turbo frame. It keeps the navigation inside itself. Before we talk about what happens on success, I want to perfect this. My second requirement for opening the modal…
…is subtle. When we redirect to the index page, Symfony renders that entire page... even though Turbo will only use the . This means that, right before we render this code, our flash container renders the flash messages... which removes them…
…done! The data-turbo-frame="modal" would load that page into the modal. But since we've done that before, let's try something different. Delete the href, change this to a button, remove the data-turbo-frame attribute... and change the yellow colors to…
…button to an a tag and set its href to the app_voyage_new route. It's a normal tag that would take us to that page. But now add data-turbo-frame="modal": Check it out. Refresh and click. Instead of changing the page…
…the bottom. Say
…how about, streamed-item_controller.js. I'll paste in the normal structure, which imports turbo, exports the controller and creates a connect() method. Before we fill this in, go over to _review.html.twig and use this. I'll break this onto multiple lines…
… That's... ya know... not what we want. But I can already see the problem: in the turbo stream, we're sending the entire _reviews.html.twig template to all users... which includes the reviews list... but also the flash message and the form. No…
… Well... that's almost disappointingly easy! Remember: we're inside of a turbo-frame... so all we need to do is add a link in the frame that navigates us to the review page... because the review page renders this frame with a fresh form…
AssetMapper: Modern JS with Zero Build System
…feature. This can also be done for third-party packages. If you look in assets/controllers.json... Turbo isn't a very good example of this, but if we said "fetch": "lazy" on any of these, they would have the same behavior that we just…
Learn Symfony 5
Symfony 5 Security: Authenticators
…form. And if you do want to get fancy and submit your login for via Ajax, you can totally do that. In fact, if you use Turbo, that happens automatically. But if you wanted to write some custom JavaScript, it's still no problem. Just…
Cosmic Coding with Symfony 7
…application, right? A site where there are zero full page refreshes. But to build one, don't we need to use a JavaScript framework like React? No! We're going to transform our app into a single page application in... about 3 minutes with Turbo.
Symfony Forms: The Basics
…also happens via Turbo, and form errors still work perfectly. On the parts list, if you go to "Create new part" and try to send the empty form... Yep, that's an AJAX request and we still see the expected validation errors. Turbo makes our…
Upgrading & What's in Symfony 7
…It's happy! In the main tab, run: git status Alongside the usual suspects, there's a new controller in controllers.json... which came from an update to ux-turbo. We won't use it, but it's fine there. In package.json, it added…
…for example in _flashes.html.twig, is to add a data-turbo-temporary attribute: That tells Turbo to remove this element before it takes the snapshot. Let's try adding this to our dialog so it's not in the snapshot. To see what happens…
Whoops, an error! Please, try again later.