locked
Rebinding Ajax cascading dropdownlist using javascript RRS feed

  • Question

  • User2108892867 posted

    Hello everyone, I have this situation. I have a popup and there are two cascading dropdownlists called category and product. For example, if you select electronics, the second dropdown will show TV, microwave oven and so on. The popup also have other additional information such as product name and price in the textboxes and the dropdownlist will show the right category and right product selection. I used javascript to populate the information on the popup. However, I got a problem with dropdownlist. 

    When the popup shows up, the first dropdownlist already passed the value as parameter to the second dropdownlist. Although I am able to change the selected value in the first dropdownlist using javascript, the second dropdown has already been populated with products from the incorrect category value passing from the first dropdownlist. 

    So what I want to achieve is when the popup shows up, I want to pass the value from my javascript and repopulate the second dropdownlist with the correct value. 

    Thanks for your help.

    Sunday, September 13, 2015 2:06 AM

All replies

  • User2108892867 posted

    Anybody please?

    Thanks. 

    Sunday, September 13, 2015 5:15 PM
  • User61956409 posted

    Hi asplearning,

    The popup also have other additional information such as product name and price in the textboxes and the dropdownlist will show the right category and right product selection.

    As far as I know, the first dropdown “category” will be populated via calling ServiceMethod when you show the popup. If you’d like to get the corresponding category based on [product name] and [price] user input, you could send AJAX request to retrieve the category and corresponding products from your database, then you could dynamically set selected value of the first dropdown “category” and populate the second dropdown “product” in AJAX success callback function.

    Best Regards,

    Fei Han

    Sunday, September 13, 2015 11:24 PM
  • User2108892867 posted

    Thanks for your reply. Actually the product name and price doesn't do anything to the dropdownlist. Only the category dropdownlist does. My problem now is second dropdownlist has already been bound (I have a default category id of 1 in the first dropdownlist) before the javascript is loaded to populate the form. So now after the javascript is loaded, it's working fine if the product is in category_id=1 but if the product belongs to category_id =2, the second dropdownlist doesn't have a value for selection. So I need to somehow passed this category_id=2  from javascript to the following web service of the cascading dropdown:

    <WebMethod> _
        Public Function GetProductName(knownCategoryValues As String) As CascadingDropDownNameValue()
            Dim category_id As String = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)("category_id")
           
            Return ls.ToArray()
        End Function

    and as a result bind the second dropdownlist again. Is it possible to do that?

    I hope this make sense. 

    Thanks. 

    Monday, September 14, 2015 12:17 AM
  • User2108892867 posted

    I have searched about your suggestion about AJAX request. Just not sure how I am going to pass the parameter to the web service since the method doesn't accept any parameter except knowCategoryValues:

    <WebMethod> _
        Public Function GetProductName(knownCategoryValues As String) As CascadingDropDownNameValue()
            Dim category_id As String = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)("category_id")
           
            Return ls.ToArray()
        End Function

    Is there a way I can change the cascading dropdownlist selected value using javascript?

    Monday, September 14, 2015 12:27 AM