zavření dialogu s formulářem po zkontrolování validace

Radkos

Ahoj, mám dialog s formulářem. Po kliknutí bych potřeboval dialog zavřít pouze, pokud jsou všechna políčka Nette form vyplněna dobře. Nemáte nějaké nápady?

CZechBoY

Co pouzivas na validaci a odeslani formu ajaxem? Jestli klasicky nette.ajax.js tak můžeš vytvorit bud extension nebo udelat primo cele $.nette.ajax volani po svem.

Radkos

Klasický nette.ajax.js, přes extension mi to nefungovalo a s $.nette.ajax mi to zase nezkontroluje validaci.

CZechBoY

Tak to děláš asi něco špatně :-) pošli tvoje pokusy a co přesně nefungovalo.

Mortisson

Neheldáš něco takového:

<script>
	$("#submitBtn").on("click", function() {
		if (Nette.validateForm(event.currentTarget)) {/* zavření modalu */}
	}
</script>

Radkos

Problém byl v tom, že při pokusech o zprovoznění jsem uplně zapomněl přidat onSuccess. Všechno funguje, jen mi to občas vrátí celou stránku a ne payload close(když jednou neprojde validace).
Zde mám šablonu:

<style type="text/css">
.dialog-content{
	display: none;
	text-align: center;
}
</style>
<script type="text/javascript">
$(function(){
	$("#btn-openDialog").click(function(){
		openDialog();
	});
});
function openDialog(){
	$("#div-dialog").dialog({
		title: "Dialog",
		height: "400",
		width: "400",
		modal: true,
		show: "blind",
		position: { my: "center bottom", at: "center center"},
		open: function(){
		},
		buttons: {
			"Odeslat": function(){
                $("#frm-testForm").submit();

				$.nette.ext({
					success: function(payload){
						console.log(payload);
						if (payload.close){
							$("#div-dialog").dialog("close");
							console.log("closing...");
						}
					}
				});
			}
		}
	});
}

</script>
<button id="btn-openDialog">Dialog</button>
<div id="div-dialog" class="dialog-content">
	<form n:name="testForm" class="ajax">
    	Od: <input n:name="dateFrom" class="datepicker"><br>
    	Do: <input n:name="dateTo" class="datepicker"><br>
    	Text:<br><textarea n:name="text"></textarea>
    </form>
</div>

A zde presenter:

protected function createComponentTestForm(){
        $form = $this->testFormFactory->create();
        $form->onSuccess[] = [$this, "testFormSucceeded"];
        return $form;
    }

public function testFormSucceeded(UI\Form $form, $values)
        if($this->isAjax()) {
            $this->payload->close= TRUE;
            $this->sendPayload();
        }
    }

Editoval Radkos (15. 8. 2017 20:31)