Jak dát uživateli vědět, že se formulář odeslal bez Flash message?

před 6 lety
asinkan
Člen | 38
+
0
-

Ahoj, mám udělané formuláře přes multiplier. Po stížnostech na reload stránky jsem do toho dal AJAX. Ale ted se mi nezobrazí žádné info a flash message nechci použít, na konci stránky neni vidět. Jakou akci použít, aby uživatel věděl, že se akce provedla? Nechci alert javu, ale jestli jinak nepujde, tak teda alert. (Změna nadpisu tlačítka „uložit“, změna barvy formuláře,… ) Díky moc

protected function createComponentDayForm()
{
    return new Multiplier(function ($dayNumber) {


        $form = new Form;
		$form->addText('datumDne', '');

		$form->addSubmit('send', 'Ulož')
			->onClick[] = [$this, 'oneDayFormSucceeded'];

		$form->getElementPrototype()->class('ajax');

		return $form;
	}
}

public function oneDayFormSucceeded($button)
	{
		$values = $button->getForm()->getValues();
		$this->recordsRepository->setDayinfo($values["dayId"]);

	}

Editoval asinkan (18. 1. 2019 8:06)

před 6 lety
Matey
Člen | 142
+
0
-

Ahoj, tá flashMessage je na to ideálna. To že ju nevidno na konci stránky sa dá riešiť napr toastrom ktorý ju vykreslí tak aby bola na očiach a užívateľsky prívetivo.

před 6 lety
asinkan
Člen | 38
+
0
-

Ten toaster je zbytecne slozitej. Jak zmenit neco na formulari, treba barvu?

před 6 lety
Milo
Nette Core | 1283
+
+1
-

Mimo klasické flash mám na stránce <div class=js-flash>. Ten je nastylový s position: fixed a do něj vkládám flash příchozí přes AJAX + na flash navěsím timeout, takže po chvilce zmizí.

před 6 lety
asinkan
Člen | 38
+
0
-

Super diky.

Udelal jsem to bez ajaxu, tam nevim, jak to propojit:

Css

#infoDiv { /* div top left */
	position: fixed;
	top: 5%;
	left: 5%;
	width: 20%;
	height:10%;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
	background-color:#66ff66;
	border-radius: 10px;
	font-size:150%;
	text-align: center;
	vertical-align: middle;
	font-family: proxima-nova,sans-serif;

}

Java

$(document).ready(function(){

        $.nette.init();

        $(".button").click(function(){
			showInfoDiv();
		});
});

function showInfoDiv() {
	$('#infoDiv').fadeIn(500);
	$("#infoDiv").fadeOut(3000);
}

latte

<div id="infoDiv" style="display:none" >Uloženo <br> (Saved)</div>
před 6 lety
Kcko
Člen | 470
+
+4
-

Java!= JavaScript :)))

před 6 lety
asinkan
Člen | 38
+
-4
-

Kcko napsal(a):

Java!= JavaScript :)))

System.out.print(„Dekuji ti, co bych si bez tebe pocal!“);

Editoval asinkan (18. 1. 2019 18:12)

před 6 lety
Kcko
Člen | 470
+
+4
-

asinkan napsal(a):

Kcko napsal(a):

Java!= JavaScript :)))

System.out.print(„Dekuji ti, co bych si bez tebe pocal!“);

No minimálně nebudeš v nějakém příštím vlákně, kde budeš JS prezentovat jako Javu vypadat jako trouba ;-)

před 6 lety
duke
Člen | 650
+
0
-

Pěkná js knihovna pro ty flash messages je také např. pnotify, viz demo.

před 6 lety
David Matějka
Moderator | 6445
+
0
-

nejlepe se napoj pres nette.ajax.js extension, do payloadu si das neco, co chces zobrazit a v success eventu to z toho prectes a zobrazis

před 6 lety
asinkan
Člen | 38
+
0
-

David Matějka napsal(a):

nejlepe se napoj pres nette.ajax.js extension, do payloadu si das neco, co chces zobrazit a v success eventu to z toho prectes a zobrazis

Super, díky. Konečné řešení (obohacene o regex, nechci aby se to zobrazilo pri neuspechu formulare):

$form = new Nette\Application\UI\Form;
$form->addText('leaving', '')->setHtmlAttribute('placeholder', 'HH:MM')->setAttribute("size", $hourSize)
										->setRequired(false)
										->addRule(Form::PATTERN,"Neplatný formát. (Invalid format)","([0-1]?[0-9]|2[0-3]):[0-5][0-9]");

			$form->getElementPrototype()->class('ajax');
			$form->addProtection();
			return $form;
#infoDiv { /* div top left */
	position: fixed;
	top: 5%;
	left: 5%;
	width: 20%;
	height:10%;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.4);
	background-color:#66ff66;
	border-radius: 10px;
	font-size:150%;
	text-align: center;
	vertical-align: middle;
	font-family: proxima-nova,sans-serif;
	text-shadow: 2px 2px #e0e0d1;
	color:#3d3d29;

}
$(document).ready(function(){

        $.nette.init();

        $.nette.ext('buttonSelector', {
			success: function () {
				showInfoDiv("Uloženo (Saved) ");
			}});

});


function showInfoDiv($msg) {
	$('#infoDiv').html($msg);
	$('#infoDiv').fadeIn(500);
	$("#infoDiv").fadeOut(2000);

}

Editoval asinkan (22. 1. 2019 19:52)