[HTML][jQuery] dodanie wierszy i przeliczenie Opcje

[lustfingers]

W ramach nauki programowania zacząłem pisać formularz który może pomóc mi wykonywać codzienne obliczenia, znudził mi sie excel a jak to ogarnę to spróbuję jeszcze dopisać zapis i odczyt z bazy danych.

Mam to:
https://jsfiddle.net/mq3da7kb/3/

[HTML] pobierz, plaintext 
Weight: <input type="text" name="weight" id = "weight" value="" /><br/><br/>
 
 
Line: <input type="text" name="percent" id = "percent" value="" />
<input type="text" name="additional" id = "additional" value="" />
Line total: <span class="total"></span>
<br/>+<br/>
<p>Total percent (from #percent): </p>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
$("#additional, #percent, #weight").on('keyup',function(){
        var total= $("#weight").val() * $("#percent").val() / (100 -$("#additional").val()) 
    $(".total").html(total.toFixed(2));
})
 
[HTML] pobierz, plaintext 

Wiersz Line ma sie powielać gdy przyciśniemy na + natomiast Weight ma występować tylko raz ponieważ będzie identyczny dla każdego Line, a Total percent ma zliczać z każdego Line wartości.

Potrzebuje nakierowania jak dodać możliwość powielania wierszy? Za pewne będę musiał przerobić skrypt i dodać jakąś inkrementacje dla każdego id żeby dobrze zliczało każdą linię oddzielnie? Macie może jakieś przykłady takiego formularza albo coś na czym mógłbym się uczyć?

[pmir13]

Ustawiasz pierwszą linię w jakimś divie, wrzucasz go do zmiennej np linesdiv, przycisk z plusikiem też niech ma jakiś id np addline, robisz z niego link i dodajesz coś typu: ( i to licznik linii )

[HTML] pobierz, plaintext 
        $("#addline").live("click", function() {
                $("<p> tutaj html nastepnej linii </p>").appendTo(linesdiv);
                i++;
                return false;
        });
[HTML] pobierz, plaintext 

Oczywiście potem musisz jeszcze zliczać ze wszystkich linii.

Ten post edytował pmir13 15.02.2017, 00:03:20

[viking]

@pmir13: Halo, halo. Jest 2017 rok, live już dawno nie istnieje.
Możesz też klonować element - clone();

A przede wszystkim to powinieneś uporządkować html. id nie mogą być dla linii bo będą się powtarzać, zamień na klasu. weight może pozostać. plusa opakuj w jakiś dodatkowy element (może button) żeby podpiąć zdarzenie.

https://jsfiddle.net/mq3da7kb/4/

Ten post edytował viking 15.02.2017, 08:24:32

[lustfingers]

Dzięki za pomoc, @viking trochę przerobiłem to co napisałeś. Wsadziłem wszystko w form dodałem ukrytego inputa który ma sie powielać zamiast ostatniego i teraz próbuję dopisać obsługę zliczania ale nie wiem czemu zlicza mi tylko z pierwszego inputa: https://jsfiddle.net/mq3da7kb/6/

[viking]

Inputy są dodawane dynamicznie a ty wybierasz jeden przed dodaniem dynamicznie kolejnych. Dlaczego delegate skoro jest to przestarzała metoda?

Poza tym już to wszystko masz. Po co ponownie przypinać kolejne identyczne prawie zdarzenia (change jest na utratę focusa)?
https://jsfiddle.net/mq3da7kb/7/

Ten post edytował viking 15.02.2017, 20:53:24

[lustfingers]

Dzięki za pomoc mam pytanie odnośnie struktury pliku czy da się to łatwo zapisać do bazy danych? Generalnie chce zrobić opcje dodawania formularzy i ich zapisu do bazy, każdy formularz może posiadać nieokreśloną liczbę linii i trzeba je jakoś jeszcze rozróżnić żeby się to później dało odczytać.

[Lord]

Dzięki za pomoc mam pytanie odnośnie struktury pliku czy da się to łatwo zapisać do bazy danych? Generalnie chce zrobić opcje dodawania formularzy i ich zapisu do bazy, każdy formularz może posiadać nieokreśloną liczbę linii i trzeba je jakoś jeszcze rozróżnić żeby się to później dało odczytać.

Jezeli chodzi ci o to zeby ustawienia formularzy (jakie maja pole itd) miec w bazie to możesz zrobic tabele w ktorej masz

fomularz

[HTML] pobierz, plaintext 
id ( w relacji z tabela_pol.id_formularza)
method
action
[HTML] pobierz, plaintext 

tabela_pol

[HTML] pobierz, plaintext 
id
id_formularza
typ_inputu
value
[HTML] pobierz, plaintext 

[lustfingers]

Chodzi mi o to że klikając na znak + tworzy się kolejne inputy które są identyczn a różnią się tylko wartością, oraz tym że nigdy nie wiadomo z góry ile ich będzie więc raczej nie będzie to prosty zapis do bazy gdzie z góry mogę sobie zdefiniować jakie to pola.

[viking]

Nie ma żadnej rożnicy czy pole jest jedno czy 20. Będziesz miał te dane w POST. Może najpierw "na sucho" przećwicz podstawowe operacje na bazie.

[lustfingers]

Próba zapisu do bazy nie powiodła się sukcesem z dwóch powodów, pierwszy jest taki że total nie jest inputem więc w bazie jest zapisywany NULL, a drugi powód jest taki że przy kilku liniach jest zapisywana tylko jedna czyli ta z ostatniego li.

Kod który wykorzystuje do zapisania w bazie wygląda następująco:

[PHP] pobierz, plaintext 
<?php
 
try
{
  $pdo = new PDO('mysql:host=localhost;dbname=zpe5', 'root', '');
  $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
  $pdo->exec('SET NAMES "utf8"');
}
catch (PDOException $e)
{
  $error = 'Nie można nawiązać połączenia z serwerem bazy danych.';
  //include 'error.html.php';
  exit();
}
 
if (isset($_POST['weight']) OR isset($_POST['percent']) OR isset($_POST['additional']) OR isset($_POST['income_sum']) OR isset($_POST['total']))
{
  try
  {
    $sql = 'CREATE TABLE IF NOT EXISTS `frominput` (
		weight INT(10),
		percent float,
		additional float,
		income_sum float,
		total float
		);
		INSERT INTO frominput SET
                weight = :weight,
		percent = :percent,
		additional = :additional,
		income_sum = :income_sum,
		total = :total';
    $s = $pdo->prepare($sql);
	$weight = $_POST['weight'];
	$percent = $_POST['percent'];
	$additional = $_POST['additional'];
	$income_sum = $_POST['income_sum'];
	$total = $_POST['total'];
	$s->bindValue(':weight', $_POST['weight']);
	$s->bindValue(':percent', $_POST['percent']);
	$s->bindValue(':additional', $_POST['additional']);
	$s->bindValue(':income_sum', $_POST['income_sum']);
	$s->bindValue(':total', $_POST['total']);
	$s->execute();
  }
  catch (PDOException $e)
  {
    $error = 'Błąd przy zapisie: ' . $e->getMessage();
    //include 'error.html.php';
    exit();
  }
 
  //header('Location: .');
  //exit();
}
 
