Generating a literal for each item in an item collection

Question

As it stands right now, I have a literal control on my page. In my code-behind, I'm using StringBuilder to generate some JavaScript. Also on that page I have a item collection. What I want to do is for each item in my item collection, generate my literal which will in essence generate my JavaScript. Here is an example of my code-behind now. I'm ok with doing something different, but I just need to generate said JavaScript for every item in the collection and I'm not sure how to do it.

System.Text.StringBuilder sb = new System.Text.StringBuilder();
sb.Append("<script type='text/javascript'>");
sb.Append("mboxCreate(\"product_productpage_rec\",");
sb.Append("\"entity.id=" + _prodID + "\",");
sb.Append("\"entity.categoryId=" + _categoryID + "\",");
sb.Append("\"entity.name=" + _prod.Title + "\",");
sb.Append("\"entity.pageURL=" + Request.Url.ToString() + "\",");
//The following value has been taken from the productImageControl code behind.
//Might have to refactor in future as a property of the image control.
string filename = AppSettingsManager.Current.ProductImagePathLarge + _prod.ActiveProductItemCollection[0].Sku + AppSettingsManager.Current.ProductImageExtension;
sb.Append("\"entity.thumbnailURL=" + filename + "\",");
sb.Append("\"entity.inventory=" + _prod.ActiveProductItemCollection.Count + "\",");
sb.Append("\"entity.value=" + _prod.ActiveProductItemCollection[0].ActualPrice + "\",");
sb.Append("\"entity.ProductItemID=" + prodItem.Id + "\",");
sb.Append("\"entity.addToCartImg=~/Images/Buttons/btn_AddToCartFlat.gif\");<");
//The last line has to be /script. < inserted on prev line. do not change it or bad things will happen.            
sb.Append("/script>");
//add script to page
this.LiteralMBoxScript.Text = sb.ToString();

Answer 1

You should be serializing collection to JSON using JavaScriptSerializer. Using LiteralControl and StringBUilder to generate javascript smells...

Answer 2

What you want to do is something like this:(this is not actual working code)

StringBuilder sb = new StringBuilder("");
foreach(item in collection)
{
    sb.Append("<script type=\"text/javascript\">");
    //do your javascript stuff here
    sb.Append("</script>");
}

literal.Text = sb.ToString();

Answer 3

I realize that @jimplode suggested wrapping around with a foreach, and that's a good suggestion. I'm going to tackle a different part of the problem.

Injecting Client-Side Script from an ASP.NET Server Control

and try this block on for readability: (note that there's no appending because it's not creating a string and repeatedly adding to it. So it's my understanding that this works as well as a StringBuilder.Append()

string myScript = @"
<script type='text/javascript'>
    mboxCreate(
        'product_productpage_rec',
        'entity.id=" + _prodID + @"',
        'entity.categoryId=" + _categoryID + @"',
        'entity.name=" + _prod.Title + @"',
        'entity.pageURL=" + Request.Url.ToString() + @"',
        'entity.thumbnailURL=" + filename + @"',
        'entity.inventory=" + _prod.ActiveProductItemCollection.Count + @"',
        'entity.value=" + _prod.ActiveProductItemCollection[0].ActualPrice + @"',
        'entity.ProductItemID=" + prodItem.Id + @"',
        'entity.addToCartImg=~/Images/Buttons/btn_AddToCartFlat.gif'
    );
</script>"  

Answer 4

I think you should not do that in the code behind since it is purely client side code, you should do that in your aspx page using server tags

I'm symplifying your example but the idea is there:

Assuming you have declared the collection in your code behind:

 protected List<Person> persons = new List<Person>();

protected void Page_Load(object sender, EventArgs e)
        {
            persons.Add(new Person() { Name = "Toto", Firstname="Bobo" });
            persons.Add(new Person() { Name = "Titi", Firstname = "Bibi" });
        }

You put that in your aspx

<% foreach (var person in persons)
   { %>
<script type="text/javascript">
    mboxCreate("person.name=" + "<%=person.Name%>", "person.firstname=" + "<%=person.Firstname%>");
</script>
<%} %>

This will generate the following html:

 <script type="text/javascript">
 mboxCreate("person.name=" + "Toto", "person.firstname=" + "Bobo");
 </script>

 <script type="text/javascript">
 mboxCreate("person.name=" + "Titi", "person.firstname=" + "Bibi");
 </script> 

The huge advantage is that you dont have to do anymore those ugly string concatenation in your code behind. And it is a lot easier to read/maintain.