CODEWITHSUNDEEP
asp.net
Niloo
Niloo

Reputation: 1215

How to use htmltext for DataTextField in DropDownList?

I have a DropDownList and set a DataSource for it.

html:

 <asp:DropDownList ID="ddlcategory" runat="server" DataSourceID="ODScategory"  DataTextField="Name" DataValueField="ID" Width="200px">
  </asp:DropDownList>

  <asp:ObjectDataSource ID="ODScategory" runat="server" SelectMethod="GetAllByCommand"TypeName="Alian.BusinessLayer.clsCustomerCategoryFactory">
  <SelectParameters>
    <asp:Parameter DefaultValue="FatherID is not null" Name="SQLWhere" Type="String" />
      </SelectParameters>
   </asp:ObjectDataSource>

My datasource is a table with two column(ID,Name). i save htmltext in Name.

for example :

ID Name

1 Cofee span style="color: DarkOrange">A

2 span style="background-color: LightSalmon">Hotel>

My problem is : when i use this table for dropdowndatasource, my value show with html tag.

enter image description here

How do remove html tag??

Upvotes: 0

Views: 816

Answers (1)

Boriss Pavlovs
Boriss Pavlovs

Reputation: 1441

if I understood you correctly, you try to apply some style for your dropdownlist options. in this case You need to add your style for every item in your dropdownlist item collection. Item style you can store in name with some separator for instance ';' "color:red; YourItem Name" (N.B. But I don't think that is good idea)

foreach(ListItem item in ddl.Items)
{
   string[] data=item.Text.Split(';');
   item.Attributes.Add("style", data[0]);
   item.Text=data[1];
}

and you can do it for example on Page_PreRender. But you have to be careful because not all browsers correctly supported style attribute for tag option.

Remove unwanted html tags from server-side:

 System.Text.RegularExpressions.Regex reg = new System.Text.RegularExpressions.Regex(@"(<.+>)\b|(<\/.+>)");

foreach(ListItem item in ddl.Items)
{
   item.Text=reg.Replace(item.Text," ");
}

You can do this replacement in your data source, but I don't know which type of this you use

If you want to remove unwanted html tags from client side with javascript:

solution with Jquery using

function RemoveUnwantedHTMLTag()
{
   $('select:[id*="elementSelectId"] > option').each(function(){var _self=$(this);   _self.text(_self.text().replace(/<[^>]+>/g,' '));});
}

without Jquery

function RemoveUnwantedHTMLTag()
{
  var _arr=document.getElementById('elementSelectId').childNodes;
    for (var i=0;i<_arr.length;i++)
    { 
         if(_arr[i].text!=undefined)
           { _arr[i].text=(_arr[i].text).replace(/<[^>]+>/g,' ');
                     _arr[i].value=(_arr[i].value).replace(/<[^>]+>/g,' ');
                    }

     }

}

start your javascript function on page load:

Jquery

 $(documet).ready{RemoveUnwantedHTMLTag();}

without jquery

 document.body.onload=function(){RemoveUnwantedHTMLTag();}

if Sys object is present on page ( this method useful if your drop down list is located inside some updatepanel)

  Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(RemoveUnwantedHTMLTag);

all code in cs file:

protected void Page_PreRender(object sender, EventArgs e){
if (!this.Page.ClientScript.IsStartupScriptRegistered("RemoveUnwantedHTMLTag")
        {
            string script = @"function RemoveUnwantedHTMLTag()
{
 var _arr=document.getElementById('"+ddlcategory.ClientID+"').childNodes;
 for (var i=0;i<_arr.length;i++)
{ if(_arr[i].text!=undefined)
    { _arr[i].text=(_arr[i].text).replace(/<[^>]+>/g,' ');
              _arr[i].value=(_arr[i].value).replace(/<[^>]+>/g,' ');// if text is same  with value
            }
}
}
 Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(RemoveUnwantedHTMLTag); ";
            ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(),  "RemoveUnwantedHTMLTag", script, true);
        }
}

Upvotes: 3

Related Questions