Diskuze: Přidavání řádku ve formuláři

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

Aktivity

michal Čepelák

Člen

michal Čepelák:30.6.2017 12:42

Zdravím,
pokud chci udělat formulář ve kterém budu mít sloupce id,id_tiket,datum,seriové číslo, soucastka, cena.
Tak id_tiket,datum,seriové čislo bude stejné ale soucastka a cena by se přidavali řádky.
musím použit javascript abych mohl přidavat další řádky nebo to jde i přes php?
Do databáze to uložím tak že kolik budu mít řádku na tolika samostatných řádtcích to bude v databázi, akorad že všechny řádky budou mít stejné id_tiket a podle tohoto id to budu přes pole zobrazovat.
Děkuji za rady

Odpovědět

30.6.2017 12:42

David Hynek

Tvůrce

David Hynek:30.6.2017 13:19

Přes PHP to můžeš přidat pouze znovunačtením stránky. Tedy ideální je spíš javascript.

Nahoru Odpovědět

30.6.2017 13:19

Čím víc vím, tím víc věcí nevím.

Jakub Žák

Člen

Jakub Žák:2.7.2017 13:48

Přesně tak - pokud Ti nevadí, že stránku budeš načítat celou znovu, tak stačí použít PHP, jinak doporučuju Javascript a odesílat to AJAXem.

Btw, ten databázový návrh se mi zdá dost nešťastný, proč nemít spíš jednu tabulku s "tikety" a v další tabulce přiřazení součástek k tiketům?

Nahoru Odpovědět

2.7.2017 13:48

Kuba je ajťák. Buď jako Kuba.

michal Čepelák

Člen

michal Čepelák:2.7.2017 23:42

Databáze byla v plánu jak si říkal ale s tím javascriptem to bude horší v tom jsem ještě moc nezačal dělat nebyl by někde příklad jak to udělat?
Děkuji moc

Nahoru Odpovědět

2.7.2017 23:42

Peter Trcka

Člen

Peter Trcka:6.7.2017 10:39

Ahoj, asi by som to riešil takto:
Použi túto JS funkciu:

<script type="text/javascript">
function add_row() {
  var n = $( ".product_row" ).length;

  if (n>20) alert('Momentalne nie je mozne pridat viac ako 20 produktov');
  else {
        // sem vlozis kod, ktory sa ma pridat
        var row = '<div class="product_row">' +
                                        '<input type="text" name="row'+n+'" id="row'+n+'" class="tvoja_class"/>' +
                          '</div>';

        // pridanie kodu na koniec do obalovacieho divu
        $("#container_products").append(isbn);
  }
}
</script>

a k tomu si musis vytvoriť tlačítko na pridanie zaznamov. Tlačítko, ktorým spustíš javascript

<div class="button_add" onclick="add_row()">&nbsp;</div>

Daj prosím vedieť, či ti to dáva zmysel.

Editováno 6.7.2017 10:39

Nahoru Odpovědět

6.7.2017 10:39

Miskyns

Člen

Miskyns:6.7.2017 20:17

Já bych to udělal tak, jak to říká Jakub Žák.

Postup
Vytvoříš si funkci/skript v JavaScriptu, který bude reagovat na tlačítko ať už html element tagem

<button onclick="funkce();">Přidat</button>

nebo normálním

$("button").on('click', funkce(););

Po kliknutí ti to appendne nový input, do kterého budeš moct napsat podle tebe další součástku a cenu.
O zpracování a uložení do databáze se postará Ajax.

$.ajax({
        url: 'http://example.com'',
        method 'POST',
        data: 'soucastka=...&cena=...',
        ...
});

Pokud by jsi chtěl kousek kódu k navedení na správnou trastu "aby jsi se mohl odrazit", napiš...

Editováno 6.7.2017 20:20

Nahoru Odpovědět

6.7.2017 20:17

Proč se to učit, když můžeš použít GOOGLE...

michal Čepelák

Člen

michal Čepelák:6.7.2017 20:29

Čau pokud by bylo možno část kódu tak bych byl rad děkuji moc

Nahoru Odpovědět

6.7.2017 20:29

Miskyns

Člen

Miskyns:6.7.2017 20:40

V HTML by formulář vypadal nějak takto

<div id="formular">
    <h2>Formulář součástky</h2>
    <div class="soucastky">
        <input type="text" placeholder="Součástka" /><br />
        <input type="text" placeholder="Cena" /><br />
    </div>
    <button onclick="appendSoucastka();">Přidat</button>
    <button onclick="zpracujFormular();">Zpracovat</button>
</div>

a v JS, takhle

function appendSoucastka() {
    var soucastka_input = '<input type="text" placeholder="Součástka"/><br />'
                        + '<input type="text" placeholder="Cena" />';

    $("#formular .soucastky").append(soucastka_input);
}

function zpracujFormular() {
    ...
    $.ajax({
        url: "http://example.com/formular.php",
        method: "POST",
        data: "...",
        success: function() {
            console.log("Data zpracována");
        }
    });
}

Je to jenom nástřel, číslování součástky a ceny (inputu), by jsis měl dodělat, ale appendování funguje Ten ajax vypadá podobně.
Jak říkám dodělej zpracování dat z inputu a odeslání přes ajax, ať už POSTem nebo GETem...

Editováno 6.7.2017 20:43

Nahoru Odpovědět

6.7.2017 20:40

Proč se to učit, když můžeš použít GOOGLE...

Jakub Žák

Člen

Jakub Žák:8.7.2017 21:54

Zde je ukázka, jak by to zhruba mohlo jít udělat.

Pozor! Není to kód určený k použití, pouze jednoduchý nástřel, jak by to zhruba šlo udělat, neřeší to velkou část situací, které mohou nastat a je to narychlo napsaný bastl!

Nahoru Odpovědět

8.7.2017 21:54

Kuba je ajťák. Buď jako Kuba.

Jakub Žák

Člen

Jakub Žák:8.7.2017 22:03

Jo a je to napsané tak, že by měl jít použít zdejší databázový wrapper ze seriálu o PHP.

Nahoru Odpovědět

8.7.2017 22:03

Kuba je ajťák. Buď jako Kuba.

Matúš Petrofčík

Tvůrce

Matúš Petrofčík:8.7.2017 22:10

Prečo v init.php posielaš tie hlavičky?

header('Content-Type: text/html; charset=utf-8');
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");

Nahoru Odpovědět

8.7.2017 22:10

obsah kocky = r^2 ... a preto vlak drnká

Jakub Žák

Člen

Jakub Žák:8.7.2017 22:14

Jsou tam zbytečný (smazáno.)

Nahoru Odpovědět

8.7.2017 22:14

Kuba je ajťák. Buď jako Kuba.

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 12 zpráv z 12.