Prekresleni stavu checkboxu

stefic

Zdravim,

chtel bych se zeptat jak je to s prekreslovanim stavu checkboxu.

mam kod javascriptu, ktery me obsluhuje checkbox. Kdyz na nej kliknu tak si ulozim stav checkboxu, na zaklade stavu zmenim barvicku a zmenim SQL dotaz. Po kliknuti se me vse provede spravne a vse probehne jak ma. Jen po prekresleni se me checkbox odskrtne a zustane odskrtly a bily. Musim na nej znovu kliknout a pak uz tak zustane. Pokazde kdyz ho menim poprve ze stavu 0->1 tak se me to prekresli.

Nevite jak udelat aby me po zaskrtni a po vykresleni zustal checkbox furt zaskrtnuty?

Diky moc

<script>
$(document).on( "click","input[name=cbxInternal]", function(){
	var selStr = '';

    localStorage.setItem("checkedInt", $('input[name=cbxInternal]').is(":checked"));
    console.log("Checkbox is checked: "+$('input[name=cbxInternal]').is(":checked") );

    var isChecked = $('input[name=cbxInternal]').is(':checked');

    if ($('input[name=cbxInternal]').is(':checked')) {
    	$("#internal").css("background", "#228B22");
        $('input[name=cbxExternal]').attr("checked",false);
        selStr = "SELECT * FROM [ScreenPaintOutput] WHERE [Status]=90 AND [PaintProductionFlow]='Internal'";
    } else {
        $("#internal").css("background", "#fff");
        selStr = "SELECT * FROM [ScreenPaintOutput] WHERE [Status]=90";
    }
    $.nette.ajax({
    	url: {link ChangeFilterString!},
        cache: true,
        data: {'string': selStr, 'state': isChecked}
    });

});
</script>

<?php
    public function handleChangeFilterString($string, $state)
    {
        var_dump($state);
        $this->section->FilterString = $string;
        $this->tmpFilterString =  $this->section->FilterString;
    }
?>

stefic

to muj dotaz je opravdu tak stupidni?

Dan Hundrt

@stefic

Po kliknuti se me vse provede spravne a vse probehne jak ma. Jen po prekresleni se me checkbox odskrtne a zustane odskrtly a bily.

Jestli to chapu spravne, tak „prekresleni“ myslis refresh page? Pokud ano, tak je potreba nastavit atribut checked pro input v latte.

Jinak nevim jak je to z bezpecnosti, posilat SQL takto z frontendu.

GEpic

Podívej se na nette ajax extensions, musíš ten svůj JS inicializovat po ajaxovém překreslení znovu.

A jak píše @DanHundrt , to SQL nemá na FE co dělat. Do ChangeFilterString signálu lze zaslat v parametru jakýkoliv SQL dotaz. Nezapomeň, že co je na FE, jde zneužít.

stefic

Refresh page jsem snad vyresil tim ze si stavy checkboxu ukladam do local storage.

Ja tam jeste pravidelne volam funkci, ktera me kazdou vterinu a pul kontroluje aktualnost zobrazenych dat z DB.

<script>
$.nette.init();
setInterval(function(){
	$.nette.ajax({
    url: {link changeView!}
	})
}, 1500);

$("input[name=cbxInternal]").prop('checked', "true"==localStorage.getItem("checkedInt"));
$("input[name=cbxExternal]").prop('checked', "true"==localStorage.getItem("checkedExt"));
</script>

takze ve chvili kdy me probehne tento refrest kde volam ajax, tak se me ztrati stav checkboxu.

ty SQL dotazy tam odsud vystipu a kouknu na ty extensions jestli s to pomuze.

Diky za odpovedi

Dan Hundrt

@stefic neznam use case, ale volat interval a ptat se DB, jestli je checkbox aktivni mi prijde obchazeni problemu.

Jestli to chapu spravne, potrebujes docilit toho, ze se po zaskrtnuti checkboxu provede nejaka akce (ulozi / zmeni stav). Tam bych to resil, jak pise @GEpic, nette ajax knihovnou, napsat si kratky JS snippet a posilat treba formular po on change na checkboxu a nasledne prekreslit snippet v nette.

stefic

@DanHundrt Jde to ze tou strankou pouze zobrazuji aktualni stav nejake technologie. Takze zarizeni jako PLC nebo desktopova aplikace meni data v DB a tato stranka ma slouzit hlavne jako informacni, takze kdyz se v DB neco zmeni tak to potrebuju ONLINE zobrazit. Takze nejake refreshovani intervalem je asi nezbytne (alespon tedy z meho pohledu)

@GEpic koukal jsem na ty Extensions a jestli tobu dobre rozumim, tak to jsou volitelne eventy, ktere se obslouzi na zaklade toho jak dopadne volani $.nette.ajax(). Napsal si abych inicializoval JS po ajaxovem prekresleni znovu. Nemohl bys me jen nastinit jak to vypada v praxi? Trefil jsem se aspon fylozoficky tim prikladem dole?

Skoda ze k tomu nejsou nejake priklady.
Zkousel jsem to takto a moc to nezafungovalo.

<script>
setInterval(function(){
	$.nette.ajax({
			url: {link changeView!}
		})
}, 1500);


$.nette.ext('moje-jmeno-extension', {
	success: function () {
		$("input[name=cbxInternal]").prop('checked', "true"==localStorage.getItem("checkedInt"));
			if ($('input[name=cbxInternal]').is(':checked')) {
				$("#internal").css("background", "#228B22");
			}
	}
};
</script>

Diky

CZechBoY

Porad muzes zkusit websockety. Zalezi jestli muzes menit aplikaci, ktera vklada data do db.