Question

我不是JQuery的专家但我有这个代码设置标题固定，它按预期工作：

$(document).ready(function () {
        fixedHeader()
    });


    function fixedHeader() {
        // Code to copy the gridview header with style
        var gridHeader = $('#<%=GridView1.ClientID%>').clone(false);       
        //Code to remove all rows except the header row
        $(gridHeader).find("tr:gt(0)").remove();
        $('#<%=GridView1.ClientID%> tr th').each(function (i) {
            // Here Set Width of each th from gridview to new table th 
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', ($(this).width()).toString() + "px");
        });
        // Append Header to the div controlHead
        $("#controlHead").append(gridHeader);
        // Set its position to be fixed
        $('#controlHead').css('position', 'fixed');
        // Put it on top
        $('#controlHead').css('top', $('#<%=GridView1.ClientID%>').offset().top);

    }

问题是我失去了这个按钮不再调用JS的功能

<asp:Button ID="BtnDelete" runat="server" Text="Delete"  onclick="btnDelete_Click"  class="buttons"  Visible="true"  disabled="disabled"  OnClientClick="if (!deleteRow()) return false;"  />

我有这个功能，当选择单选按钮时会突出显示所选行

 // Method that will highlight row
    function gridviewManipulation() {
        // Get Gridview 
        var gridView = document.getElementById("<%= GridView1.ClientID %>");
        // Loop through the Gridview
        for (var i = 1; i < gridView.rows.length; i++) {
            // Get the radio button of each row in the gridview and see if its checked
            if (gridView.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked == true)
            {
                // Place the color for selection
                gridView.rows[i].style.background = '#9bc27e';

            }
            else if (gridView.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked == false && i % 2 == 0)
            {
                // If its even then place white color back
                gridView.rows[i].style.background = '#FFFFFF';
            }
            else 
            {
                // If its odd place the bluish back on
                gridView.rows[i].style.background = '#E3EAEB'; 
            }
        }
    }

有没有其他方法可以使用JQuery修复标头？我认为克隆和新克隆标题的附加正在剥夺我的功能，任何帮助将非常感谢！

Answer 1

我发现在克隆gridview时你应该为它分配一个新的ID，这样就不会剥离它的功能所以：

var gridHeader = $('#<%=GridView1.ClientID%>').clone(true);

到这个

 var gridHeader = $('#<%=GridView1.ClientID%>').clone(true).attr('id','clonedGrid');

这将解决大部分功能，现在好的做法是摆脱：

OnClientClick="if (!deleteRow()) return false;"

在ASP按钮上创建一个像这样的JQuery监听器

$（document）.ready（function（）{

       $('#<%=BtnDelete.ClientID%>').click(function () {
            if (!deleteRow()) return false;
        });           
    });

使用JQuery修复gridview标头并仍然保留功能

1 个答案: