Repeater

Size
2,561 Kb
Views
8,096

How do I make an repeater?

What is a repeater? How do you make a repeater? This script and codes were developed by Tamo Tkhlashidze on 14 January 2023, Saturday.

Repeater Previews

Repeater - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>repeater</title>
</head>
<body> <div id="cont" data-foreach="data"> <span style="font-weight: bold" data-bind="name"></span> <span data-bind="age" >g</span> <span data-bind="lastname"></span>
</div> <script src="js/index.js"></script>
</body>
</html>

Repeater - Script Codes JS Codes

'use strict';
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var Model = function () { function Model(element) { _classCallCheck(this, Model); this.elem = element; this.data = [{ name: 'saxeli 1', lastname: 'test1', age: 123 }, { name: 'saxeli 2', lastname: 'test2', age: 321 }]; } Model.prototype.Load = function Load() { var arrayName = this.elem.getAttribute('data-foreach'); var itemsArr = this[arrayName]; for (var _iterator = itemsArr, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) { var _ref; if (_isArray) { if (_i >= _iterator.length) break; _ref = _iterator[_i++]; } else { _i = _iterator.next(); if (_i.done) break; _ref = _i.value; } var item = _ref; var clone = this.elem.cloneNode(true); var selectors = clone.querySelectorAll('[data-bind]'); for (var _iterator2 = selectors, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]();;) { var _ref2; if (_isArray2) { if (_i2 >= _iterator2.length) break; _ref2 = _iterator2[_i2++]; } else { _i2 = _iterator2.next(); if (_i2.done) break; _ref2 = _i2.value; } var selector = _ref2; var prop = selector.getAttribute('data-bind'); var propVal = item[prop]; selector.innerHTML = propVal; } document.body.appendChild(clone); } this.elem.remove(); }; return Model;
}();
var mod = new Model(document.getElementById('cont'));
mod.Load();
Repeater - Script Codes
Repeater - Script Codes
Home Page Home
Developer Tamo Tkhlashidze
Username Nagasaki1991
Uploaded January 14, 2023
Rating 3
Size 2,561 Kb
Views 8,096
Do you need developer help for Repeater?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Tamo Tkhlashidze (Nagasaki1991) Script Codes
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!