?>
[PHP] pobierz, plaintext 

[Lord]

A możesz pokazać co masz w momencie zapisu w POST?

Jesteś pewien, że każde pole jakie przekazujesz ma innego name?

[viking]

Po co wywołujesz create dla każdego odwołania? Nie ma też sensu przypisywanie zmiennych post do zmiennych skoro nigdzie tego nie używasz później. Oczywistym jest też że skoro wszystkie mają takie samo name to będą nadpisane. Myślałem że trochę pomyślisz sam i wstawisz tam np tablicę wartości [].

[lustfingers]

Ok, teraz są przekazywane w tablicy tylko jak to zapisać do bazy? Gdy próbuję tak:

[PHP] pobierz, plaintext 
if (isset($_POST['weight']) OR isset($_POST['percent']) OR isset($_POST['additional']) OR isset($_POST['income_sum']) OR isset($_POST['total']))
{
  try
  {
	$percent = $_POST['percent'];
	$additional = $_POST['additional'];
	foreach($percent as $percent):
        foreach($additional as $additional):
        $sql = 'CREATE TABLE IF NOT EXISTS `frominput` (
		weight INT(10),
		percent float,
		additional float,
		income_sum float,
		total float
		);
		INSERT INTO frominput SET
		percent = :percent,
		additional = :additional';
        $s = $pdo->prepare($sql);
	$s->bindValue(':percent', $percent);
	$s->bindValue(':additional', $additional);
	$s->execute();
	endforeach;
        endforeach;
  }
