Redraw snipettu přes handle použítím $.nette.ajax

kralik
Člen | 229
+
0
-

Ahoj,
prosím o pomoc při AJAXu a překreslování snippetů při používání další JS knihoven.
Nějaké best practice jak správně načítat další JS knihovny pro používání s Nette Ajax.

Pro notifikaci flashmessage používám toast.min.js.

Mám tabulku s daty, které edituji přes modální okno. Toto vše funguje.

Rád bych po úspěšné editaci notifikoval uživatele přes toast. A zde narazím.

šablona @layout.latte

...
{snippet flashMessage}
	{ifset $flashes}
		{foreach $flashes as $flash}
				{if $flash->type == 'warning'}
					<script>
						$.toast({
							text: '{$flash->message|noescape}',
							icon: 'warning', // Type of toast icon

						})
					</script>
		{/foreach}
	{/ifset}
{/snippet}
...

v konkrétním latte

...
$('.btnSaveDod').on('click', function() {
        var formData = $("#editDod");
        var data = JSON.stringify(getFormData(formData));

        $.nette.ajax({
            type: "POST",
            dataType: "json",
            url: {link save2dod!},
            data: {"id": doid,"data": data }
        });

    });
...

v handleSave2Dod

...
$this->flashMessage('Data byla uložena');
$this->redrawControl('flashMessage');
...

Při $this->redrawControl(‚flashMessage‘)

TypeError: $.toast is not a function

Zkoušel jsem to i přes snippetArea, ale výsledek stejný.

Moc díky

uživatel-p
Člen | 553
+
0
-

Můžeš si vytvořit nette ajax extension, nebo můžeš použít ajaxovou metodu .done() například:

$.ajax({
  url: "https://fiddle.jshell.net/favicon.png",
  beforeSend: function( xhr ) {
    xhr.overrideMimeType( "text/plain; charset=x-user-defined" );
  }
})
  .done(function( data ) {
    if ( console && console.log ) {
      console.log( "Sample of data:", data.slice( 0, 100 ) );
    }
  });

Atd. Možností je spousta. Cpát ale takto JS přímo do HTML není OK. Důležitý je taky sled událostí, jak jdou za sebou, takže jestli tento kód je před načtením toast.min.js, tak je to jasný.

Doporučuju jedno z řešení výše a kód dát až za načtení toast.min.js mělo by to jet.