js乱码问题,easyui datagrid 向另一个页面传值

         今天碰到js问题比较头疼,但是后面还是解决了,在此分享。

首先我从a页面的datagrid 中获取数据,想要放入b页面的form表单中。

由于,我已经从a页面中获取到表格的值,所以不想通过ajax去实现向b页面的传值,于是就碰到了问题。

我无法将a页面的数据放入b页面中,确切说是不知道怎么做,后面在总监的帮助下,知道了通过url的get传值将参数放入b页面中,

然后需要对b页面进行操作,在b页面onload时将参数取出,去填充form表单。

<script>
var param1var = getQueryVariable("param1");


function getQueryVariable(variable) {
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  } 
  alert('Query Variable ' + variable + ' not found');
}
</script> 这段可以把url中的参数取出,本人亲测。

然后就是js乱码的问题,我碰到的主要是对url取数据的乱码,所以在此说下decodeURI,当从url中取出参数时出现乱码就可以

var param1 = decodeURI(param); 

解决乱码问题,至于encodeURL是参数传入URL遇到的问题,网上有很多,再次不做说明。

但是我们要注意encodeURL和decodeURL的用法,如果是对整个URL进行解码(可以对?后面的url解码),将会导致uRL错误,这点大家可以通过console.log 

进行验证,注意验证的 console.log(window.location.search);

然后就是encode会使"="和“and”消失,decode会使“?”消失,同时要注意不能使用location这种关键字。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是一个EasyUI datagrid editor选择年的例子: HTML代码: ``` <table id="dg" title="用户列表" class="easyui-datagrid" style="width:700px;height:250px" url="get_users.php" toolbar="#toolbar" rownumbers="true" pagination="true" singleSelect="true" fitColumns="true" data-options="onDblClickRow:onDblClickRow"> <thead> <tr> <th field="id" width="50">ID</th> <th field="name" width="100">姓名</th> <th field="age" width="50">年龄</th> <th field="gender" width="50">性别</th> <th field="birthday" width="100" editor="{type:'datebox',options:{required:true}}">生日</th> </tr> </thead> </table> <div id="toolbar"> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">添加用户</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">编辑用户</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">删除用户</a> </div> <div id="dlg" class="easyui-dialog" style="width:400px;height:280px;padding:10px 20px" closed="true" buttons="#dlg-buttons"> <div class="ftitle">用户信息</div> <form id="fm" method="post" novalidate> <div class="fitem"> <label>姓名:</label> <input name="name" class="easyui-validatebox" required="true"> </div> <div class="fitem"> <label>年龄:</label> <input name="age" class="easyui-numberbox" required="true"> </div> <div class="fitem"> <label>性别:</label> <select name="gender" class="easyui-combobox" required="true"> <option value="男">男</option> <option value="女">女</option> </select> </div> <div class="fitem"> <label>生日:</label> <input name="birthday" class="easyui-datebox" required="true"> </div> </form> </div> <div id="dlg-buttons"> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveUser()">保存</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="$('#dlg').dialog('close')">取消</a> </div> ``` JavaScript代码: ``` $(function(){ $('#dg').datagrid({ onClickRow: function(index, row){ // 单击行事件 $('#dg').datagrid('beginEdit', index); // 开始编辑 } }); }); function newUser(){ $('#dlg').dialog('open').dialog('setTitle','添加用户'); $('#fm').form('clear'); } function editUser(){ var row = $('#dg').datagrid('getSelected'); if (row){ $('#dlg').dialog('open').dialog('setTitle','编辑用户'); $('#fm').form('load',row); } } function destroyUser(){ var row = $('#dg').datagrid('getSelected'); if (row){ $.messager.confirm('确认','您确定要删除此用户吗?',function(r){ if (r){ $.post('destroy_user.php',{id:row.id},function(result){ if (result.success){ $('#dg').datagrid('reload'); // 重新加载数据 } else { $.messager.show({ // 弹出消息框 title: 'Error', msg: result.errorMsg }); } },'json'); } }); } } function saveUser(){ $('#fm').form('submit',{ url: 'save_user.php', onSubmit: function(){ return $(this).form('validate'); }, success: function(result){ var result = eval('('+result+')'); if (result.success){ $('#dlg').dialog('close'); // 关闭对话框 $('#dg').datagrid('reload'); // 重新加载数据 } else { $.messager.show({ // 弹出消息框 title: 'Error', msg: result.errorMsg }); } } }); } ``` 在上面的代码中,我们使用了EasyUI的datebox组件作为datagrid中生日列的编辑器,这个组件可以选择年月日。 如果你只想选择年份,可以使用EasyUI的combobox组件,设置数据源为年份列表即可。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值