ugrás a tartalomhoz

Eseménykezelés

bvc · 2015. Feb. 7. (Szo), 09.42
Sziasztok!

Hogy lehetne egy HTML textbox onchange eseményekor PHP függvényt futtatni?
Konkrétan adott egy textboxokból kialakított datagrid, és mint az excelben cellaváltáskor szeretném a friss adatokat mysql táblába lementeni. Hogyan lehetne ezt egyszerűen?
Köszi
 
1

Olvass

Hidvégi Gábor · 2015. Feb. 7. (Szo), 10.02
2

Doksik

T.G · 2015. Feb. 7. (Szo), 10.05
JavaScript-tel Ajax hívás segítségével ezt könnyen meg lehet oldani.
Ha például JQuery-vel szeretnéd megoldani, akkor a változás esemény lekezelésére itt találsz példát:
http://api.jquery.com/change/

Az Ajax hívásra meg itt találsz példát:
http://api.jquery.com/jQuery.post/

E két link alapján el tudsz indulni. Ha meg nem szeretnél JQuery-t használni, mert azt túl nagynak találod, akkor igazából JS keretrendszer nélkül is megoldható mindez. Erre meg itt egy oldal, ahol összeszedték, hogy az egyes JQuery megoldások miként oldhatóak meg natív JS-sel:
http://youmightnotneedjquery.com/
3

Köszönöm

bvc · 2015. Feb. 7. (Szo), 21.36
Köszönöm, átolvasom. JQuery lehet benne. :)

----
Nos, őszintén szólva nem jutottam előrébb. Tipikus jQuery példák voltak. Arra nem tér ki, hogyan lehet eseménybe közvetve sql műveletet tenni. Pedig vagy PHP függvényt kellene meghívnom az eseményben, az már tudná, vagy az onchange javascriptnek kellene elvégezni az adatbázis műveletet, ami gondolom nem támogatott. Jó, láttam, van valami mysql-js bővítmény, de megint új, bonyolult dolgot beletenni és megtanulni ezért? Nem is értem miért nincs erre valami egyszerű megoldás...
Az a fránya esemény miért csak javascriptet fogad el? Milyen egyszerű lenne PHP-t meghívni és kész.
Majd még benézek, valaki csak megoldotta már pofon egyszerűen ezt a problémát! :)
4

Ne feledd, hogy a Javascript

bamegakapa · 2015. Feb. 7. (Szo), 21.57
Ne feledd, hogy a Javascript a kliensoldalon fut, a böngészőben, míg a PHP a szerveren. Ezért nincs erre egyszerű megoldás. Javaslom tanulmányozásra a HTTP protokollt, illetve itt is van sok hasznos tudnivaló: http://programmers.stackexchange.com/questions/171203/what-are-the-differences-between-server-side-and-client-side-programming

Ne akarj SQL-t futtatni Javascriptből, biztonság szempontjából is botor dolog lenne. Küldd el az adatokat a szervernek (AJAX), ott írd meg a kódot ami fogadja és elvégzi a szükséges műveleteket. Erre van számtalan technika és hozzáállás.
5

OKÉ

bvc · 2015. Feb. 8. (V), 12.10
Már látom, ezt csak az XMLHttpRequest tudja megoldani. Nagyon úgy néz ki, tényleg nincs rá egyszerű, egy programsoros megoldás. Még morgolódok egy kicsit, aztán próbálkozom megcsinálni...
Köszi
6

Image, script

Poetro · 2015. Feb. 8. (V), 16.26
Azért mással is meg lehet oldani, csak nem biztos, hogy érdemes. Lehetne például egy képet betöltetni, ami elvégzi az adatbázisod mentését. Vagy egy script elemet. Ezekkel is meg lehet oldani, csak nem elegáns, ráadásul veszélyes is, mivel a változók GET-ben közlekednek, ami biztonsági kérdéseket feszeget.
7

Morgolódni felesleges, ha

bamegakapa · 2015. Feb. 8. (V), 20.12
Morgolódni felesleges, ha megérted, hogy működik a web, logikus lesz számodra is, hogy ez miért van így.
8

mitől egyszerű?

Pepita · 2015. Feb. 9. (H), 08.49
Szerintem attól, hogy nem keverhető össze a kliens a szerverrel, még nem lesz bonyolult. Az, hogy valami 1 sor vagy 10, függ a kódolási stílustól is.
Kár morogni, a fejlesztéshez türelem és kitartás kell.
Szépen elküldöd a szükséges adatokat ajaxal a szervernek, ott feldolgozod, ha szükséges, küldesz vissza választ, kliensen megteszed a válasz fv ében amit kell.
Nem bonyolult dolog, csak elsőre tűnik úgy.
9

kész

bvc · 2015. Feb. 22. (V), 19.59
Megoldottam!

Ráment 30-40 óra, de most működik. Végre!
És nehéz volt, nem volt egyszerű! 80-100 programsor, egy egyszerű onchange lekezelésére... Hmmm
10

megoldás?

Pepita · 2015. Feb. 22. (V), 23.31
És mi a megoldás?
Lehet, hogy másokat is érdekel...
11

hát részletekből nem tudom

bvc · 2015. Feb. 28. (Szo), 12.27
hát részletekből nem tudom mennyire érthető, a teljesség igénye nélkül...
functions.php:

<?php
	require_once("connection.php"); 	

	function confirm_query($result_set) {
		global $connection;
		if (!$result_set) {
			die("Adatbázis lekérdezési hiba." . mysqli_error($connection));
		}
	}

	function secure_data($data) {
		global $connection;
		if (isset($data)) {
			return mysqli_real_escape_string($connection, trim($data));
		} else {
			return null;
		}
	}
	
	function get_max_id($table) {
		global $connection;
		$result = mysqli_query($connection, "SELECT MAX(id) from {$table};");
		confirm_query($result);
		$data = mysqli_fetch_array($result);
		if (is_null($data[0])) $data[0] = 0; 
		return $data[0];
	}
	
    function redirect_to($location) {
		header("Location: {$location}");
		exit;
	}
?>
index.php:
HTTP_request

	<script>
		function xhr(oszlop, str, fv, id) {  // oszlop:d0003, str:Yellow, fv:szinek, id:420
			var req;
			if (window.XMLHttpRequest) {
				req = new XMLHttpRequest();
			} else {
				req = new ActiveXObject("Microsoft.XMLHTTP");
			}
			req.open("GET", "getdata.php?oszlop="+oszlop+"&str="+str+"&fv="+fv+"&id="+id, true);
			req.onreadystatechange = function() {
				if (req.readyState == 4 && req.status == 200) {
					document.getElementById(oszlop).value = req.responseText;
					document.getElementById(oszlop).style.color = 'navy';
				}
			}
			req.send();
		}
	</script>
SQL lekérdezés után kiíratás

										$i = 0; // aktuális sorszám
										$alt = "alt1"; //váltott sorszám minta készítése
										while ($row = mysqli_fetch_array($result)) {
											if ($alt == "alt2") $alt = "alt1"; else $alt = "alt2";
											$i++; // aktuális sorszám
											$id = $row['id'];
											echo "<tr>\n";
											$x = "a" . sprintf("%04s", $i);
											echo "<td><input style='width:57px; background-color:rgb({$row['r']},{$row['g']},{$row['b']});' 
											 type='text' id='{$x}' disabled /></td>\n";
											$x = "b" . sprintf("%04s", $i);  
											echo "<td><input style='width:104px;' class='{$alt}' type='text' value='{$row['szinkod']}' id='{$x}'
											 onchange='xhr(this.id, this.value, ".'"szinek"'.", {$id})' onfocus='getid(this.id)'/></td>\n";
											$x = "c" . sprintf("%04s", $i);
											echo "<td><input style='width:184px;' class='{$alt}' type='text' value='{$row['megnevezes']}' id='{$x}' 
											 onchange='xhr(this.id, this.value, ".'"szinek"'.", {$id})' onfocus='getid(this.id)'/></td>\n";
											$x = "d" . sprintf("%04s", $i);
											echo "<td><input style='width:104px;' class='{$alt}' type='text' value='{$row['r']}' id='{$x}' 
											 onchange='xhr(this.id, this.value, ".'"szinek"'.", {$id})' onfocus='getid(this.id)'/></td>\n";
											$x = "e" . sprintf("%04s", $i);
											echo "<td><input style='width:104px;' class='{$alt}' type='text' value='{$row['g']}' id='{$x}' 
											 onchange='xhr(this.id, this.value, ".'"szinek"'.", {$id})' onfocus='getid(this.id)'/></td>\n";
											$x = "f" . sprintf("%04s", $i);
											echo "<td><input style='width:104px;' class='{$alt}' type='text' value='{$row['b']}' id='{$x}' 
											 onchange='xhr(this.id, this.value, ".'"szinek"'.", {$id})' onfocus='getid(this.id)'/></td>\n";
											echo "</tr>\n";
										}
A getdata.php:

<?php
	require_once("functions.php"); 		
	global $connection;
	$oszlop = secure_data($_GET['oszlop']); // d0003  (oszlop betüjel + sor száma)
	$str = secure_data($_GET['str']);       // Yellow (cella értéke)
	$fv = secure_data($_GET['fv']);         // szinek (meghívandó függvényrész)
	$id = intval($_GET['id']);              // 420    (MySQL id sorazonosító)
	
	if ($fv == 'szinek') { // ------------------------------------------- RAL szinek adattábla
		switch ($oszlop[0]) { 
			case "a": $fieldname = "id"; break;
			case "b": $fieldname = "szinkod"; break;
			case "c": $fieldname = "megnevezes"; break;
			case "d": $fieldname = "r"; break;
			case "e": $fieldname = "g"; break;
			case "f": $fieldname = "b"; break;
		}	
		if ($id > get_max_id("szin")) { 
			$newid = get_max_id("szin") + 1;
			$query = "INSERT INTO szin SET id={$newid}, {$fieldname}='{$str}'"; 
		} else { 
			$query = "UPDATE szin SET {$fieldname}='{$str}' WHERE id={$id}"; 		
		}
		$result = mysqli_query($connection, $query);
		confirm_query($result);
		echo $str;
	}
?>
meg egy jó adag CSS, meg némi js.