In my ASP.NET application using C# 2.0, I have created objects for a database with properties that can be called natively or through a RESTful JSON API. These objects are used to convert data into HTML for display on the website.
On the site, there are several tab-like modules responsible for transforming data into HTML content. The challenge is to load the first tab using server-side C# code and then switch to Ajax for loading other tabs when clicked - while still maintaining compatibility with old browsers and search engines by loading the same HTML server-side.
Currently, I write JavaScript separately from the C# code that converts data into HTML. Although the methods are similar, being in different languages adds complexity to the process.
C# code
public override string GetHtml()
{
IJsonObjectCollection<Person> response = ((Village)page).People;
string html = "<div id=\"test\">";
foreach (Person person in response)
{
html += "<div class=\"person\">";
html += person.Name;
if(canEdit) html += "*";
html += "</div>";
}
return html + "</div>";
}
JavaScript code
function getHtml() {
JsonRequest('/json/villages/1/people', function(response) {
var html = '<div id="test">';
for (int i = 0; i < response.length; i++)
{
var person = response[i];
html += '<div class="person">';
html += person.name;
if(canEdit) html += '*';
html += '</div>';
}
return html + '</div>';
});
}
I am considering different approaches to streamline this process:
1. Create separate classes for each ModuleToHtmlMethod to define how data objects are transformed into HTML. This approach became too complex.
2. Develop a custom scripting language that can be interpreted as both C# and compiled into JavaScript code.
3. Exclusively use C# and fetch HTML content using Ajax requests.
4. Maintain separation of code and rewrite methods twice.
For scalability and allowing other developers to create modules, option 2 might be the most viable solution.