Bind additional field to database

4 posts, 0 answers
  1. Abdul
    Abdul avatar
    7 posts
    Member since:
    Jun 2013

    Posted 11 Jul 2013 Link to this post

    I am trying to use the example that I saw on this forum to get value from a dropdown list as my additional field, however, I am not showing the drop down list.

    Here is the modified javascript code:

    function onClientFileUploaded(radAsyncUpload, args) {
         var row = args.get_row(),
              inputName = radAsyncUpload.getAdditionalFieldID("objName"),
              inputID = inputName,
              input = createSelect(inputID, inputName),
              label = createLabel(inputID),
              br = document.createElement( "br" );
      
         row.appendChild( br );
         row.appendChild( label );
         row.appendChild( input );
    }
     
    function createSelect(inputID, inputName)
    {
        var input = "<select id='" + inputID + "' name='" + inputName + "'><option value='Volvo'>Volvo</option><option value='Ford'>Ford</option><option value='SAAB'>SAAB</option><option value='Toyota'>Toyota</option><option value='BMW'>BMW</option><option value='OTHERS'>OTHERS</option></select>";
        return input;
    }
     
      
    function createLabel(forArrt) {
         var label = document.createElement( "label" );
      
         label.setAttribute( "for", forArrt );
         label.innerHTML = "Select a value: ";
      
         return label;
    }

    Please tell me what I am doing wrong as I am not very good at javascript. Besides, how do I get the value into a variable so I can get this over to the database.

    Any assistance will be appreciated.

    Thank you guys.
  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 16 Jul 2013 Link to this post

    Hi Abdul,

    This java script throws an error:
    function createSelect(inputID, inputName)
    {
        var input = "<select id='" + inputID + "' name='" + inputName + "'><option value='Volvo'>Volvo</option><option value='Ford'>Ford</option><option value='SAAB'>SAAB</option><option value='Toyota'>Toyota</option><option value='BMW'>BMW</option><option value='OTHERS'>OTHERS</option></select>";
        return input;
    }

    because it creates a string instead of object. Try to replace this code with:
    function onClientFileUploaded(radAsyncUpload, args) {
        var row = args.get_row(),
             inputName = radAsyncUpload.getAdditionalFieldID("Select"),
             inputID = inputName,
             select =  createSelect(inputID, inputName),
             label = createLabel(inputID),
             br = document.createElement("br");
     
        row.appendChild(br);
        row.appendChild(label);
        row.appendChild(select);
     
    }
     
    function createSelect(inputID, inputName) {
        var select = document.createElement("select");
        select.id = inputID;
        select.name = inputName
     
        for (var i = 0; i < 10; i++) {
            var opt = document.createElement("option");
            opt.value = i;
            opt.text = "Option " + i;
            select.appendChild(opt);
        }
     
        return select;
    }
     
    function createLabel(forArrt) {
        var label = document.createElement("label");
     
        label.setAttribute("for", forArrt);
        label.innerHTML = "Select Option: ";
     
        return label;
    }

    then on the server you could get selected value using GetFieldValue():
    protected void rbUpload_Click(object sender, EventArgs e)
    {
        foreach (UploadedFile file in RadAsyncUpload1.UploadedFiles)
        {
            var selectedValue = file.GetFieldValue("Select");
            //Save file into the DB
        }
    }
    Please find the attached sample.

    Regards,
    Hristo Valyavicharski
    Telerik
    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 the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Abdul
    Abdul avatar
    7 posts
    Member since:
    Jun 2013

    Posted 16 Jul 2013 Link to this post

    I want to express my gratitude to you guys for the assistance. I will try the codes sent and will report back. Really appreciate the help.
  5. Abdul
    Abdul avatar
    7 posts
    Member since:
    Jun 2013

    Posted 16 Jul 2013 Link to this post

    Hello Hristo Valyavicharski,

    The Javascript codes worked perfect and I was able to retrieve the value from the select option from the code behind page. The only modification that I did to the javascript was to add an array consisting of my value, text pairs and then looped through the array. I have included this modification to the function createSelect:

    function createSelect(inputID, inputName) {
        var select = document.createElement("select");
        select.id = inputID;
        select.name = inputName
         
        var langArray = [
        {value: "FRD", text: "Ford"},
        {value: "CHV", text: "Chevrolet"}
        {value: "VLV", text: "Volvo"}
        ];
         
        var il = langArray.length;
                
         
        for (var i = 0; i < il; i++) {
            var opt = document.createElement("option");
            opt.value = langArray[i].value;
            opt.text = langArray[i].text;;
            select.appendChild(opt);
        }
         
     
        return select;
    }

    Once again thank you guys.
Back to Top