Jquery - 在自动完成选择期间使用模式对话框

时间:2012-01-03 22:23:07

标签: jquery autocomplete modal-dialog

我试图让Jquery UI模式对话框在选择自动完成项后接管。我将所有内容都弹出为例外但是在模式对话框启动后会运行代码。最后,我希望弹出此对话框,并根据按钮做出反应。

从自动完成中选择:

        select: function( event, ui ) {
        if(ui.item.squad != '0'){
            console.info('popup');
            var choice=null;

            $( "#dialog-confirm" ).dialog({
                resizable: false,
                height:140,
                modal: true,
                buttons: {
                    Cancel: function() {
                        choice = false;
                        $( this ).dialog( "close" );
                    },
                    "Move Shooter": function() {
                        choice = true;
                        $( this ).dialog( "close" );

                    }
                }
            });
            if(!choice){
                console.info($(this));
                $(this).text("");
                $(this).val("");
                $(this).attr("name", "");
                $(this).attr("value", "");
                console.info("false");
                return;
            }
        }

大多数代码都来自jquery ui here.

当我运行此代码时,我认为在按下按钮之前它会停止运行代码,但是当您看到here时,会打印出打印错误的行到控制台。

1 个答案:

答案 0 :(得分:0)

你的代码不会工作,因为它将执行整个块并返回。你想要的东西是定义一个用户做出选择后执行的功能。基本上,您可以通过将对话框代码下的if语句移动到其自己的函数,然后将此函数作为按钮处理程序代码的一部分来调用。

示例:

在某处定义回调:

function handleDialogResponse(choice) {
    if(!choice){
        console.info($(this));
        $(this).text("");
        $(this).val("");
        $(this).attr("name", "");
        $(this).attr("value", "");
        console.info("false");
    }
}

然后将对话框按钮代码更改为以下内容:

buttons: {
    Cancel: function() {
        $( this ).dialog( "close" );

        handleDialogResponse(false);
    },
    "Move Shooter": function() {
        $( this ).dialog( "close" );

        handleDialogResponse(true);
    }
}