Question

在我的Asp.net mvc网页上，我有三个标签。第一个用于编写消息，第二个用于选择接收者，第二个用于验证。

在第一个主标签上，我有一个按钮，用于打开带有Jquery UI对话框弹出窗口的消息预览
在第二个主选项卡上，我加载到另一个选项卡功能，两个视图收取我的每个收件人列表。

我不明白为什么我会收到错误“无法在初始化之前调用对话框上的方法;尝试调用method'open'”，当我点击我的预览按钮时。我已经在我的脚本文件中进行了一些测试，我知道，当我在第二个主选项卡上加载一个问题时就会出现问题。我做了这些测试：

更改通话方法
调用一个非常简单的部分视图
打开基本对话框
为对话框

如果我删除$('#AlertCreationTabs-1').html(result);预览弹出窗口，但是当我把这行放回去时我收到错误。我不明白为什么它不起作用。

脚本文件：

$(function () {
    $('#dialogtest').dialog({
        autoOpen:false,
        closeOnEscape:true,
        show:'slow',
        modal:false,
    });
    $('#btnpreview').click(function() {
        $('#dialogtest').dialog("open");
    });
});

$(document).ready(function () {
    $("#AlertCreationTabs").tabs();
});

$(document).ready(function () {
    $.ajax({
        type: 'GET',
        dataType:'html',
        url: '/Panels/ViewTest',
        contentType:"text/html; charset=utf-8",
    }).success(function (result) {
        $('#AlertCreationTabs-1').html(result);
    });
});

$(function () {
    $('#AlertLog_AlertStartDate').datetimepicker({dateFormat:'dd/mm/yy'});
});

$(function () {
    $('#AlertLog_AlertEndDate').datetimepicker({dateFormat:'dd/mm/yy'});
});

$(document).ready(function () {
    $('#myTab').turbotabs({
        mode: 'vertical',
        width: '100%',
        padding: '0%',
        textColor: '#000000',
        navBackground: '#f0f6fa',
        backgroundColor: '#f0f6fa',
        hoverColor: '#FFFFFF',
        hoverBackground: '#fab300',
        activeBackground: '#fab300',
        navTextShadow: 'off'
    });
});

查看：

<div id="dialogtest">Zogzog</div>
 <div id="myTab">
            <ul class="tt_tabs">
                <li class="active">Composition</li>
                <li>Recipient</li>
                <li>Validation</li>
            </ul>
            <div class="tt_container">
                <div class="tt_tab active">
                    @Html.AntiForgeryToken()
                    <div class="panel-outerform">
                        <div class="form-horizontal">
                            ...
                            <div class="buttonbox">
                                <div class="form-group">
                                    <div class="col-md-offset-2 col-md-10">
                                        <input type="button" id="btnpreview" value="Preview" class="btntemplate" />
                                    </div>
                                </div>
                            </div>
                            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                        </div>
                    </div>
                </div>
                <div class="tt_tab">
                    <div class="panel-outerform">
                        <div class="form-horizontal">
                            <div class="tab-title">
                                <h3>Please Choose Recipient for this alert</h3>
                            </div>
                            <div id="AlertCreationTabs">
                                <ul>
                                    <li><a href="#AlertCreationTabs-1">IP group</a></li>
                                    <li><a href="#AlertCreationTabs-2">PC group</a></li>
                                </ul>
                                <div id="AlertCreationTabs-1">
                                </div>
                                <div id="AlertCreationTabs-2">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        ...

编辑：好的，现在它正在工作，但我收到另一个错误，我希望在对话框打开时启动Ticker脚本（jnewsticker）。我已尝试在opt中添加此内容：

    open:function (event,ui) {
        var separator ...
        var title ...
        var startdate ...
        document.getElementByid('alertdata').innerHTML = ... 
        $('#newsticker_1').newsticker({
            'showControls':false,
        });
   ),

我收到错误TypeError:$(...).newsticker is not a fucntion。 Ticker适用于经典$('#dialogtest').dialog...。我想我必须以不同的方式称这个开放事件

Answer 1

我认为此问题特定于dialog框，因为您在其上调用了open方法，并且可能在那时尚未创建。所以只需尝试以下选项：

$(function () {
    var opt = {
        autoOpen:false,
        closeOnEscape:true,
        show:'slow',
        modal:false,
    }; //store your options

    $('#btnpreview').click(function() {
         $('#dialogtest').dialog(opt).dialog("open"); 
         //Pass the options and create the dialog and then open it
    });
})

当部分视图加载到Jquery选项卡时，我尝试打开Jquery对话框时出错

1 个答案: