Implement bindNames, closes #17 (#160)

PhpGt · Sep 14, 2020 · f0f8209 · f0f8209
1 parent f8e3b85
commit f0f8209
Show file tree

Hide file tree

Showing 4 changed files with 65 additions and 13 deletions.
diff --git a/README.md b/README.md
@@ -76,12 +76,14 @@ $outputTo->bindList($data);
 <!doctype html>
 <h1>Shopping list</h1>
 
-<ul id="shopping-list">
-	<li data-id="1">Tomatoes</li>
-	<li data-id="2">Noodles</li>
-	<li data-id="3">Cheese</li>
-	<li data-id="4">Broccoli</li>
-</ul>
+<shopping-list>
+    <ul id="shopping-list">
+        <li data-id="1">Tomatoes</li>
+        <li data-id="2">Noodles</li>
+        <li data-id="3">Cheese</li>
+        <li data-id="4">Broccoli</li>
+    </ul>
+</shopping-list>
 
 <p>The use of a custom element is more useful on more complex pages, but is shown above as an example.</p>
 ```
@@ -92,6 +94,7 @@ Features at a glance
 + HTML components - organise and reuse DOM trees by storing separate components in their own HTML files, and including them using custom HTML tags.
 + Binding of dynamic data - bind key value pairs, associative arrays, lists of associative arrays and even nested lists.
 + Use standards compliant techniques for templates and components.
++ Easily style components using CSS by addressing their tag name (`shopping-list` in the above example).
 
 [dom]: https://www.php.gt/dom
 [example-groceries-html]: https://github.com/PhpGt/DomTemplate/blob/master/example/01-example-groceries.html
diff --git a/src/Bindable.php b/src/Bindable.php
@@ -18,10 +18,7 @@ trait Bindable {
 	 * There may be multiple Elements with the matching attribute, in which
 	 * case they will all have their data set.
 	 */
-	public function bindKeyValue(
-		?string $key,
-		$value
-	):void {
+	public function bindKeyValue(?string $key, $value):void {
 		if(is_null($value)) {
 			$value = "";
 		}
@@ -55,9 +52,7 @@ public function bindValue($value):void {
 	 * @param array|object|BindObject|BindDataMapper $kvp
 	 * @see self::bindKeyValue
 	 */
-	public function bindData(
-		$kvp
-	):void {
+	public function bindData($kvp):void {
 		$assocArray = null;
 
 		if($this->isIndexedArray($kvp)) {
@@ -219,6 +214,19 @@ public function bindNestedList(
 		return $i;
 	}
 
+	public function bindNames($kvp):void {
+		$nameElements = $this->querySelectorAll("[name]");
+
+		foreach($nameElements as $element) {
+			$name = $element->name;
+			if(!array_key_exists($name, $kvp)) {
+				continue;
+			}
+
+			$element->value = $kvp[$name];
+		}
+	}
+
 	/**
 	 * Within the current element, iterate all children that have a
 	 * matching data-bind:* attribute, and inject the provided $value

diff --git a/test/phpunit/BindableTest.php b/test/phpunit/BindableTest.php
@@ -715,4 +715,19 @@ public function testBindKvpList() {
 			self::assertEquals($expectedValues[$i], $valueSpan->textContent);
 		}
 	}
+
+	public function testBindNames() {
+		$examplePostData = [];
+		$document = new HTMLDocument(Helper::HTML_FORM);
+		foreach($document->querySelectorAll("[name]") as $nameElement) {
+			$examplePostData[$nameElement->name] = uniqid("value-");
+		}
+
+		$document->bindNames($examplePostData);
+
+		foreach($examplePostData as $key => $value) {
+			$element = $document->querySelector("[name='$key']");
+			self::assertEquals($value, $element->value, $element->tagName);
+		}
+	}
 }
diff --git a/test/phpunit/Helper/Helper.php b/test/phpunit/Helper/Helper.php
@@ -713,6 +713,32 @@ class Helper {
 		</li>
 	</ul>
 </body>
+HTML;
+
+	const HTML_FORM = <<<HTML
+<!doctype html>
+<meta charset="utf-8" />
+<title>Form test</title>
+
+<body>
+	Contact form:
+	
+	<form method="post">
+		<label>
+			<span>Your name</span>
+			<input name="your-name" required />		
+		</label>
+		<label>
+			<span>Your telephone</span>
+			<input name="telephone" type="tel" />		
+		</label>
+		<label>
+			<span>Message</span>
+			<textarea name="message" required></textarea>		
+		</label>
+		<button name="do" value="submit">Submit!</button>
+	</form>
+</body>
 HTML;
 
 	const HTML_DYNAMIC_FORM = <<<HTML