在jquery模式对话框中定义ui-widget-content的边框

时间:2013-10-18 14:09:11

标签: c# jquery html5 css3 asp.net-mvc-4

我在一个页面上有两个模态。第一个边框在jquery.ui.theme.css类的.ui-widget-content文件中定义。

是否可以附加样式属性并覆盖css文件定义的样式属性?

我希望第二个模态具有不同的颜色边框。

这是我的div:

<div id="dialog-modal" title="Discharge Warning">
    <p>Are you sure you want to discharge this Patient</p>
</div>

这是我的第二个模式的jQuery:

$('#dialog-modal').dialog(
{
    modal: true,
    autoOpen: false,
    resizable: false,
    draggable:false,
    show:
    {
        effect:"blind",
        duration:500
    },
    buttons: 
    {
        'discharge': 
        {
            text: 'Discharge Patient',
            click: function () { $('#DischargeReferralForm').submit(); },
            class: 'btn purple',
            style: 'font-family: "Segoe UI", Helvetica, Arial, sans-serif'
        }
    },

});

$('.ui-dialog-buttonpane')
    .find('button:contains("Discharge")')
    .prepend('<i class="icon-ok"></i>');

$('#DischargeMgs').click(function () { $("#dialog-modal").dialog("open"); });

FYI:页面检查跟踪的颜色是否回到ui-widget-content类。

1 个答案:

答案 0 :(得分:2)

我仔细查看了 jQuery UI Dialog individual CSS styling 并添加到我的css文件中:

.ui-dialog-content1
{
    border-color:#6d1b81 !important;
}

和我的jquery文件:

dialogClass: 'ui-dialog-content1'