标签: jquery-dialog

我有一个ASP.NET MVC页面(注册).在加载页面时,我在该对话框上使用" 同意"和" 不同意"按钮调用Jquery Dialog.

1).默认情况下如何将焦点设置为"同意"按钮？

2).如何禁用右上角的X(关闭)标记？(因此我不希望用户简单地关闭该对话框).

码:

$("#dialog-confirm").dialog({
        closeOnEscape: false,
        autoOpen: <%= ViewData["autoOpen"] %>,
        height: 400,
        width: 550,
        modal: true,
        buttons: {
            'Disagree': function() {
                location.href = "/";
            },
            'Agree': function() {
                $(this).dialog('close');
                $(this).focus();
            }
        },
        beforeclose: function(event, ui) {
            var i = event.target.id;
            var j = 0;
        }
    });        

感谢您的回复.

谢谢

我正在尝试创建一个客户支持对话框.我希望对话框有两行文字和一个标题.第一行是错误消息,第二行是粗体客户服务号.这可能很难描绘,所以我添加了一个我在油漆中制作的对话框来帮助:

我尝试创建一个新的行语句(string Error = "You have an error... number \n Customer Support...),看看我是否可以分开文本,但这不起作用.有什么建议？

我的情景:

1. 单击Dialog1中的特定元素时,将打开Dialog2.

2. 当你按Escape关闭Dialog2时,按预期工作并关闭Dialog2.

3. Dialog1仍然存在,你会认为它可以通过再次击中Escape来关闭,但事实并非如此.您必须先单击对话框,然后单击Escape才能关闭它.

这是我尝试过的,但无济于事:

// Array to hold all of our open dialogs id's
var openDialogs = [];

// the open: method in my dialog
open: function() {

    openDialogs[openDialogs.length] = $(this).attr("id");

}

// the close: method in my dialog
close: function() {

    var index = $.inArray($(this).attr("id"), openDialogs),
    $previousDialog = (index > 0) ? $("#" + openDialogs[index]) : undefined;

    // remove the current dialog from the array via Jon Resig's remove() method
    openDialogs.remove(index);          

    // set focus to previously opened dialog …

我正在使用.ascx用户控件,其中我填写员工数据和员工图片.在点击员工图片时,我想显示一个对话框,我想要一个文本字段和一个文本框供用户输入.Click事件正常,但是通过对话框,它给出了"Microsoft JScript运行时错误:对象不支持属性或方法'对话框'"的错误.请任何人帮我填写一个带有文本字段和文本框的对话框.我是JQUERY的新手,并努力让它发挥作用.

在下面的代码片段中,我添加了一个在线查找的示例中的对话框代码.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="OpenAccessDataProvider,a4a794260c0b4440b466f75d11146db8.ascx.cs" Inherits="SitefinityWebApp.SfCtrlPresentation.OpenAccessDataProvider_a4a794260c0b4440b466f75d11146db8" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.PublicControls.BrowseAndEdit" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.ContentUI" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Comments" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Fields" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<telerik:RadListView ID="dynamicContentListView" ItemPlaceholderID="ItemsContainer" runat="server" EnableEmbeddedSkins="false" EnableEmbeddedBaseStylesheet="false">
    <LayoutTemplate>
        <ul class="sfitemsList sfitemsListTitleDateTmb">
            <asp:PlaceHolder ID="ItemsContainer" runat="server" />
        </ul>
    </LayoutTemplate>

        <ItemTemplate>
      <li class="sfitem sfClearfix">
            <h2 class="sfitemTitle">
                <sf:DetailsViewHyperLink ID="DetailsViewHyperLink" TextDataField="Title" runat="server" />
            </h2>
           <sf:AssetsField ID="AssetsField1" runat="server" DataFieldName="Picture" />
           <sf:SitefinityLabel …

所以我有一个简单的jQueryUi对话框,它不会居中,也无法移动.

我在控制台中收到的错误消息是指

jquery-ui-1.8.17.custom.min.js:36

所以这并没有告诉我太多,只是传递给某个jQueryfunction的一些参数是无效的:

Uncaught TypeError: Object function (a,b){return new p.fn.init(a,b,c)} has no method 'curCSS' jquery-ui-1.8.17.custom.min.js:36
a.fn.position jquery-ui-1.8.17.custom.min.js:36
p.extend.each jquery-1.8.2.min.js:2
p.fn.p.each jquery-1.8.2.min.js:2
a.fn.position jquery-ui-1.8.17.custom.min.js:36
a.widget._position jquery-ui-1.8.17.custom.min.js:156
a.widget.open jquery-ui-1.8.17.custom.min.js:156
(anonymous function) jquery-ui-1.8.17.custom.min.js:17
p.extend.each jquery-1.8.2.min.js:2
p.fn.p.each jquery-1.8.2.min.js:2
a.widget.bridge.a.fn.(anonymous function) jquery-ui-1.8.17.custom.min.js:17
openMediaLibrary 6:456
onclick 6:187

对话框div如下所示:

<div id="mediaLibrary" title="Bildgalleri">
     <iframe width="950px" height="500px" src="{{ path('ImageGallery') }}" style="border:0;" /></iframe>
</div>

Dialog在这里初始化了......

$( "#mediaLibrary" ).dialog({
    height: 550,
    width:980,
    modal: true,
    autoOpen: false,
    position: { my: "center", at: "center" },
});

......在这里开了

$( "#mediaLibrary" ).dialog( "open" );

所以当用户点击它打开的链接时,我会有一个带有表单的对话框UI.一旦他们单击"添加按钮",它就会创建一个AJAX调用,将数据提交到数据库中.我需要添加的是reload()函数来刷新页面.

如何添加重载功能？

我试图添加windows.localtion.reload(); 你可以看到我的代码.这条线由于某种原因不起作用

//Update contact dialog box
    $( "#contact-edit" ).dialog({
    resizable: false,
    width: 500,
    modal: true,
    autoOpen: false,
    buttons: {
        "Update Info": function(e) {

        var formData = $('#edit-form').serialize();

        //submit record
        $.ajax({    
            type: 'POST',
            url: 'ajax/handler-contact-update.php',     
            data: formData,
            dataType: 'json',
            cache: false,
            timeout: 7000,
            success: function(data) {           

                $('#response-edit').removeClass().addClass((data.error === true) ? 'errorBox' : 'passBox').html(data.msg).fadeIn('fast');   

                if ($('#response-edit').hasClass('passBox')) {
                    $('#response-edit').fadeIn('fast');
                    $('#edit-form').hide();
                        $( "#contact-edit" ).dialog("close");
                        windows.localtion.reload();
                }       
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {

                $('#response-edit').removeClass().addClass('errorBox')
                            .html('<p>There was an<strong> ' + errorThrown +
                                  '</strong> error …

我试图单独更改为标题栏颜色.所以我使用了.ui-dialog-titlebar,但它不起作用,所以我尝试使用ui-widght-header,它反映到数据表也..请指教.

//不工作

.ui-dialog-titlebar {
  background-color: #F9A7AE;
  background-image: none;
  color: #000;
}

//工作,但反映到数据表头也..

.ui-widget-header
{
    background-color: #99CCFF;
    background-image: none;
    color: Black;
}

我正在寻找只有颜色的对话框标题栏.请指教.

我希望能够按"ENTER"并让对话框执行与提交按钮相同的操作.

我在这里找到了一个类似的问题:在<Enter>上提交jQuery UI对话框.我在代码中添加了一些解决方案,并没有解决问题.

这是我到目前为止:

按钮:

<button id="myButton">Execute Tasks</button>

对话框本身:

<div id='myDialog' title="New Task(s):">
    <p>Enter the name of the tasks you wish to execute</p>
        <form>
            <label for="name">
                <input type="text" name="name" id="name" />
            </label> 
        </form>
</div>

内部脚本标签:

$('#myButton').click( function() {
    $( "#myDialog" ).dialog({
        open: function(){

            $("#myDialog").unbind('submit');
            $("#myDialog").submit(function() {
            $("#myDialog").parents('.ui-dialog').first().find('.ui-button').first().click();
            return false;
            });
        },
        buttons: {
            "Run tasks": function() { .... },
            "Cancel":function() { $(this).dialog("close"); };
        },
    });
});

问题:

当在嵌套在使用knockout with数据绑定的元素下的jQuery对话框上使用时,select2 jQuery插件不起作用.删除with绑定,select2工作正常.如果with绑定到嵌套属性,则它将停止工作.

背景:

因此,我必须在3小时内努力争取让select2在jQuery对话框表单上工作....讨论关于这个谚语错误树的问题,我认为它纯粹是jQuery对话框和select2.它可能从一开始就_allowInteraction修复了.直到我把问题直接解决为简单的步骤,并且因为开始显露自己.问题在于with绑定.

放弃

当我为阻止jsFiddle的asinine公司工作时道歉.此外,由于实际模型非常大,我为了说明目的而细分了我的实现.

// models

function Department() {
  this.name         = ko.observable('dept1');
  this.selectedTeam = ko.observable( new Team() );
}
    
function Team() {
  this.name = ko.observable('team1');
}
    
function MainModel() {
  this.department = new Department();
  this.showTeam   = function() { 
    $('#addTeamDialog').dialog('open');
  };
}

// setup

ko.applyBindings( new MainModel() );
    	
$('#addTeamDialog').dialog({
  // fix allow select2 to work on the jq dialog
  _allowInteraction: function (event) {
    return !!$(event.target).is(".select2-input") || this._super(event);
  }		
}); …

我在我的页面中使用了3个对话框,用于3个差异目的.

我创建对话框为

  $(".dialog").dialog({
        height: 238,
        width: 465,
        resizable: false,
        title: "Edit"
    });

我在对话框上完成操作后关闭对话框为

   $(".ui-dialog").hide();

当我隐藏这种方式对话框没有第二次打开时,所以尝试显示对话框启动功能

  $(".ui-dialog").show();

我的问题从这里开始......

当我显示对话框时,Dialogs被多次打开,STill第一个打开的对话框正在与第二个对话框重叠,

是否有任何正确的方法隐藏和显示对话框没有重叠或干净的方式.