Diskuze: Vyprázdnění proměnných při ajaxovém požadavku | Nette

Naučíme tě pracovat na home-office.

Zjistit více...

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Petr Nečas

Člen

Petr Nečas:28.7.2017 9:58

Ahojte, zkouším si naprogramovat jednoduché CMS využívající texy. Abych uživateli zpříjemnil využívání texy, tak je možnost vyvolat na server ajaxový požadavek, který následně překreslí snippet a zobrazí se náhled článku. Nicméně mi příjde zbytečné, aby se o překreslování zase zpět do možnosti editace staralo PHP. Tak to zkouším vyřešit na straně JS. Nejprve tu uvedu šablonu, abyste se měli čeho chytit.

    {snippet show}
        <div id="area">
            {if !isset($show)}
                <label for="inputContent" class="sr-only">{_form.article.content}</label>
                {input $control['createArticleForm']->getComponent('content')} // textArea pro zadávání obsahu článku
            {else}
                <div id="edit-area" class="form-textArea">
                    {$show|texy|noescape} // text převedený s texy z textArea výše
                </div>
            {/if}
        </div>
    {/snippet}
    <button n:name=submit class="btn btn-lg btn-primary btn-block" type="submit">{_form.article.submitCreate}</button>
    {input articleId}
</form>
    <div id="buttons">
        {snippet buttons}
            {if !isset($show)}
                <button id="btn-show" onclick="btnClick()">{_form.article.show}</button>
            {else}
                <button id="btn-edit" onclick="editPost()">{_form.article.edit}</button>
            {/if}
        {/snippet}
    </div>

Nejprve si v JS vyjádřím proměnné, do kterých uložím hodnoty před přepsáním

var area;
var textAreaVal;
var btnText;

Dále si před překreslením ukládám potřebné věci následovně.

function btnClick() {
    area = $('#area').html();
    textAreaVal = $('#inputContent').val();
    btnText = $('#btn-edit').text();
    alert(btnText);  // Zde mi to vrací prázdný text, nevíte proč?
    show(); // ajax request
}

A když chce uživatel upravovat článek.

function editPost() {
    $('#area').html(area);
    $('#buttons').html('<button id="btn-show" onclick="btnClick()">' + btnText + '</button>');
    $('#btn-show').text(btnText);
    $('#inputContent').val(textAreaVal);
}

Problém je v tom, že mi text v buttonu nic nevrací :/ .
Ale víc mě znepokojuje to, že když si jednou nechám zobrazit náhled a přepnu se zpět do editace, tak to jde v pohodě (když nepočítám ten název buttonu), ale když poté akci zopakuji (takže zobrazit náhled a zpět do editace), tak je textArea s obsahém článku prázdná.
Kdybyste někdo chtěli, tak vám ten projekt můžu hodit na git.

Odpovědět

28.7.2017 9:58

Petr Nečas

Člen

Petr Nečas:28.7.2017 10:04

Ještě bych připsal, že když si podruhé nechám zobrazit náhled, tak btn, který se má zobrazit také nemá žádný text :/

Editováno 28.7.2017 10:05

Nahoru Odpovědět

28.7.2017 10:04

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.

Nejčastěji vyhledáváné

Diskuze: Vyprázdnění proměnných při ajaxovém požadavku | Nette