Semantic-UI选项卡式布局中的laravel视图

我有一个非常基本的AJAX问题。 我希望使用带有AJAX加载内容的标签式布局。

http://semantic-ui.com/modules/tab.html#/examples

请参阅“ 重新访问远程内容”部分。

我的问题：我不知道如何替换模型AJAX

mockResponse : function(settings) { var response = { first : 'AJAX Tab One', second : 'AJAX Tab Two', third : 'AJAX Tab Three' }; 

在我的控制器中定义的视图。

我可以请别人给我看一个有效的例子。

先感谢您。

Answer 1

您可以在js中使用语义UI“ api设置 ”。

标签按钮;

 
 Gallery Youtube Videos  

标签内容;

标签的API设置;

 $.fn.api.settings.api = { // laravel route or url 'get gallery' : '{!! url('gallery/images') !!}}', 'get youtube' : '{!! route('youtube.videos') !!}}' }; 

然后为选项卡按钮添加以下代码

 $('#gallery_tab').api({ action: 'get gallery', method : 'GET', dataType: 'html', stateContext : '#gallery_tab_content', data: { // if you want to send url data via POST/GET method }, onSuccess: function(response) { // load response content in "gallery_tab_content" $('#gallery_tab_content').html(response); }, }); $('#youtube_tab').api({ action: 'get youtube', method : 'GET', dataType: 'html', stateContext : '#youtube_tab_content', ... ...