开发背景:一个页面有一个下拉框和一个单选按钮,下拉框保存的是厂商信息,单选按钮保存的是产品信息。每次下拉框的内容被选中,把厂商编码保存到隐藏域

<input type="hidden" id="basin_code" name="basin_code" value=""/>

然后点击该河流下的产品,把产品编码保存到隐藏域

<input type="hidden" id="code_pollute" name="code_pollute" value=""/>

然后ajax提交到后台根据这两个参数查询数据。

下拉框代码

<ul>
     <li><a id="dynastytitle" onclick="hiddenValue('pg');" class="dropdown">苹果</a></li>
            <li class="sublinks">
                <a onclick="hiddenValue('hw');">华为</a>
                <a onclick="hiddenValue('xm');">小米</a>
                <a onclick="hiddenValue('sx');">三星</a>
        </li>
 </ul>

单选按钮代码

<ul id="navigation_ul">
      <li><a onclick="hiddenValue('N01');">电脑</a></li>
      <li><a onclick="hiddenValue('P02');">手机</a></li>
      <li id="stander" class="active"><a onclick="hiddenValue('C03');">平板</a></li>
 </ul>

每次点击传一个参数到hiddenValue()函数,hiddenValue把编码保存到隐藏域

function hiddenValue(param){
        if(param==undefined||param=='udefined'){
            //alert(1);
            $("#code_pollute").val('C03');
            $("#basin_code").val('pg');
        }
        if(param=='N01'||param=='P02'||param=='C03'){
            //alert(2);
            $("#code_pollute").val(param);
        }
        if(param=='pg'||param=='hw'||param=='xm'||param=='sx'){
            //alert(3);
            $("#basin_code").val(param);
            $("#code_pollute").val("C03");
        }
        debugger;
        changebasin();   --隐藏域值改变调用ajax方法请求后台
    }

ajax每次请求后台会先从隐藏域取厂商和产品的参数值传到后台

function changebasin(){

var rivername = $("#basin_code").val();
        var codepollute = $("#code_pollute").val();
        //alert(rivername);
        $.ajax({
            type: "POST",
            url:  "../factory/factory_product.vm",
            dataType: "json",
            data:JSON.stringify({"watername":rivername,"code_pollute":codepollute}),
            contentType: "application/json; charset=utf-8",
            success: function(result){
                 loadEcharts(result);
                 $("#monitortime").html(result.monitortime);
           }
        });
    }

每次隐藏域的值改变后会调用请求后台的函数changebasin()

$(function(){
        changebasin();
        hiddenValue();
    })

每次页面初始化会先调用两个函数,给隐藏域赋值,调用后台方法

隐藏域传值到后台controller的更多相关文章

  1. 避免url传值字符串sjstr过长,使用from表单【隐藏域】post提交

    1.普通的url传值<html--------------- <!-- 隐藏域post提交url --> <form id="urlPost" action ...

  2. 错误记录:html隐藏域的值存字符串时出错

    问题 webform在后台给前台传值.  <input type="hidden" value="<%=userType %>" id=&qu ...

  3. 获取jsp选中复选框的id传到后台controller,进行逻辑删除等操作

    逻辑删除设备:(数据表中还有这条记录,不显示出来) 思路: 数据表加个字段display,值为Y/N,只显示display为Y的,删除时,把display的值改为N,就不会显示出来 jsp页面如下图, ...

  4. 关于java 获取 html select标签 下拉框 option 文本内容 隐藏域

    在HTML中从多选下拉框中提取已选中选项的文本内容到后台,被这个问题难倒了. demo.jsp文件 <select id="selecttype" name"typ ...

  5. SpringMVC中,前台jsp封装参数,绑定参数,传递参数到后台controller的过程详解

    前台到后台的流程:前台jsp->后台:controller控制器层->service业务层->DAO数据访问层->数据库model模型层. 从上面流程可知,前台jsp的数据,想 ...

  6. jquery.validate 使用--验证表单隐藏域

    jQuery validate很不错的一个jQuery表单验证插件.升级到了1.9版的后,发现隐藏表单域验证全部失效,特别是在jquery.ui.tabs.min.js构造的Tabs里的验证. 是因为 ...

  7. jsp通过s:hidden传值给后台,后台数据出现了若干逗号问题

    <s:iterator value="rpActionVO.page.result" id="list" status="st"> ...

  8. html中隐藏域hidden的作用介绍及使用示例

    基本语法: <input type="hidden" name="field_name" value="value"> 作用:  ...

  9. bootstrapValidator对于隐藏域验证和程序赋值即时验证的问题

    问题1: 如下代码: <input type="hidden" name="productId"/> $("#addForm") ...

随机推荐

  1. 为什么char *name="it",printf("%s",name) 能够输出字符串?

    “it”里面是3个字符  “i”“t”“/0”,%s会打印指针指向的字符就是“i”,知道遇到“/0”停止,所以打印出来是“it”

  2. php循环方法实现先序、中序、后序遍历二叉树

    二叉树是每个节点最多有两个子树的树结构.通常子树被称作“左子树”(left subtree)和“右子树”(right subtree). <?php class Node { public $v ...

  3. python 美化打印json数据

    #!/usr/bin/python3 # -*- coding: utf-8 -*- import json data = {'name':'张森','email':'zhangsen@qq.com' ...

  4. 解决bug感觉

    解决bug,没有思路,很烦躁: 时间过去好久,还是没头绪,没结论: ...... ...... ...... ...... ...... 过了好久,这样还不如冷静下来,按照正确的方法(review代码 ...

  5. [LeetCode] 709. To Lower Case_Easy

    Implement function ToLowerCase() that has a string parameter str, and returns the same string in low ...

  6. Photobucket不能用了怎么办?推荐10个在线图片储存服务!

    近日,图片共享服务网站Photobucket更新了政策,要求用户缴纳399美元的年费,才能使用第三方网站图片储存服务. 由于Photobucket出台这一政策,亚马逊及其他电商平台上相关的产品图片已被 ...

  7. 20165321 2017-2018-2《Java程序设计》课程总结

    每周作业链接汇总 预备作业1:20165321 我期望的师生关系 预备作业2:20165321 学习基础与C语言学习心得 预备作业3:20165321预备作业3:Linux安装及命令入门 第一周作业: ...

  8. vue2.0项目中 localhost改成ip地址访问

    这里 你可以写成你的ip  那你的项目只能ip访问了,但是写成0.0.0.0的话 你既可已localhost 访问也可以ip访问 也可以写成 127.0.0.1也可以,也能local访问了和ip访问( ...

  9. 听说,你也一直钟爱着equals。。。

    脑补一下final final 用于声明变量/参数/属性.方法和类. 修饰变量:如果变量是基本类型,其值不变:如果是对象,则引用不可再变(内容可变). 修饰方法:方法不可重写(是否可继承取决于方法的访 ...

  10. 记录一则完整的SPA(10g->11g)测试过程

    生产端:Windows 2008 + Oracle 10.2.0.5 测试端:RHEL 6.5 + Oracle 11.2.0.4 需求:因为Oracle跨越大版本,优化器.新特性变动较多,需要进行S ...