JQuery UI - вызов Highlight/Error

Извините, если это слишком очевидно, но я не могу найти ни одного правильного ответа в любом месте...

Есть ли способ разместить сообщение подсветки/ошибки, подобное тем, которые находятся в правом нижнем углу этой страницы: http://jqueryui.com/themeroller/, просто вызвав функцию jquery ui?

Я проверил исходный код, но не могу найти ответ... Они жестко кодируют html?

Спасибо

----------------------------------------- РЕШЕНИЕ ---------------------------------------

jQuery: (создайте новый файл whatever.js и разместите там следующий код

$(document).ready(function(){

if($("div.error")[0]){
    createError($("div.error"));
}

if($("div.notice")[0]){
    createHighlight($("div.notice"));
}
});

//functions start
function createHighlight(obj){
    obj.addClass('ui-state-highlight ui-corner-all');
    obj.html('<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right:.3em;"></span>'+obj.html()+'</p>');
}

function createError(obj){
    obj.addClass('ui-state-error ui-corner-all');
    obj.html('<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right:.3em;"></span>'+obj.html()+'</p>');
}

HTML: Просто создайте div, которые вы хотите разместить, например:

<div class="error"><b>ERROR:</b> The message goes here</div>

или для уведомлений:

<div class="notice"><b>NOTICE:</b> The message goes here</div>

вы можете затем стилизовать классы с помощью css.

Надеюсь, это поможет кому угодно.

----------------------------------------- РЕШЕНИЕ ---------------------------------------

Ответ 1

Нет функции jQuery UI для размещения на странице ошибки; однако вы можете применить класс ошибок с помощью jQuery к таким элементам:

$('#el').addClass('ui-state-error ui-corner-all'); // Rounded corners
$('#el').addClass('ui-state-error'); // Squared Corners

Надеюсь, это поможет!

Ответ 2

Согласно документации, после загрузки Jquery UI css вы можете использовать несколько классов:

http://jqueryui.com/docs/Theming/API

Например, здесь поле предупреждения определяется следующим образом:

<div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
  <p>
    <span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
    <strong>Alert:</strong>
     Sample ui-state-error style.
  </p>
</div>