首先要有初始化的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>
shop--6.店铺注册--js实现
原文地址:https://www.cnblogs.com/SkyeAngel/p/8880861.html