Mostly we work with data in code behind when developing web applications. Sometimes we do postbacks and reload pages. Sometimes we use AJAX and do partial page updates. Sometimes we don't like both of those but need to keep so much data in client side to access easily even if the network is disconnected.
Today we will see how we overcome this by creating XML document and store it in LocalStorage so that it can be accessed by client side scripts.
1. Create your own
XML Document in Code Behind.
XmlDocument xmlDocumentAttrib = new XmlDocument();
XmlDeclaration xmlDeclarationAttrib = xmlDocumentAttrib.CreateXmlDeclaration("1.0", "UTF-8", null);
XmlElement rootAttrib = xmlDocumentAttrib.DocumentElement;
xmlDocumentAttrib.InsertBefore(xmlDeclarationAttrib, rootAttrib);
XmlElement ConfigAttributeList = xmlDocumentAttrib.CreateElement(string.Empty, "ConfigAttributeList", string.Empty);
xmlDocumentAttrib.AppendChild(ConfigAttributeList);
foreach (var pa in this._Product.ConfigAttributeList)
{
if (attributeNotInList.Where(x => x.idConfigAttribute == pa.idConfigAttribute).FirstOrDefault() != null)
continue;
XmlElement AttributeItem = xmlDocumentAttrib.CreateElement(string.Empty, "AttributeItem", string.Empty);
ConfigAttributeList.AppendChild(AttributeItem);
XmlElement idConfig = xmlDocumentAttrib.CreateElement(string.Empty, "idConfigAttribute", string.Empty);
XmlElement lbConfig = xmlDocumentAttrib.CreateElement(string.Empty, "lbConfigAttribute", string.Empty);
XmlText idConfigAttributeText = xmlDocumentAttrib.CreateTextNode(pa.idConfigAttribute.ToString());
XmlText lbConfigAttributeText = xmlDocumentAttrib.CreateTextNode(pa.lbConfigAttribute);
idConfig.AppendChild(idConfigAttributeText);
lbConfig.AppendChild(lbConfigAttributeText);
AttributeItem.AppendChild(idConfig);
AttributeItem.AppendChild(lbConfig);
}
this._Product
This is an object that holds the list of properties.
this._Product.ConfigAttributeList
This contains list of attributes that each one has it's ID and Name.
This peace of code will generate an XML document like below;
2. Now we need to append this to a string.
We use
StringWriter and
XmlWriter for this.
var swXmlDocumentAttrib = new StringWriter();
using (var xmlTextWriter = XmlWriter.Create(swXmlDocumentAttrib))
{
xmlDocumentAttrib.WriteTo(xmlTextWriter);
xmlTextWriter.Flush();
swXmlDocumentAttrib.GetStringBuilder().ToString();
}
The swXmlDocumentAttrib is containing the xml document created above.
3. Inject this to the client side using code behind.
StringBuilder sbLocalStorage = new StringBuilder();
sbLocalStorage.Append("<script>");
sbLocalStorage.Append("if (typeof(Storage) !== \"undefined\") {");
sbLocalStorage.Append("localStorage.setItem('swXmlDocumentAttrib', '" + swXmlDocumentAttrib + "');");
sbLocalStorage.Append("} else { alert('does not support local storage'); }");
sbLocalStorage.Append("</script>");
Page.ClientScript.RegisterStartupScript(this.GetType(), "productLocalStorage", sbLocalStorage.ToString());
This will alert if the browser doesn't support for LocalStorage.
localStorage.setItem
The
setItem add the string value to the LocalStorage of the browser.
Page.ClientScript.RegisterStartupScript
RegisterStartupScript will register the script in HTML page.
In your client side scripting you can get this stored xml using
getItem.
We will discuss further details of how we can deal with such XML from client side in upcoming posts.
Happy Coding...!