1、查看代码逻辑
controller的请求代码:
//跳转vidyoname初始化table
var name = $routeParams.name; //路由中获取到传入的name值
if(name) { //如果name变量有值
console.log("name:"+name); //打印name变量
$scope.flag = false;
$scope.vidyocallflow.vidyoname = name; //动态绑定将name变量的值赋给作用域集合中vidyoname元素
console.log("vidyocallflow.vidyoname="+$scope.vidyocallflow.vidyoname); //打印作用域集合中vidyoname元素
console.log($scope.vidyocallflow); //打印作用域集合
console.log($('#vidyoCallFlowForm')); //打印表单
btTable.searchDate('vidyoCallFlowForm','/ccao/media/vidyocallflow/query.do'); //通过bootstrap自带的请求searchDate方法将url和表单作为参数,请求到后台。
}
btTable.searchDate方法:
//formId 搜索数据的表单;为空时,传NULL
bootObject.searchDate = function(formId,url) {
console.info('url:'+url);
var searchData;
if(formId==null){
searchData=null;
}else{
searchData = $('#' + formId + '').serialize(); //通过上传的表单id获取表单中的所有值
}
var tmp = '?';
/*if(url.contain('?')|| url.contain("&")){
tmp = '';
}*/
$('#' + tableId + '').bootstrapTable('refresh', {
url : '' + url + tmp + searchData,
}) //bootstrap表格自带请求并填充表格的方法
};
2、通过日志打印,发现绑定的作用域集合vidyoname有值,且作用域集合和表单打印出来,其中的vidyoname都有值,在弹出的VidyoCallFlow页面的name的input框中也有数据填充,说明双向绑定赋值是成功的,但是在使用 btTable.searchDate方法,传入表单名和url时,查询不到结果,且发现请求到后台的url为:"url:/ccao/media/vidyocallflow/query.do?vidyoname=",参数vidyoname没有值带入,通过后台日志发现确实该请求没有参数传到后台,也说明了在使用bootstrap自带请求方法时,没有从表单中获取到vidyoname的值,因此请求没有携带该参数的值。
3、但是再次通过点击VidyoCallFlow页面的搜索按钮时,触发页面的点击事件,该事件执行的请求方法与跳转请求的方法相同,同为bootstrap自带的请求方法,但是传入后台参数有值,且查询有结果。
4、原因:在路由跳转双向绑定数据时,存在通过jquery获取不到表单中元素的值的问题,后采用jquery赋值的方法替代将双向绑定的方法:
//跳转vidyoname初始化table
var name = $routeParams.name;
if(name) {
console.log("name:"+name);
$scope.flag = false;
$('#vidyoname').val(name); //jquery赋值
btTable.searchDate('vidyoCallFlowForm','/ccao/media/vidyocallflow/query.do');
//跳转vidyoname初始化table
var name = $routeParams.name; //路由中获取到传入的name值
if(name) { //如果name变量有值
console.log("name:"+name); //打印name变量
$scope.flag = false;
$scope.vidyocallflow.vidyoname = name; //动态绑定将name变量的值赋给作用域集合中vidyoname元素
console.log("vidyocallflow.vidyoname="+$scope.vidyocallflow.vidyoname); //打印作用域集合中vidyoname元素
console.log($scope.vidyocallflow); //打印作用域集合
console.log($('#vidyoCallFlowForm')); //打印表单
btTable.searchDate('vidyoCallFlowForm','/ccao/media/vidyocallflow/query.do'); //通过bootstrap自带的请求searchDate方法将url和表单作为参数,请求到后台。
}
btTable.searchDate方法:
//formId 搜索数据的表单;为空时,传NULL
bootObject.searchDate = function(formId,url) {
console.info('url:'+url);
var searchData;
if(formId==null){
searchData=null;
}else{
searchData = $('#' + formId + '').serialize(); //通过上传的表单id获取表单中的所有值
}
var tmp = '?';
/*if(url.contain('?')|| url.contain("&")){
tmp = '';
}*/
$('#' + tableId + '').bootstrapTable('refresh', {
url : '' + url + tmp + searchData,
}) //bootstrap表格自带请求并填充表格的方法
};
2、通过日志打印,发现绑定的作用域集合vidyoname有值,且作用域集合和表单打印出来,其中的vidyoname都有值,在弹出的VidyoCallFlow页面的name的input框中也有数据填充,说明双向绑定赋值是成功的,但是在使用 btTable.searchDate方法,传入表单名和url时,查询不到结果,且发现请求到后台的url为:"url:/ccao/media/vidyocallflow/query.do?vidyoname=",参数vidyoname没有值带入,通过后台日志发现确实该请求没有参数传到后台,也说明了在使用bootstrap自带请求方法时,没有从表单中获取到vidyoname的值,因此请求没有携带该参数的值。
3、但是再次通过点击VidyoCallFlow页面的搜索按钮时,触发页面的点击事件,该事件执行的请求方法与跳转请求的方法相同,同为bootstrap自带的请求方法,但是传入后台参数有值,且查询有结果。
4、原因:在路由跳转双向绑定数据时,存在通过jquery获取不到表单中元素的值的问题,后采用jquery赋值的方法替代将双向绑定的方法:
//跳转vidyoname初始化table
var name = $routeParams.name;
if(name) {
console.log("name:"+name);
$scope.flag = false;
$('#vidyoname').val(name); //jquery赋值
btTable.searchDate('vidyoCallFlowForm','/ccao/media/vidyocallflow/query.do');
}
5、查询成功,跳转获取到页面查询结果。
5、查询成功,跳转获取到页面查询结果。