jquery ui对话框没有关闭?

时间:2022-08-23 18:00:00

I cant get my dialog to close, what am I doing wrong here? I am trying to integrate this script in my asp.net mvc 3 app?

我不能让我的对话关闭,我在这里做错了什么?我想在我的asp.net mvc 3应用程序中集成这个脚本?

<p id="dialog_link" style="cursor: pointer;">
    Open Dialog
</p>
<div id="Dialog" title="Dialog title!" style="display: none;">
    @*  @{Html.RenderAction("Categories");}*@
    @{Html.RenderAction("About");}
</div>
<link href="../../Content/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript">
</script>
<script type language="javascript">

    $(function () {
        var execute = function () {
            //alert('This is Ok button');
        };
        var cancel = function() {
            //alert('This is Cancel button');
            $("#Dialog").dialog('close');
        };
        var dialogOpts = {
            buttons: {
                "Ok": execute,
                "Cancel": cancel
            }
        };
        $("#Dialog").dialog(dialogOpts);
    });

</script>

3 个解决方案

#1


0  

Working demo http://jsfiddle.net/BWXNe/

工作演示http://jsfiddle.net/BWXNe/

something like this man! Hope it fits your cause!

像这个男人!希望它符合你的事业!

scripts

脚本

  <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>

      <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css">

code

$(document).ready(function() {
    $('#dialog_link').click(function(){
                $( "#Dialog" ).dialog( "open" );    
    });

    $( "#Dialog" ).dialog({
            modal: true,
            autoOpen: false,
            height: 255,
            width: 300,
            buttons: {
                "Retrieve": function() {

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


});


​

#2


1  

Try this: http://jsfiddle.net/FgRqx/

试试这个:http://jsfiddle.net/FgRqx/

<script type="text/javascript">

    $(function () {
        $('#dialog_link').click(function(e){
            e.preventDefault();

            $("#Dialog").dialog({
                buttons:    {
                    'OK': function(){
                        console.log('OK clicked!');
                    },
                    'Close': function(){
                        $(this).dialog('close');
                    }
                }
            });
        });
    });

</script>

#3


0  

check this fiddle

检查这个小提琴

http://jsfiddle.net/piyushsardana47/26hzZ/

http://jsfiddle.net/piyushsardana47/26hzZ/

#1


0  

Working demo http://jsfiddle.net/BWXNe/

工作演示http://jsfiddle.net/BWXNe/

something like this man! Hope it fits your cause!

像这个男人!希望它符合你的事业!

scripts

脚本

  <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>

      <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css">

code

$(document).ready(function() {
    $('#dialog_link').click(function(){
                $( "#Dialog" ).dialog( "open" );    
    });

    $( "#Dialog" ).dialog({
            modal: true,
            autoOpen: false,
            height: 255,
            width: 300,
            buttons: {
                "Retrieve": function() {

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


});


​

#2


1  

Try this: http://jsfiddle.net/FgRqx/

试试这个:http://jsfiddle.net/FgRqx/

<script type="text/javascript">

    $(function () {
        $('#dialog_link').click(function(e){
            e.preventDefault();

            $("#Dialog").dialog({
                buttons:    {
                    'OK': function(){
                        console.log('OK clicked!');
                    },
                    'Close': function(){
                        $(this).dialog('close');
                    }
                }
            });
        });
    });

</script>

#3


0  

check this fiddle

检查这个小提琴

http://jsfiddle.net/piyushsardana47/26hzZ/

http://jsfiddle.net/piyushsardana47/26hzZ/