使用slickgrid复选框列从服务器和网格中删除多个数据

时间:2013-02-19 05:45:59

标签: jquery slickgrid

$('#bulk_delete_id').live('click',function(e){            
            e.preventDefault();            
            var selectedrows = grid.getSelectedRows();            
            var len = selectedrows.length;        
            if(len == 0){                
                alert('Select atleast one row!');
            }else{                
                var r = confirm('Are you sure want to delete selected data?');   
                if(r){  
                    var i;
                    var longIdList = new Array();                    
                    for(i=0;i<len;i++){                        
                        var d = grid.getData().getItem(selectedrows[i]);                         
                        if(d != null && d != 'undefined'){
                            var longId = d.id;                               
                            longIdList.push(longId);                                                    
                        }
                    }  

                    if(longIdList != null){
                        $.each(longIdList, function(index){
                            dataView.deleteItem(longIdList[index]);                                     
                        });
                        refreshcount();
                        grid.setSelectedRows([]);
                        grid.invalidate();                                
                        grid.updateRowCount();
                        grid.render();
                        $.post(base_url+'databrowser/deleteAnantData',{                
                            'longIds' : longIdList,
                            'objlongId': $('.class_list li a.selected').attr('id'),
                            'applongId':applongId
                        },function(response){   
                            var res = jQuery.parseJSON(response);
                            $('#msg').css('display','block');
                            $('#msg').html(res.data.message);
                            $('#msg').fadeOut(5000);                            
                            if(res.code == 0)
                            {                                
                                $('#msg').addClass("dbfailureMessage");                               
                            }
                            else
                            {                                
                                $('#msg').addClass("dbsuccessMessage");                            
                            }                            
                        });                             
                    }                    
                }
            }
        });

HTML代码:

<table class="tablesorter" border="0" cellpadding="0" cellspacing="1">
    <tbody>
        <tr class="headerobj">
            <td><h4>Anant Objects</h4></td>
            <td><div class="utility"><div class="right_section">
                        <div class="pagination">
                            <a class="right inactive" data-action="next">
                                <div></div>
                            </a>
                            <a class="left inactive" data-action="back">
                                <div></div>
                            </a>
                        </div>                       
                    </div>

                    <div class="left_section">

                        <input type="button" class="new_row thickbox" alt="#TB_inline?height=450&width=450&inlineId=addrowContainer" value="+ Row" /> 
                        <button id="bulk_delete_id">- Row</button>                        
                        <input type="button" class="new_field thickbox" alt="#TB_inline?height=450&width=450&inlineId=fieldsContainer" value="Add Field" /> 
                        <input type="button" class="drop_field thickbox" value="delete Field" alt="#TB_inline?height=450&width=450&inlineId=dropfieldsContainer" />
                        <div class="dropdown_container">
                            <button class="more">More<span class="arrow"></span></button>
                            <div class="dropdown" style="display: none;">
                                <ul>
                                    <li><button class="drop">Drop Object</button></li>
                                    <li><button class="deleteAll">Delete All</button></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div></td>
        </tr>
        <tr class="nonheader">
            <td class="classes">
                <div class="classes_header">
                    <ul class="class_list">
                        <?php $i = 0;
                        foreach ($anantObjects as $row)
                        { ?>
                            <li><a href="#" id="<?php echo $row['longId']; ?>" class="<?php if ($i == 0) {
                                echo "selected";
                            } ?>">
                                    <div class="name"><?php echo $row['objectName']; ?></div>
                                    <span class="count"><?php echo $row['count']; ?></span>
                                </a></li>
    <?php $i++;
} ?>
                    </ul>
                    <div class="class_utility">                                                
                        <input type="button" id="btnImport" class="thickbox" value="Import" alt="#TB_inline?height=450&width=450&inlineId=importContainer"/>
                        <input type="button" id="btnExport" value="Export" />
                    </div>
                </div>    
            </td>
            <td class="class_data">
                <div id="gridData"></div>
            </td>
        </tr>
    </tbody>
</table>

我使用光滑网格进行数据显示。我有删除按钮,用于从光滑网格和服务器中删除已检查的行。当我选择行后点击删除按钮。成功删除行,但整个单击事件函数执行多次。它再次检查所选行的长度n显示警告“选择至少一行!”。反复。 我无法辨认这个错误。如果有人请帮助我。

1 个答案:

答案 0 :(得分:1)

听起来你的事件处理程序不止一次受到约束。由于您正在使用直播活动,我猜测必须动态添加删除按钮?如果是这样,那可能就是问题 - 每次将删除按钮添加到页面时,新的事件处理程序就会绑定到它。而不是现场活动试试这个:

$('div.left_section').unbind('click').on('click', '#bulk_delete_id', function(e) {
   // event handler code goes here