[Solved] Problem CheckBox inside Combobox

[Bruce Lam]

i have two combobox with checkbox inside. this is my code about combobox

 

 

 

<telerik:RadComboBox ID="rcbProduct" runat="server" AllowCustomText="True" AppendDataBoundItems="True" 

 

 

DropDownWidth="700px" EmptyMessage="Choose Product" Filter="Contains" ForeColor="Blue"

 

HighlightTemplatedItems="True" MarkFirstMatch="True" MaxHeight="150px" OnItemDataBound="rcbProduct_ItemDataBound">

 

 

<HeaderTemplate>

 

 

<ul>

 

<li class="col1" style="width: 120px">ProductName</li>

 

<li class="col2" style="width: 120px">ModelNumber</li>  

 

 

<li class="col3" style="width: 70px">Vender</li>

 

<li class="col4" style="width: 60px">Price</li>  

 

 

<li class="col5" style="width: 150px">Image</li>

 

 

</ul>  

 

 

</HeaderTemplate>

 

 

<ItemTemplate>

 

 

<asp:Panel ID="divUser" runat="server">

 

 

<ul>

 

 

<li class="col1" style="width: 120px">

 

<%

 

# DataBinder.Eval(Container.DataItem, "f_ProductName").ToString().Trim()%>

 

</li>

 

 

<li class="col2" style="width: 120px">

 

 

<%

 

 

 

# DataBinder.Eval(Container.DataItem, "f_ModelNum").ToString().Trim()%>

  

</li>

 

 

 

 

<li class="col3" style="width: 70px">

 

 

 

 

<%

 

 

 

#DataBinder.Eval(Container.DataItem,("f_VenderName")) %>

 

</li>

 

 

 

 

 <li class="col4" style="width: 60px">

 

 

 

 

<%

 

 

 

# DataBinder.Eval(Container.DataItem, "f_Price").ToString().Trim()%>

 

</li>

 

 

 

<li class="col5" style="width: 150px">

 

 

 

 

<asp:Image ID="img" runat="server" Height="80px" ImageAlign="AbsMiddle" Width="80px" />

 

 

 

 

<asp:Label ID="lblImg" runat="server" Text='<%# Eval("f_ImageProduct") %>' Visible="false"></asp:Label>

 

 

 

 

</li>

 

 

 

 

</ul>

 

 

 

 

</asp:Panel>

 

 

 

 

</ItemTemplate>

 

 

 

 

</telerik:RadComboBox>


and this is javascript code:

 

 

 

<script type="text/javascript"> 

 

 

 

var cancelDropDownClosing = false;

 

 

function StopPropagation(e)

{

 

//cancel bubbling

    e.cancelBubble = true;

 

 

 

    if (e.stopPropagation)

    {

        e.stopPropagation();

    }

}

 

 

function onDropDownClosing()

 

{

cancelDropDownClosing =

 

false;

 

}

 

 

 

function onCheckBoxClickPro_Shop(chk)

 

{

 

 

var combo1 = $find("<%= rcbProduct_Shop.ClientID %>");

 

 

//prevent second combo from closing

 

combo1.set_text(

 

"");

 

cancelDropDownClosing =

 

true;

 

 

//holds the text of all checked items

 

 

 

 

 

var text = "";

 

 

//holds the values of all checked items

 

 

 

 

 

var values = "";

 

 

//get the collection of all items

 

 

 

 

 

var items = combo1.get_items();

 

 

//enumerate all items

 

 

 

 

 

for (var i = 0; i < items.get_count(); i++)

 

{

 

 

var item = items.getItem(i);

 

 

 

//get the checkbox element of the current item

 

 

 

 

 

var chk1 = $get(combo1.get_id() + "_i" + i + "_chk1");

 

 

if (chk1.checked)

 {

text += item.get_text() +

 

"," ;

 

values += item.get_value() +

 

",";

}

}

 

 

//remove the last comma from the string

 

 

 

 

text = removeLastComma(text);

values = removeLastComma(values);

 

 

if (text.length > 0)

 

{

 

 

//set the text of the combobox

 

 

 

 

 

//combo.set_text("");

combo1.set_text(text);

 

 

//update the treeview in the second combobox

 

 

 

 

}

 

 

else

 

 

 

 

{

 

 

//all checkboxes are unchecked

 

 

 

 

 

 

//so reset the controls

 

 

 

 

combo1.set_text(

 

"");

 

}

}

 

 

 

function onCheckBoxClickPro(chk)

 

{

 

 

var combo = $find("<%= rcbProduct.ClientID %>");

 

 

 

//prevent second combo from closing

 

 

 

 

 

combo.set_text(

 

"");

 

cancelDropDownClosing =

 

true;

 

 

 

//holds the text of all checked items

 

 

 

 

 

var text = "";

 

 

//holds the values of all checked items

 

 

var values = "";

 

 

 

//get the collection of all items

 

 

 

 

 

var items = combo.get_items();

 

 

//enumerate all items

 

 

for (var i = 0; i < items.get_count(); i++)

{

 

 

var item = items.getItem(i);

 

 

//get the checkbox element of the current item

 

 

 

 

var chk1 = $get(combo.get_id() + "_i" + i + "_chk1");

 

 

if (chk1.checked)

 

{

text += item.get_text() +

 

"," ;

 

values += item.get_value() +

 

",";

 

}

}

 

 

//remove the last comma from the string

 

 

 

 

text = removeLastComma(text);

values = removeLastComma(values);

 

 

if (text.length > 0)

{

 

 

//set the text of the combobox

 

 

//combo.set_text("");

combo.set_text(text);

 

 

//update the treeview in the second combobox

 

 

 

 

}

 

 

else

 

 

 

 

{

 

 

//all checkboxes are unchecked

 

 

//so reset the controls

 

 

 

 

combo.set_text(

 

"");

 

}

}

 

 

</script>


i use same script for two combobox . In FireFox is ok no problem but when i open it with IE.7 or IE 8 . They show a message:
"A script on this page is causing your web browser to run slowly. If it continues to run, your
computer might become unresponsive"

I test the problem and if i delete one javascript and dont load data for a combobox it's ok if i load data for two combobox sametime . This Problem will happen and show alert above. Please help me to solve this Problem .Thanks alot
 

 

 

 

[Vesko]

Please use the Format Code Block button next time so we can read your code.

How many items do you load in the combobox?
IE is always slower in javascript manipulations compared to the other browsers.

Try setting the ScriptMode property of the ScriptManager / RadScriiptManager to "Release" and see if this helps.