shop--6.店铺注册--js实现

Posted 2020-10-31 SkyeAngel

首先要有初始化的url，一加载此js，就执行此url，进行初始化

initUrl中的getshopinitinfo 是获取店铺分类和区域信息，进行前端的店铺分类和所属区域的下拉菜单的初始化

registerShopUrl 是进行店铺的注册，即在前面的WEB-INF/html/shop/shopoperation.html中添加的信息，通过此url返回给后台的Controller处理，进行店铺的注册

其中

 

$(function(){
    var initUrl = ‘/shopadmin/getshopinitinfo‘;
    var registerShopUrl = ‘/shopadmin/registershop‘;
    alert(initUrl);
    /*此方法是获取店铺分类和区域信息，进行前端的店铺分类和所属区域的下拉菜单的初始化*/
    getShopInitInfo();
    function getShopInitInfo(){
        $.getJSON(initUrl, function(data){
            if(data.success){
                var tempHtml = ‘‘;
                var tempAreaHtml = ‘‘;
                data.shopCategoryList.map(function(item, index){
                    tempHtml += ‘<option data-id="‘ + item.shopCategoryId + ‘">‘ + item.shopCategoryName + ‘</option>‘;
                });
                data.areaList.map(function(item, index){
                    tempAreaHtml += ‘<option data-id="‘ + item.areaId + ‘">‘ + item.areaName + ‘</option>‘;
                });
                $(‘#shop_category‘).html(tempHtml);
                $(‘#area‘).html(tempAreaHtml);
            }
        });
        $(‘#submit‘).click(function(){
           var shop = {};
           shop.shopName = $(‘#shop_name‘).val();
           shop.shopAddr = $(‘#shop_addr‘).val();
           shop.phone = $(‘#shop_phone‘).val();
           shop.shopDesc = $(‘#shop_desc‘).val();
           
           /*使用的下拉菜单来进行选择，获取值的方法*/
           shop.shopCategory = {
               shopCategoryId : $(‘#shop_category‘).find(‘option‘).not(function(){
                   return !this.selected;
               }).data(‘id‘);
           };
           shop.area = {
               areaId : $(‘#area‘).find(‘option‘).not(function(){
                   return !this.selected;
               }).data(‘id‘);
           };
           
           /*获取的是上传图片的输入流*/
           var shopImg = $(‘#shop_img‘)[0].files[0];
           //在ajax中传递的参数
           var formData = new FormData();
           //参数的内容，分别是上面的shop和shop图片
           formData.append(‘shopImg‘, shopImg);
           formData.append(‘shopStr‘, JSON.stringify(shop));
           /*使用ajax提交到后台*/
           $.ajax({
               url:registerShopUrl,
               type:‘POST‘,
               data:formData,
               contentType:false,
               processData:false,
               cache:false,
               success:function(data){
                   if(data.success){
                       $.toast(‘提交成功！‘);
                   } else{
                       $.toast(‘提交失败！‘ + data.errMsg);
                   }
               }
           })
        });
    }
})

　　

　

然后在shopoperation.html中添加js的标签

<script type=‘text/javascript‘ src=‘../resources/js/shop/shopoperation.js‘ charset=‘utf-8‘></script>