vendredi 17 février 2017

Improve Javascript function for deleting multiple gridview's rows with dynamic show\hide delete button

I'm not very good with Java code, but I had to use two functions found online in which I need a little improvement. On my aspx page there is a gridview in which I added a checkbox field with a header checkbox. Checkboxes are used to selecting rows to delete and header is for check/uncheck all. Then I have a button that actually triggers the delete action and I want to show/hide this button dinamically if there is some checkboxes checked or not.

These are the functions:

function Check_Click(objRef) {
            //Get the Row based on checkbox

            var row = objRef.parentNode.parentNode;
            var x = document.getElementById("divEliminaTutto")
            if (objRef.checked) {
                //If checked change color to Aqua
                row.style.backgroundColor = "#f3ef98";
            }
            else {
                //If not checked change back to original color
                if (row.rowIndex % 2 == 0) {
                    //Alternating Row Color
                    row.style.backgroundColor = "WhiteSmoke";
                }
                else {
                    row.style.backgroundColor = "white";
                }
            }

            //Get the reference of GridView
            var GridView = row.parentNode;

            //Get all input elements in Gridview
            var inputList = GridView.getElementsByTagName("input");

            for (var i = 0; i < inputList.length; i++) {
                //The First element is the Header Checkbox
                var headerCheckBox = inputList[0];

                //Based on all or none checkboxes
                //are checked check/uncheck Header Checkbox
                var checked = true;
                if (inputList[i].type == "checkbox" && inputList[i] != headerCheckBox) {
                    if (!inputList[i].checked) {
                        checked = false;
                        break;
                    }
                }
            }
            headerCheckBox.checked = checked;
        }

        function GridSelectAllColumn(spanChk) {

            var oItem = spanChk.children;
            var theBox = (spanChk.type == "checkbox") ? spanChk : spanChk.children.item[0]; xState = theBox.checked;
            elm = theBox.form.elements;

            for (i = 0; i < elm.length; i++) {
                if (elm[i].type === 'checkbox' && elm[i].checked != xState)
                    elm[i].click();
            }
        }

Check_Click is executed on single checkbox click GridSelectAllColumn is executed on header click

x is the div containing the button and this is the code I want to execute to show\hide it.

if (count > 0) {
                    x.style.display = "block";
                }
                else {
                    x.style.display = "none";
                }

I tried some solutions with counter to count the selected checkbox but I'm missing something because it behave odd. Please help me understand a little bit more of java logic, thanks




Aucun commentaire:

Enregistrer un commentaire