How do I replace content that based on the HTML UI Template

JK JK 2026 
Created at  
7,166 0 0

When UI Design is provided or made for specific purpose, we may need to find the easy way can fill it up if that is based on HTML Table.

Below case is what I tried during implementing WE Service:

	var tmp =
	`<tr>
		<td valign=top>[Name]</td>
		<td valign=top>[ResourceType]</td>
		<td valign=top>[City]</td>
		<td valign=top>[County]</td>
		<td valign=top>[Description]</td>
		<td valign=top>[GoogleMapLink]</td>
		<td valign=top>[Phone]</td>
		<td valign=top>[Address]</td>
		<td valign=top>[WebLink]</td>
	</tr>`;

	tmp = tmp.replace('[Name]', v.Name);
	tmp = tmp.replace('[ResourceType]', v.ResourceType);
	tmp = tmp.replace('[City]', city);
	tmp = tmp.replace('[County]', county);
	tmp = tmp.replace('[Description]', (v.Description==null) ? "":v.Description);
	tmp = tmp.replace('[GoogleMapLink]', `<a href="` + google_map_url + `" target=_blank>Google Map</a>`)
	tmp = tmp.replace('[Phone]', `<nobr>` + ((v.Phone==null) ? "":v.Phone) + `</nobr>`);
	tmp = tmp.replace('[Address]', `<a href="` + google_map_url + `" target=_blank>` + address + `</a>`);
	tmp = tmp.replace('[WebLink]', `<a href="` + v.WebLink + `" target=_blank>Website</a>`);
	return tmp;

 

If we have multiple items, we can fill it up in the for loop. Personally I prefer to use forEach loop like below:

	g_dataset.data.forEach( function(v) {
		if (v.City!=null)
		{
			if (city==v.City)
			{
				console.log(v);
				html += get_table_row(v);
			}
		}
	});

 

Tags HTML Template JavaScript WE Service forEach Facebook X
Comments 0
Similar posts
  1. Regular Expressions in JavaScript
    7,603
  2. Difference between Java and Javascript
    7,646
  3. Dataset of California Foodbanks
    7,186
  4. RegExp example in Python to exclude javascript from HTML code
    7,063
  5. Loading XML Data with JavaScript
    7,509
  1. Java Servlet Example
    7,134
  2. Creating a simple Java Servlet (Web Server Page) with Apache Maven on Microsoft Windows
    7,187
  3. Java Tutorials associated with AP Computer Science A
    7,654
  4. Java Inner Classes
    7,072
  5. Java Polymorphism
    7,068
  6. Java Inheritance (Subclass and Superclass)
    7,190
  7. Java Packages
    7,188
  8. Java Abstract Classes and Methods
    7,763
  9. Java Classes and Objects
    7,106
  10. Java Recursion
    7,207
  11. Java Scope
    7,119
  12. Java Methods
    7,104
  13. Java Arrays
    8,764
  14. Java While Loop/Do While Loop/For Loop/For-Each Loop/Break/Continue
    7,903
  15. Java Switch Statements
    7,423
  16. Java Short Hand If...Else (Ternary Operator)
    7,598
Recently updated
  1. Why You Can't Stop Watching Jack Bryan's Beatbox Gaming Shorts
    121
  2. Song So-hee: The Soulful Voice Touching Hearts Through Korean Music
    126
  3. Watch This Dazzling Dancer’s Mind-Blowing Moves
    155
  4. Michael Jackson's Billie Jean
    224
  5. Bootstrap vs. Tailwind CSS: Origins, Features, Pros & Cons, and How to Choose the Right Framework
    193
  6. The Complete Guide to Golang: History, Features, Real-World Uses, and Code Examples
    618
  7. Telemetry vs. Analytics: Understanding the Difference and Why It Matters
    317
  8. The Evolution and Production Reality of Agentic AI
    277
  9. How to Activate or Waive Your UIUC Student Health Insurance
    357
  10. Complete Guide to Building a Machine Learning Model
    386
  11. My life cuts at Las Vegas during Thanksgiving day holiday
    7,475
  12. The Cybercab Transformation: From Autonomous Taxi to Mobile Base Station
    414
  13. Harness vs. OpenClaw: Two Very Different "Agents"
    1,058
  14. Clean Python Environments: The Power of venv vs. Docker
    898
  15. What is Docker? Why is Docker also useful in a development environment?
    671
  16. UIUC 2026-2027 Academic Calendar
    1,698
  17. How to Build Llama 3 AI Apps with Python: Setup & User Prompts
    868
  18. Open-Source LLMs: The AI Revolution
    822
  19. Resume 2.0: Leveling Up for My First Software Gig
    2,397
  20. Not everyone will understand what this man just did
    2,001
  21. UIUC Dorm Guide: Find Your Perfect Fit !!
    1,659
  22. Unpacking IU's Shopper
    831
  23. Jackie Chan's Police Story: The Action Masterpiece
    711
  24. The IVE Story: Identity, 'I AM' Charts, and Influence
    1,018
  25. Tech Visionaries who graduated at UIUC - You are the Next Turn
    1,240
  26. Open Databases for Sex Crime Occurrences in the U.S.
    770
  27. Automatically copy text to the clipboard when dragging the mouse in the Cursor
    2,812
  28. My First Day at University of Illinois-Urvana Champaign
    1,249
  29. Sand, Sea, and a Splash of Fun at Newport Beach: A Family Adventure
    8,214
  30. Sun, Rocks, and Adventure: A Day at Joshua Tree National Park
    8,291
  31. Sipping the Stars: My Starbucks Adventure
    9,760
  32. Exciting explore at Sequoia National Park
    7,726
  33. My Life Shot at Death Valley
    1,787
  34. Ip Man fights with Muay Thai Master
    994
  35. Mad Clown - Don't Die
    1,091
  36. How to get Student Enrollment and Degree Verification at UIUC
    5,086
  37. LAX Thanksgiving Rush: A Joyful Reunion
    964
  38. ZO ZAZZ(조째즈) - Don`t you know (모르시나요) (PROD.ROCOBERRY)
    1,184
  39. FISHINGIRLS Unleashes Energetic EP 'Funiverse' Featuring Signature Track 'Fishing King'
    1,033
  40. 10CM - To Reach You (너에게 닿기를)
    1,209
  41. Feeling weak? Transform yourself at the UIUC ARC!
    1,618
  42. BOYNEXTDOOR - If I Say I Love You
    1,234
  43. The Future of Software Engineer - AI Engineering
    971
  44. G Dragon x Taeyang (Eyes Nose Lips, Power, Home Sweet Home, GOOD BOY) - LE GALA PIÈCES JAUNES 2025
    965
  45. Lie - Legend song by BIGBANG
    7,866
  46. Why ROLLBACK is useful when you work with Google Gemini CLI?
    900
  47. Reimbursement after Vaccination at McKinley Health Center
    1,073
  48. Gemini CLI makes a Magic! Time to speed up your app development with Google Gemini CLI!
    1,011
  49. Common Questions from UIUC school life in terms of CS Program
    1,179
  50. UIUC Immunization Compliance
    1,269