javascript按钮在关闭后停止工作

Question

I have a button that opens a dialog and when I close the dialog it stops working. When I save on the dialog screen it continues to work fine.

This is the button that opens the dialog:

<button class="actionbutton" type="button" onclick="addLitigant();">Add Litigant To Case(s)</button>

The code it calls:

function addLitigant(){
    console.log("Calling addLitigant()");
    editDialog.extendedDialog('loadUrl','CRFilingLitigantDialog.do?action=addLitigant', 'Add Litigant');
}

The close code on the dialog screen:

param['buttons'].push(
        {
            id: "closeButton",
            text: "(C)lose",
            accessKey: "c",
            click: function () {
                jQuery(this).extendedDialog('close');
                jQuery(this).html('');

            }
        }
    );

The save button code:

function () { 
                        console.log("clicking Save");
                        jQuery('#toAssign option').each(function(){
                            jQuery(this).attr('selected',true);
                        });

                        jQuery('#toUnassign option').each(function(){
                            jQuery(this).attr('selected',true);
                        });

                        editDialog.extendedDialog('postUrl', {url: 'CRFilingLitigantDialog.do?action=updateLitigant', formId: '#crFilingLitigantDialogForm', success: function(){
                            litigantTabGet('CRFilingLitigantDetail.do', null);
                            editDialog.extendedDialog ('destroy');
                        }});
                    }

We are using jquery 1.6.2. I have tried adding console.log statements to the addLitigant() function but when I come back from the close it doesn't call anything in the console. If I refresh the page it does begin to work again until we close from the dialog.

This is the immediate function that is on the page that opens the dialog

jQuery(function(){
    console.log("function");

    verificationDialog = jQuery('<div id="verificationDialog"></div>').clerkReviewDialogTemplate({
        height:600,
        width:800,
        title: "Compare Eflex and Icis"
    });

    compareDialog = jQuery('<div id="comparisonDialog"></div>').clerkReviewDialogTemplate({
        height:400,
        width:500,
        title: "Imported Person"
    });

    editDialog = jQuery('<div id="editDialog"></div>').clerkReviewDialogTemplate({
        height:600,
        width:700,
        title: "Edit Litigant",
        buttons: [
            {
                id: "save",
                text: "S(a)ve",
                accessKey: "a",
                click: function () { 
                    console.log("clicking Save");
                    jQuery('#toAssign option').each(function(){
                        jQuery(this).attr('selected',true);
                    });

                    jQuery('#toUnassign option').each(function(){
                        jQuery(this).attr('selected',true);
                    });

                    editDialog.extendedDialog('postUrl', {url: 'CRFilingLitigantDialog.do?action=updateLitigant', formId: '#crFilingLitigantDialogForm', success: function(){
                        litigantTabGet('CRFilingLitigantDetail.do', null);
                        editDialog.extendedDialog ('destroy');
                    }});
                }
            }
        ]
    });

    jQuery('.saveOnChange').bind('change', function(){
        updateLitigants();
    });

    jQuery('.pin').icisAutocomplete({
        mustMatch: true,
        source: function(request, response){
            getQuickAccess(request, response);
        },
        change: function(event, ui){
            updateLitigants();
        }}).each(function(index){
            var data = jQuery(this).data('staging-json');

                jQuery(this).bind('keydown', function(event){
                    return f5_handler({
                        event: event,
                        onf5key: function(){
                            var popup = people_popup({elem: this, event: event, data: data, success: function(data){
                                if(data['pin'] != 'null'){
                                    jQuery(event.currentTarget).val(data['pin']);
                                }
                                if(data['masterPin'] != 'null'){
                                    jQuery('#'+jQuery(event.currentTarget).attr('masterPinField')).val(data['masterPin']);
                                }
                                compareDialog.extendedDialog('close');
                                updateLitigants();
                            }});
                            compareImportedLitigant(data['id'], popup);
                        }
                    });
                });
        });
});

Thanks,

Tom

Answer 1

looks like a post back issue that makes you lose you bind events - this is the only thing that could cause losing button event - try to replace your immediate function with

function pageLoad() {}

see this $(document).ready() and pageLoad() are not the same!

might help

Answer 2

I compared this code to an older version. I noticed that it worked in an older version and I compared the two. The older version had a change in the edit dialog code, I added the close code to it and it now works.

 editDialog = jQuery('<div id="editDialog"></div>').clerkReviewDialogTemplate({
            height:600,
            width:700,
            title: "Edit Litigant",
            close: function(){
                litigantTabGet('CRFilingLitigantDetail.do', null);
                editDialog.extendedDialog ('destroy').remove();
            },
            buttons: [
                {
                    id: "save",
                    text: "S(a)ve",
                    accessKey: "a",
                    click: function () {
                        jQuery('#toAssign option').each(function(){
                            jQuery(this).attr('selected',true);
                        });

                        jQuery('#toUnassign option').each(function(){
                            jQuery(this).attr('selected',true);
                        });

                        editDialog.extendedDialog('postUrl', {url: 'CRFilingLitigantDialog.do?action=updateLitigant', formId: '#crFilingLitigantDialogForm', success: function(){
                            litigantTabGet('CRFilingLitigantDetail.do', null);
                            editDialog.extendedDialog ('destroy');

                        }});
                    }
                }
            ]
        });