[PHP] pobierz, plaintext 

To zapisuje sie do bazy tylko wartości z additional natomiast te z percent już nie.

W powyższym kodzie zamieniłem to

[PHP] pobierz, plaintext 
$percent = $_POST['percent'];
$additional = $_POST['additional'];
foreach($percent as $percent):
foreach($additional as $additional):
[PHP] pobierz, plaintext 

na to

[PHP] pobierz, plaintext 
$percents = $_POST['percent'];
$additionals = $_POST['additional'];
foreach($percents as $percent):
foreach($additionals as $additional):
[PHP] pobierz, plaintext 

I teraz zapisuje do bazy natomiast nie w sposób chciany gdy np. uzupełnię 2 linie + trzecia linia ukryta to w bazie powinno być 3 wpisy natomiast jest ich 9.

Powinno być np.:

|0|0|- ukryty input
|1|3|- wartości z inputa 1
|2|4|- wartości z inputa 2

a robi mi kombinacje wszystkich:

|0|0|
|0|3|
|0|4|
|1|0|
|1|3|
|1|4|
|2|0|
|2|3|
|2|4|

[viking]

No i słusznie. Nauczyłeś się jak działa podwójny foreach. Naprawdę, pomyśl trochę. Nikt nie będzie za ciebie ciągle kodu pisał. Ja bym tam wstawił 1 for i wykorzystał licznik.

[lustfingers]

EDIT.

Ogarnąłem swój błąd i idę dalej, zapis zrobiłem tak:

[PHP] pobierz, plaintext 
$values = array();
    for($i=0 ;$i < count($_POST['percent']); $i++) {
        $values[] = '("' . $_POST['percent'][$i] . '","' . $_POST['additional'][$i] . '")';
    }
    $sql = "CREATE TABLE IF NOT EXISTS `frominput` (
		//weight INT(10),
		percent float,
		additional float,
		//income_sum float,
		//total float
		);
		INSERT INTO frominput (percent, additional) VALUES " . implode(',', $values);
        $s = $pdo->prepare($sql); 
	$s->execute();
[PHP] pobierz, plaintext 

Pytanie jeszcze odnośnie zamiany w inpucie znaku przecinka na kropkę gdy dodam w inpucie onChange="this.value=this.value.replace(/,/g, '.');" wtedy wynik jest NaN.

[viking]

[PHP] pobierz, plaintext 
    for($i=0 ;$i < count($_POST['percent']); $i++) {
[PHP] pobierz, plaintext 

Podstawowy błąd początkującego. Przy każdym przebiegu pętli liczysz od nowa elementy tablicy:

[PHP] pobierz, plaintext 
    for($i=0, $count = count($_POST['percent']) ;$i < $count; $i++) {
[PHP] pobierz, plaintext 

... onChange="... Po co pchasz w html zdarzenia skoro masz je ładnie wydzielone? Żeby później szukać w szablonach kodu js? https://jsfiddle.net/mq3da7kb/8/