• checkbox遍历操作, 提交所有选中项的值



    <
    div class="content_list pad_10 hidden" > <h3>修改可配送地区</h3> <input type="checkbox" name="checkall" class="J_checkall">全选/取消<br> <volist name="city_list" id="val" mod="5"> <input type="checkbox" name="city_name[]" value="{$val.fid}" class="J_checkitem"> {$val.name} <eq name="mod" value="4"><br/></eq> </volist> </div>
    <script type="text/javascript">
    //全选反选
    $('.J_checkall').live('click', function(){
        $('.J_checkitem').prop('checked', this.checked);
        $('.J_checkall').prop('checked', this.checked);
    });
    var city_data = {$info['city_data']?$info['city_data']:json_encode(array())};
    var city_fids = new Array();
    $.each(city_data,function(idx,obj){
        city_fids.push(obj.fid);
    });
    
    $('.J_checkitem').each(function(){
        //window.alert($.inArray($(this).val(),city_fids));
        if($.inArray($(this).val(),city_fids)>=0){
            $(this).prop("checked",true);
        }
        
    });
    </script>

    上面的实现依赖 <script src="__STATIC__/js/jquery/plugins/listTable.js"></script>

    提交所有选中项checkbox的值

    var checked_array = [];
    function do_checked(){
        checked_array = [];
        $('input[type=checkbox]:checked').each(function(i,o){
            checked_array.push(o.value);
        });
        $('#selected_ids').val(checked_array.join(','));
    }

    html 页面

    <form>
    <input type="hidden" name="selected_ids" id="selected_ids" value="" />
    
    <td align="center"><input type="checkbox" class="J_checkitem" value="{$val.id}"></td>
    <td align="center"><input type="checkbox" class="J_checkitem" value="{$val.id}"></td>
    <td align="center"><input type="checkbox" class="J_checkitem" value="{$val.id}"></td>
    <td align="center"><input type="checkbox" class="J_checkitem" value="{$val.id}"></td>
    <td align="center"><input type="checkbox" class="J_checkitem" value="{$val.id}"></td>
    
    
    </form>
  • 相关阅读:
    C++ | Int转十六进制字符串
    Qt | QML Image SSL handshake failed
    《大话数据结构》第一章 数据结构绪论
    8组Beta冲刺4/5
    8组Beta冲刺1/5
    8组Beta冲刺3/5
    8组Beta冲刺2/5
    8组Beta冲刺5/5
    软工实践个人总结
    8组Beta冲刺总结
  • 原文地址:https://www.cnblogs.com/beyang/p/5379359.html
Copyright © 2020-2023  润新知