zoukankan      html  css  js  c++  java
  • springboot中使用分页,文件上传,jquery的具体步骤(持续更新)

    分页

      pom.xml     加依赖 

    <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper-spring-boot-starter</artifactId>
            <version>1.1.2</version>
     </dependency>
      Service 里方法中
    public PageInfo<User> findAll(int page,int size) {
            PageHelper.startPage(page,size);
            //源代码不变
            PageInfo<User> model=new PageInfo<>(集合);
            return model;
    }

      applicattion.yml中

    #pagehelper分页插件
    pagehelper:
        helperDialect: mysql
        reasonable: true
        supportMethodsArguments: true
        params: count=countSql

     文件上传

        pom.xml中加依赖
    <dependency>
                <groupId>com.github.tobato</groupId>
                <artifactId>fastdfs-client</artifactId>
                <version>1.25.2-RELEASE</version>
    </dependency>

        总配置application.properties

    #fastdfs2
    fdfs.soTimeout=1500
    fdfs.connectTimeout=600
    fdfs.thumbImage.width=150
    fdfs.thumbImage.height=150
    fdfs.trackerList[0]=192.168.25.133:22122 #默认是22122的端口
    fdfs.prefixpath= http://192.168.25.133/  #这是文件管理服务器ip

         Controller中

    @CrossOrigin(origins = "*", maxAge = 360)//设置上传最大值
    @Controller
    public class userAction {
      @Value("${fdfs.prefixpath}")
    private String prefixpath;


      //
    图片上传 @RequestMapping("/upload") @ResponseBody public Map<String,Object> upload(MultipartFile file) throws Exception { String exname = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".") + 1); StorePath storePath = storageClient.uploadFile(file.getInputStream(), file.getSize(), exname, null); String url = prefixpath + storePath.getFullPath(); System.out.println(url); Map<String,Object> map=new HashMap<>(); map.put("urls",url); System.out.println("----"+map.get("urls")); return map; }

        html页面中

    <body>
    
        <form action="addUser" method="post">
            <input type="hidden" id='photo' name='photo'/>
            <table>
                <tr>
                    <td>用户名</td>
                    <td><input type="text" name="uname"/></td>
                </tr>
                <tr>
                    <td>密码</td>
                    <td><input type="text" name="password"/></td>
                </tr>
                <tr>
                    <td>生日</td>
                    <td><input type="date" name="birthday"/></td>
                </tr>
                <tr>
                    <td>头像</td>
                    <td><input type='file' id='file' name='file' form="pff" />
                        <a id='yla' href='' target='_blank'><img id='ylm' src='' width="200px" height="200px"/></a>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input type="submit" value="提交"/>
                    </td>
                </tr>
            </table>
        </form>
        <form id='pff' method="post" enctype="multipart/form-data" th:action="@{upload}">
        </form>
    </body>
    
    <script type="text/javascript" src="/webjars/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="/jquery.form.min.js"></script>
    <script type="text/javascript">
        $("#file").change(function(){
            alert(this.value);
            if(this.value!=''){
                $('#pff').ajaxSubmit({
                    type:'post',
                    dataType:'json',
                    success:function(data){
                        alert(data.urls);
                            $("#yla").attr("href",data.urls);
                            $("#ylm").attr("src",data.urls);
                            $("#photo").attr("value",data.urls);
                    }
                });
            }
        })
    </script>

    jQuery

      pom.xml中加依赖

         <!--jquer-->
            <dependency>
                <groupId>org.webjars</groupId>
                <artifactId>jquery</artifactId>
                <version>2.1.4</version>
            </dependency>

      html页面,引入

    <script type="text/javascript" src="/webjars/jquery/2.1.4/jquery.min.js"></script>

      




  • 相关阅读:
    随笔2
    随笔
    关于updateElement接口
    随笔1
    本地访问正常,服务器访问乱码 记录
    Redis (error) NOAUTH Authentication required.解决方法
    tomcat启动很慢 停留在 At least one JAR was scanned for TLDs yet contained no TLDs.
    微信公众号消息回复
    微信公众号 报token验证失败
    idea中web.xml报错 Servlet should have a mapping
  • 原文地址:https://www.cnblogs.com/lwh-note/p/8984994.html
Copyright © 2011-2022 走看看