j-Window

jComponent 20 · jcomponent@20 component Exemplo carregado com jComponent 20

O componente move o conteúdo deste componente sob a tag <body> (por causa da posição)

Configuração:

title {String} Título da janela
if {String} condição para uma exibição da janela, é comparado com o valor dentro de path
icon {String} Total.js icônicos
reload {String} liga-se a um global function(window_component) e é executado se o formulário estiver mostrando
enter {Boolean} (opcional) capta automaticamente a chave enter e realiza o envio (default: false)
autofocus {Boolean/String} (opcional) pode focar uma entrada. String === jQuery selector para a entrada
default {String} (opcional) um alias curto para DEFAULT(default, true)
closebutton {Boolean} (opcional) pode esconder o botão x (default: false)
zindex {Number} (opcional) pode afetar o índice z (default: 12)
scrollbar {Boolean} permite uma barra de rolamento personalizada (default: true)
scrollbarshadow {Boolean} opcional, permite uma sombra na barra de rolamento (default: false)
NEW closeesc {Boolean} fecha o formulário quando o usuário pressiona a chave ESC
NEW independent {Boolean} fechamento não depende da condição de acordo com o caminho

Bom para saber:

Uma nova versão deste componente suporta uma avaliação dinâmica do conteúdo de <script type="text/html">. O exemplo abaixo contém um script com HTML e o componente avalia o conteúdo se o j-Window será exibido (apenas uma vez).

<ui-component name="window" path="path" config="config">
	<script type="text/html">
		A CONTENT
	</script>
</ui-component>

Use-o com <ui-component name="window">Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço DEF.fallback (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença MIT.

example.html

<ui-component name="window" path="common.window" config="if:user;title:Title of this window" class="hidden">
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
	<br />
	<div style="padding:20px">SOME CONTENT</div>
</ui-component>

<script>
	var common = {};
	common.window = 'user';
</script>