Add multicolumn item on client side

4 posts, 0 answers
  1. Piyush
    Piyush avatar
    8 posts
    Member since:
    Jun 2012

    Posted 24 Jul 2012 Link to this post

    Hi,

    I'm evaluating RadComboBox for multi-column drop down support. The scenario is load on demand from webservice and allow users to add new items in the combo from client side.

    I can see that there is sample available here but it is without using templates. Using grid inside RadComboBox will be very complex as I have to insert new items to the grid from client side which I'm not sure is possible or not.

    How can I add new items to multi column RadCombox? If that is not possible please suggest any possible workarounds or other Telerik controls that can be used.

    Regards,
    Piyush




  2. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 25 Jul 2012 Link to this post

    Hi Piyush,

    You can try using the RadComboBox Client Templates.

    Regards,
    Kalina
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. Piyush
    Piyush avatar
    8 posts
    Member since:
    Jun 2012

    Posted 16 Aug 2012 Link to this post

    Thanks Kalina for pointing to the client templates demo. I'm able to add new items on client side. Only one thing missing in the demo was adding attributes on client side. Here how I added attributes on the client side:

    var comboItem = new Telerik.Web.UI.RadComboBoxItem();           
    comboItem.set_text(" " + e.FirstName);
    comboItem.set_value(e.ID);
    comboItem.get_attributes().setAttribute('LastName', e.LastName);
    comboItem.get_attributes().setAttribute('Phone', e.Phone);
    comboItem.get_attributes().setAttribute('Email', e.Email);

    And the client template markup is:

    <ClientItemTemplate>
        <ul style="width: 90%;">
            <li class="col1"> #= Text # </li>
            <li class="col2"> #= Attributes.LastName #</li>
            <li class="col3"> #= Attributes.Phone # </li>
            <li class="col4">#= Attributes.Email #</li>
       </ul>
    </ClientItemTemplate>

  4. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 20 Aug 2012 Link to this post

    Hi Piyush,

    Thank you for posting your solution for the community.

    Regards,
    Kalina
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top