vue.js用select实现省,市,提交后,默认显示省,市信息
<select v-model="citys" name="cityVal" @change="schoolName(citys)">
<option v-for="(item,index) in city" :value="item.val" v-text="item.name" ></option>
</select>
<select v-model="schools" name="schoolVal">
<option v-for="(item,index) in school" :value="item.val" v-text="item.name" ></option>
</select>
<script>
var vue = new Vue({
el: '#body',
data: function() {
return {
city: [{
val: '',
name: '城市'
}],
citys: ,
school: [{
val: '',
name: '高校'
}],
schools: ,
schoolAjax:''
}
},
methods: {
cityName: function() {
var this_obj = this;
$.ajax({
type: "post",
url: $app+"/Clan/city",
dataType: "json",
success: function(res) {
if(res.status) {
$.each(res.info,function(k, v) {
this_obj.city.push({
name:v.ar_name,
val:v.ar_id,
})
}) } else { }
},
error: function() {
$.alert({
msg: '传输错误1'
})
}
});
},
schoolName: function(citys) {
var this_obj = this;
var data = { ar_id:citys};
$.ajax({
type: "post",
data:data,
url: $app+"/Clan/school",
dataType: "json",
success: function(res) {
this_obj.school=[{ val: '',name: '高校'}]
if(res.status) {
$.each(res.info,function(k, v) {
this_obj.school.push({
val:v.sc_id,
name:v.sc_name
})
});
this_obj.schools=this_obj.schoolAjax;
} else { },
error: function() {
$.alert({
msg: '传输错误7'
})
}
});
},
defules:function(){
var this_obj = this;
$.ajax({
type: "post",
url: $app+"/Call/team_user",
dataType: "json",
success: function(res) {
console.log(res.info);
if(res.status) { this_obj.schoolName(res.info.us_arid);
this_obj.schoolAjax=res.info.us_scid; } else { }
},
error: function() {
$.alert({
msg: '传输错误5'
})
}
});
}
}
}) vue.cityName();
vue.defules();
vue.js用select实现省,市,提交后,默认显示省,市信息的更多相关文章
- vue.js学习之 打包为生产环境后,页面为白色
vue.js学习之 打包为生产环境后,页面为白色 一:配置问题 当我们将项目打包为生产环境后,在dist文件夹下打开index.html,会发现页面为白色. 1:打开config>index.j ...
- 设置vue启动项目后默认显示的页面
通过配置路由,可以设置vue项目启动后默认显示的页面.路由的path设置为path:"/",启动项目后就会显示默认的组件页面. import Vue from 'vue' impo ...
- vue.js中 ,回车键实现登录或者提交表单!
vue的功能非常强大,但是我们作为一个后端开发人员,前端的东西不一定都弄的很明白,今天就给大家介绍一个回车提交表单的真实案例,达到回车登录的效果! @ keyup.enter 实现的效果 <in ...
- Vue.js,select中的option用ajax想循环控制值的显示 v-model可以实现但提示报错,这是为什么?
应该将v-model换成:value,因为v-model只能绑定一个值,无法绑定多个值 <select v-model="citys"> <optio ...
- jquery 纯JS设置select下拉框,并默认选中第一个
//html页面<select id="payWay" class="easyui-combobox" name="payWay" s ...
- js 页面按钮提交后 创建显示loading div 操作完成后 再隐藏或删除 进度div
预期效果: 1.点击Save按钮,创建及显示loading div框 2.Save操作完成后,再删除loading 及弹出提示结果 <html> <head> </hea ...
- vue.js中,如何把text按html格式化显示
先说方法:v-html = "你的字符串" <el-table-column type="expand" label="详情" hea ...
- form异步无刷新提交,提交后可以显示弹出框,否则弹出框会被刷新不见,使用 preventDefault
出错点:确认按钮上.加onclick事件.每次点击都会追加给form追加on监听方法.累加on方法,重复提交 suppress_exception:true 阻止异常 (百度推送 jdk) 向下按 p ...
- Vue.js 相关知识(基础)
1. Vue.js 介绍 Vue,读音 /vjuː/,类似于 view),是一套用于构建用户界面的渐进式框架(重点在于视图层). 作者:尤雨溪 注:学习 vue.js 时,一定要抛弃 jQuery 的 ...
随机推荐
- Python3基础 list enumerate 将列表的每个元素转换成 带索引值的元组
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- Python3基础 dict setdefault 根据键查找值,找不到键会添加
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- 论文笔记:Tracking by Natural Language Specification
Tracking by Natural Language Specification 2018-04-27 15:16:13 Paper: http://openaccess.thecvf.com/ ...
- (转) AdversarialNetsPapers
本文转自:https://github.com/zhangqianhui/AdversarialNetsPapers AdversarialNetsPapers The classical Pap ...
- Set和WeakSet数据结构
学习Set数据结构,注意这里不是数据类型,而是数据结构.它是ES6中新的东西,并且很有用处.Set的数据结构是以数组的形式构建的. Set的声明 let setArr = new Set(['js', ...
- 【OData】Odata能做什么?
在我看来OData就是一个实现Rest full的框架.你可以使用它对server的资源进行操作.那么它能做什么? 1. 获取资源 var context = new DefaultContainer ...
- JAVA 上传文件到linux上并解压缩
package com.inborn.inshop.controller.mkt; import java.io.*; import ch.ethz.ssh2.ChannelCondition;imp ...
- 17秋 SDN课程 第一次上机作业
第一题 拓扑: 测试连通性: 第二题 拓扑: 测试连通性: 第三题 拓扑: 测试连通性:
- HDU 4302 Holedox Eating(multiset)
http://acm.hdu.edu.cn/showproblem.php?pid=4302 题意: 在一条直线上,会有多条命令,如果是0,那么就会在x位置处出现一个蛋糕,如果是1,某人就会找到最近的 ...
- 【转】Windows Live Writer 代码插件改造
源码和插件都在后面,如果不想看我神神叨叨的可以直接到文章后面下载 一 .找插件 在使用Windows Live Writer 经常要用到插入代码的功能,根据博客园中教程,分别使用了: WindowsL ...