Advanced Search

Experimental HTML Building Fluent Interface

/ Published in: C#
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. var people = new[]
  2.                  {
  3.                      new Person("alice", "alice.png"),
  4.                      new Person("Bob", "bob.jpeg"),
  5.                      new Person("Steve", "stevo.png"), 
  6.                  };
  7.  
  8. var myHtml =
  9.     html._(
  10.         body._(
  11.             ul._(
  12.                 person => li._(
  13.                               a.href("/person/" + person.Id)._(
  14.                                   img.src(person.ImageSrc).alt("profile image for " + person.Name)
  15.                                   )
  16.                               )
  17.                 ,
  18.                 people
  19.                 ).RenderIfChildren()
  20.             )
  21.         );
  22.  
  23.  
  24. Results in:
  25.  
  26. <html>
  27.     <body>
  28.         <ul>
  29.             <li>
  30.                 <a href="/person/aec76ab4-d5f9-47d7-8b69-698dedc778c3">
  31.                     <img src="alice.png" alt="profile image for alice"/>
  32.                 </a>
  33.             </li>
  34.             <li>
  35.                 <a href="/person/158fe190-f39f-4786-b4e7-c26341176f64">
  36.                     <img src="bob.jpeg" alt="profile image for Bob"/>
  37.                 </a>
  38.             </li>
  39.             <li>
  40.                 <a href="/person/cef84458-ce47-4f5f-a853-643fd23212fe">
  41.                     <img src="stevo.png" alt="profile image for Steve"/>
  42.                 </a>
  43.             </li>
  44.         </ul>
  45.     </body>
  46. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.