建立一个实体类：

public class Fruit {

    int id;

    String name;

    public Fruit() {

    }

    public Fruit(int id, String name) {

        this.id = id;

        this.name = name;

    }

   //省略get和set方法

}

　

建立一个控制类：

package org.project.controller;

import org.springframework.stereotype.Controller;

import org.springframework.ui.Model;

import org.springframework.web.bind.annotation.RequestMapping;

import java.util.ArrayList;

import java.util.List;

@Controller

public class FruitController {

    @RequestMapping("/fruit")

    public String fruit(Model model){

        return "fruit";

    }

    @RequestMapping("/fruit/detail")

    public String detail(Model model,int id) {

        List<Fruit> fruits = new ArrayList<>();

        if(id == 0) {

           String[] strings={"香蕉","苹果","凤梨","西瓜"};

           for(int i = 1; i <= strings.length; i++) {

               fruits.add(new Fruit(i,strings[i-1]));

           }

        } else if(id == 1) {

            String[] strings={"菠萝","草莓","西红柿","黑莓","百香果","葡萄"};

            for(int i = 1; i <= strings.length; i++) {

                fruits.add(new Fruit(i,strings[i-1]));

            }

        }

        model.addAttribute("fruits",fruits);

        return "fruit::fruit-list";

    }

}

　　

前端代码：

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="UTF-8">

    <title>Thyleaf</title>

    <script type="text/javascript" src="/lib/jquery/1.9.1/jquery.min.js"></script>

    <script>

        function ceshi1() {

            $('#fruit-list').load("/fruit/detail?id=0");

        }

        function ceshi2() {

            $('#fruit-list').load("/fruit/detail?id=1");

        }

    </script>

</head>

<body>

    <button onclick="ceshi1()">测试1</button>

    <button onclick="ceshi2()">测试2</button>

    <div id="fruit-list" style="text-align: center;margin:0 auto;width: 900px" th:fragment="fruit-list">

        <table width="100%" border="1" cellspacing="1" cellpadding="0">

            <thead>

                <th>ID</th>

                <th>水果名</th>

            </thead>

            <tbody>

                <tr th:each="fruit : ${fruits}">

                    <td th:text="${fruit.id}"></td>

                    <td th:text="${fruit.name}"></td>

                </tr>

            </tbody>

        </table>

    </div>

</body>

</html>

　　

　效果：

SpringBoot | Thymeleaf | 局部更新的更多相关文章

  1. org.springframework.expression.spel.SpelEvaluationException: EL1004E: Method call: Method service() cannot be found on com.my.blog.springboot.thymeleaf.util.MethodTest type

    前言 本文中提到的解决方案,源码地址在:springboot-thymeleaf,希望可以帮你解决问题. 至于为什么已经写了一篇文章thymeleaf模板引擎调用java类中的方法,又多此一举的单独整 ...

  2. WebApiClient的JsonPatch局部更新

    1. 文章目的 随着WebApiClient的不断完善,越来越多开发者选择WebApiClient替换原生的HttpClient,本文将介绍使用WebApiClient来完成JsonPatch提交的新 ...

  3. springboot+thymeleaf+pageHelper带条件分页查询

    html层 <div> <a class="num"><b th:text="'共 '+ ${result.resultMap['pages ...

  4. 通过Solrj实现对索引库中数据的局部更新操作

    for (UpdateIndexDTO updateIndexDTO : data) { // 局部更新 SolrInputDocument doc = new SolrInputDocument() ...

  5. springboot+thymeleaf简单使用

    关于springboot想必很多人都在使用,由于公司项目一直使用的是SpringMVC,所以自己抽空体验了一下springboot的简单使用. 环境搭建 springbooot的环境搭建可以说很灵活, ...

  6. SpringBoot thymeleaf使用方法，thymeleaf模板迭代

    SpringBoot thymeleaf使用方法,thymeleaf模板迭代 SpringBoot thymeleaf 循环List.Map ============================= ...

  7. SpringBoot thymeleaf模板页面没提示，SpringBoot thymeleaf模板插件安装

    SpringBoot thymeleaf模板插件安装 SpringBoot thymeleaf模板Html页面没提示 SpringBoot  thymeleaf模板页面没提示 SpringBoot t ...

  8. SpringBoot thymeleaf模板版本，thymeleaf模板更换版本

    SpringBoot thymeleaf模板版本 thymeleaf模板更换版本 修改thymeleaf模板版本 ================================ ©Copyright ...

  9. .Net页面局部更新的思考

    最近在修改以前做的模块,添加一个新功能.整理了下才发现重用率很低,大部分的东西还是需要重新写.功能里用到了局部更新,所有整理一下一路来实现局部更新的解决方案及改进. 我接触的项目开发大多是以Asp.n ...

随机推荐

  1. Android Weekly Notes Issue #242

    Android Weekly Issue #242 January 29th, 2017 Android Weekly Issue #242 本期内容包括: Android中常用的设计模式; 基于No ...

  2. 小程序observer函数的应用

    需求是这样的 就是构建月份的组件中,月份小于10月的时候 显示的数字都是一个位数,需要转换成两位数, 比如8月份是8 ,那就要转换为08 ,同理可得 其他低于十月份的月份也是要这样做: 打开组件的js ...

  3. linux应用之基本命令

    linux操作系统的应用层可以细分为两层:1.系统服务层(包括GUI shell.CUI shell.cron.ftp.远程登录openssh等由init调用的服务)2.系统命令和用户应用. linu ...

  4. linux系统CentOS6.5下tokudb数据库引擎的安装

    tokuDB是一个关于mysql数据引擎的开源项目,官网对其特点的描述主要有三点: 1.高压缩比,官方宣称可以达到1:12. 2.高insert性能,官方称至少比innodb高9倍. 3.可以在线添加 ...

  5. git学习笔记(上)

    1 安装 win安装 地址 安装之后自报家门 $ git config --global user.name "Your Name" $ git config --global u ...

  6. Mysql数据库的打开和关闭

    Mysql数据库的打开和关闭: 选择计算机(win7)-右键管理 在新窗口选择--服务 5 找到mysql,然后右键-启动(停止)

  7. docker 学习（五） virtualBox虚拟机安装docker

    这里计划用virtualBox虚拟机安装两个ubuntu servers, 然后用docker把spring boot项目部署上去,模拟一下分布式的微服务情况. 1:安装virtualbox,后安装U ...

  8. 十张Gif动图让你弄懂递归等概念

    图像(包括动图)是传递信息的一种高效方式,往往能增强表象.记忆与思维等方面的反应强度.所谓一图胜千言,说的就是这个道理. 今天为大家整理了十张动图GIFS,有助于认识循环.递归.二分检索等概念的具体运 ...

  9. bzoj2159

    树形dp+第二类斯特林数 又是这种形式,只不过这次不用伯努利数了 直接搞肯定不行,我们化简一下式子,考虑x^n的组合意义,是把n个物品放到x个箱子里的方案数.那么就等于这个i=1->n,sigm ...

  10. c++中stl----map

    1 map的本质 (1)关联式容器,键值对应 (2)增加和删除节点对迭代器的影响很小. (3)对于迭代器来说不可以修改键值,只能修改对应的实值. (4)map内部数据的祖居是自建一颗红黑树(或者说是平 ...