[Solved] Add item on client side

[JULIA]

Hello,

i wan't add a item ( after databind ) on client side. How can i do this?

function supplierChanged(e) {
    var atcList = $('#SelectedAtcCode').data('tDropDownList');
    var pList = $("#DropDownProduct").data('tDropDownList');
    getData('<%= Url.Content("~/Controller/_JsonAction") %>', { atcCode: atcList.value() }, pList);
    $('<option/>', { text: '...', value: "" }).prependTo(pList.$element);
}

    function getData(url, params, ctrl) {
        $.getJSON(url, params, function (data) {
            if (data.Data) {
                ctrl.dataBind(data.Data);
                ctrl.text(" ");
                ctrl.open();
            }
        });
    }

The result ( screenshot attached ) is not the expected behavior.

[Georgi Krustev]

Hi Timo,

Telerik DropDownList ASP.NET MVC is not a select HTML element. Hence items list does not contain option HTML elements.

In order to achieve your goal you need to add LI HTML element or to modify returned data and re-bind dropdownlist component.

Sincerely yours,
Georgi Krustev
the Telerik team

[JULIA]

Hello,

i add the item in the following way.

var pList = $("#myList").data('tDropDownList');
$('<LI class=t-item>...</LI>').prependTo(pList.dropDown.$element.find('ul'));

If i select the empty item, the text from the second item will be show after the dropdown is closed.
Is there an hidden field for the selected text? or how can i achieve this goal?

Regards,
Timo

[Georgi Krustev]

Hello Timo,

Selection in ComboBox UI components depends on the index of the items in the dropdown list. Because LI elements does not have value property, we are forced to look for the item index and get those item from data collection.

Hence, I will suggest you add JSON object to the returned collection in the correct position and then bind the combobox:

var staticItems = [{Text: "Select Item", Value=""}];

$.getJSON(url, params, function (data) {
            if (data.Data) {
                data.Data = $.merge(staticItems, data.Data);
                ctrl.dataBind(data.Data);
                ctrl.text(" ");
                ctrl.open();
            }
        });

All the best,
Georgi Krustev
the Telerik team

[iConect Developer - Mike]

What is the format supposed to be of the JSON returned in:

$.getJSON(url, params, function (data) {
    if (data.Data) {
        ctrl.dataBind(data.Data);
        ctrl.text(" ");
        ctrl.open();
    }
});

I've tried doing:

public static string ToJSON(this object obj)
{
  JavaScriptSerializer serializer = new JavaScriptSerializer();
  return serializer.Serialize(obj);
}

To make me a JSON string but the output looks like:

[{"Text":"text","Value":"value"}];

And when I pass that into the .dataBind() function it seems to think each character is a item and adds them all as individual things so I have items labeled 'T', 'e', 'x', 't' and so on.

The demo example of client-side binding shows adding items in this format:

[{Text:"text",Value:="value"}];

With the parameters not in quotes (which isn't standard JSON format), is the telerik stuff expecting something else or did I do something wrong on my end?

[Georgi Krustev]

Hello Iconect Developer - Keith,

 
I am not sure where could be the problem. Check this test project and if it is possible, modify it in order to replicate the problem.

Kind regards,
Georgi Krustev
the Telerik team