AsyncUpload (Additional Fields binding with database)

[Tan]

Hi,  from the demo , Is it possible binding the field with DropDownList?


Thks
From Tan

[Bozhidar]

Hi Louis,

You can create any HTML tag, including the select tag (dropdown). Here's how the function creating the select tag should look like (in the style of the demo):

function createSelect(inputID, inputName) {
    var input = "<select id='" + inputID + "' name='" + inputName + "'><option value='volvo'>Volvo</option><option value='saab'>Saab</option></select>";
    return input;
}

Please note, that you can only add HTML elements to the upload.
 
Kind regards,
Bozhidar
the Telerik team

[Tan]

To,

I thinking it is possible do not using the javascript (hardcode the data)? It mean bound in server site, it will load data from database to the dropdownlist, i have try several way such as event from server side, it cannot achieve it without click extra button so i restructure design in another way.

The solution suggest i have been try before it look like below.


Thk suggestion
From louis,

[Bozhidar]

Hi Louis,

Since the dropdown is just html added dynamically with javascript when you upload a file, you cannot bind it from the server. 

If you want the dropdown to be populated with values that are determined from the server, you can use another approach. Put a hidden field on the page and from the server set it's value to the available select options, separated by a comma or some other symbol. Then on the client when you create the dropdown, you can get this value, split it and loop through the values, creating an <option> tag for each one.
 
Greetings,
Bozhidar
the Telerik team

[Abdul]

I know this thread is old, but I will appreciate if anyone can send me the javacript code that can let me see a dropdown list like the one that worked for Louis below. I have tried the codes from Bozhidar (Telerik Admin) but the dropdown list is not displayed

[Shinu]

Hi Abdul,

Please have a look at the following JavaScript code I tried which works fine at my end.

JavaScript:

<script type="text/javascript">
    var $ = $telerik.$;

    function onClientFileUploaded(radAsyncUpload, args) {
        var $row = $(args.get_row());
        var inputName = radAsyncUpload.getAdditionalFieldID("TextBox");
        var inputName2 = radAsyncUpload.getAdditionalFieldID("DropDown");
        var inputType = "text";
        var inputID = inputName;
        var input = createInput(inputType, inputID, inputName);
        var label = createLabel(inputID);
        var dropdown = createSelect(inputName2, inputName2);
        $row.append("<br/>");
        $row.append(label);
        $row.append(input);
        $row.append(dropdown);
    }

    function createInput(inputType, inputID, inputName) {
        var input = '<input type="' + inputType + '" id="' + inputID + '" name="' + inputName + '" />';
        return input;
    }

    function createLabel(forArrt) {
        var label = '<label for=' + forArrt + '>File info: </label>';
        return label;
    }

    function createSelect(inputID, inputName) {
        var input = "  <select id='" + inputID + "' name='" + inputName + "'><option>Select</option><option value='ASP'>ASP</option><option value='JSP'>JSP</option></select>";
        return input;
    }

</script>

Thanks,
Shinu.