如何避免多次显示警报

Question

The webpage has an UpdatePanel with a grid view having checkboxes on each row, and a couple of buttons of the same class "cssUpdateEM". Outside the update panel I have another button "btnExportToExcel" having the "cssUpdateEM" class.

The buttons within the update panel, if clicked, display the alert message (if no items selected) only once. The issue is with the outer button "btnExportToExcel". If the page is posted back n times, and btnExportToExcel is clicked, and no items selected, the alert message will show n times instead of only once.

 //************************** // Pick the selected Items //************************** $('.cssUpdateEM').click(function () { var SelectedEMItemIDs = ""; var strDelim = ""; $('.cssItemEM').each(function () { if ($(this).is(':checked') == true) { SelectedEMItemIDs += strDelim + $(this).attr('eid'); strDelim = ";"; } }); if (SelectedEMItemIDs == "") { alert('Please select the item(s).'); return false; } else { $('#hdnSelectedItemID').attr('Value', SelectedEMItemIDs); return true; } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

Any idea why is this happening, and how to fix this?

Answer 1

I solved this problem. I'd like to mention that I'm using a master page.

So, code before :

<script type="text/javascript">

    function BindControlEvents() {
    //jQuery is wrapped in BindControlEvents function so it can be re-bound after each callback.

        $(document).ready(function () {

            $('.cssUpdateEM').click(function () {
                //the original function body here
            });

           // ... other functions here

        })
    }

// ... other functions here

The script ends with:

    Sys.Application.add_load(BindControlEvents);
</script>

The code after has the btnExportToExcel event handler moved outside of the $(document).ready.

$('#btnExportToExcel').click(function () {
    //code including the alert here
}

I hope this explanation will help somebody, sometime.