Can I append new data to a snippet using AJAX?

netteman

Hi all,

this code is working – the value of $this->date is changed in 5s intervals by AJAX. Now I'd like to change the behaviour: I'd like to keep the previous dates in DOM and append the new date to div with dates. Is it possible using snippets? Thanks :)

(I know I could use for example https://api.nette.org/…esponse.html in another presenter that would get what I'd need and jQuery could append the data but snippets seem to be a “cleaner” solution)

    public $date;

    public function handleChangeDate()
    {
        $this->date = date("Y-m-d H:m:s", strtotime("now"));

        $this->template->date = $this->date;


        if ($this->isAjax()) {
            $this->redrawControl('changeDate');
        }
    }


    public function renderDefault()
    {
        $this->date = date("Y-m-d H:m:s", strtotime("now"));

        $this->template->date = $this->date;
    }

{block content}
<div>
    {snippet changeDate}
        {$date}
    {/snippet}

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="{$basePath}/js/nette.ajax.js"></script>
<script type="text/javascript">
    $(document).ready(
        function() {
            setInterval(function(){
                $.nette.ajax({
                    url: '?do=changeDate'
                })
            }, 5000);
        });
</script>

{/block}

Last edited by netteman (2016-06-17 21:28)

erikbalog

Hi yes use data-ajax-append in snippet

netteman

Thanks, man!

I got this working

<div n:snippet="changeDate" data-ajax-append="true">
        <div>{$date}</div>
</div>

Is it possible to use something like {snippet changeDate data-ajax-append=“true”} (I've been experimenting with it but it wasn't working) or do I have to always use n:snippet if I want to add data-ajax-append=“true” to the html code?

Last edited by netteman (2016-06-19 14:31)