laravel Twitter Bootstrap 模态和 CRUD
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14878557/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitter Bootstrap Modals and CRUD
提问by Joshua
So, I'm specifically developing my application in Laravel, but I think this question is a bit more general to any web application as it's really around the usage of bootstrap and modal pages.
所以,我专门在 Laravel 中开发我的应用程序,但我认为这个问题对任何 Web 应用程序都更普遍,因为它实际上是关于引导程序和模式页面的使用。
I'm interested in finding out how others have created CRUD functionality using the packaged bootstrap modal.
我有兴趣了解其他人如何使用打包的引导程序模式创建 CRUD 功能。
The modal seems a natural fit for all types of forms. The issue really comes around the setup. I was trying to create a contact CRUD for my application.
模态似乎自然适合所有类型的表单。问题确实与设置有关。我试图为我的应用程序创建一个联系人 CRUD。
For example, an Account may have multiple contacts, so while view the Account page I would like the user to be able create or update a contact using the same form presented via a modal.
例如,一个帐户可能有多个联系人,因此在查看帐户页面时,我希望用户能够使用通过模式呈现的相同表单创建或更新联系人。
Using only the bootstrap package you can load a modal's body with remote data, but only once. So I open contact 1 for editing, close the modal, and try to open contact 2 the only info I get is for contact 1 as it won't do a second remote load.
仅使用 bootstrap 包,您可以使用远程数据加载模态的主体,但只能加载一次。所以我打开联系人 1 进行编辑,关闭模式,并尝试打开联系人 2 我得到的唯一信息是联系人 1,因为它不会进行第二次远程加载。
This can be solved easily enough with the great info in this post Twitter bootstrap modal loads wrong remote data
这可以通过这篇文章中的重要信息轻松解决 Twitter bootstrap modal loading wrong remote data
While this solution works well, it seems like I'm breaking the framework and feels like I'm using the modal for something it wasn't intended for. Perhaps the bootstrap modal isn't the right ui element for a CRUD. So, how do others approach this?
虽然这个解决方案运作良好,但似乎我打破了框架,感觉就像我将模态用于它不适合的东西。也许引导模式不是 CRUD 的正确 ui 元素。那么,其他人是如何处理这个问题的呢?
回答by msurguy
I have done this. The way to go about that is to use jQuery AJAX calls and test for Ajax requests in Laravel application.
我已经这样做了。解决这个问题的方法是在 Laravel 应用程序中使用 jQuery AJAX 调用和测试 Ajax 请求。
Here is a nice tutorial on working with Ajax in Laravel: http://codehappy.daylerees.com/ajax-content
这是一个关于在 Laravel 中使用 Ajax 的很好的教程:http://codehappy.daylerees.com/ajax-content
To validate your forms I recommend Parsley.js, works awesome with Bootstrap : http://parsleyjs.org/
为了验证你的表单,我推荐 Parsley.js,与 Bootstrap 一起工作很棒:http://parsleyjs.org/
Also there is a great plugin written specifically for Bootstrap ajax calls, check out about how to integrate it in my forum post here: http://forums.laravel.io/viewtopic.php?pid=27900
还有一个专门为 Bootstrap ajax 调用编写的很棒的插件,请在我的论坛帖子中查看如何将其集成:http: //forums.laravel.io/viewtopic.php?pid=27900
回答by isherwood
My company used Bootstrap modals to do fairly complex form data interactions with good success. I see no reason why you can't use ajax or whatever, along with modals, to make a more seamless user experience. A modal is nothing more than a div on a floating page layer, after all.
我的公司使用 Bootstrap 模态来完成相当复杂的表单数据交互并取得了成功。我看不出为什么你不能使用 ajax 或其他任何东西,连同模态,来获得更无缝的用户体验。毕竟,模态只不过是浮动页面层上的一个 div。