RadUpload w/Radio buttons additional client fields

Thread is closed for posting
2 posts, 0 answers
  1. Sheepdog
    Sheepdog avatar
    72 posts
    Member since:
    Nov 2005

    Posted 04 Dec 2009 Link to this post

    Hello,

    My users need additional fields on the Radupload control. So following your examples I have added two radio button/group to the form, so the user can select one option or the other, but not both.  I have it workin on my local dev machine IE 8.0 but when moved to a test server, the user using IE 7, cannot select the radio buttons, and on the post back to save the documents, I cannot access the additional field. When I access the test site with my browser (IE 8) it works fine!

    here is the Javascript I am using to add the additional fields,
    <script language="javascript" type="text/javascript">  
    <!--  
    var numberOfCustomFields = 0;  
    function OnClientAddedHandler(sender, eventArgs)  
    {  
      var inputRow = eventArgs.get_row();  
      var uList = inputRow.parentNode;  
      var count = numberOfCustomFields;  
          
      //new row for a User Manual Category check box  
      newRow = document.createElement("li");  
      count++;  
      uList.insertBefore(newRow, inputRow);  
      var label = document.createElement("span");  
      label.innerHTML = "Manuals/Add. info";  
      label.style.fontSize = 12;  
      input = document.createElement("input");  
      input.type = "radio";  
      input.value = "Manual";  
      input.checked = "true";  
      input.name = "group" + count;  
      inputinput.id = input.name = sender.getID(input.name);  
      newRow.appendChild(input);  
      newRow.appendChild(label);  
        
      //new row for a Cut-Sheets Category check box  
      newRow = document.createElement("li");  
      //count++;  
      uList.insertBefore(newRow, inputRow);  
      var label = document.createElement("span");  
      label.innerHTML = "FFE Cut Sheet";  
      label.style.fontSize = 12;  
      input = document.createElement("input");  
      input.type = "radio";  
      input.value = "Cutsheet";  
      input.name = "group"+ count;  
      inputinput.id = input.name = sender.getID(input.name);  
      newRow.appendChild(input);  
      newRow.appendChild(label);  
       
      // Set the number of fields from the count    
      numberOfCustomFields = count;  
    }  
    function OnClientDeletingHandler(sender, eventArgs)  
    {  
       var input = eventArgs.get_fileInputField();  
       deleteCustomFields(input);  
    }  
    function OnClientDeletingSelectedHandler(sender, eventArgs)  
    {  
      var inputs = eventArgs.get_fileInputFields();  
        
      for (i = 0; i < inputs.length; i++)  
      {  
        deleteCustomFields(inputs[i]);       
      }  
      eventArgs.set_cancel(true);  
    }  
    function deleteCustomFields(input)  
    {  
       var li = input.parentNode.parentNode;  
       var ul = input.parentNode.parentNode.parentNode;  
         
       for (var i = 0; i < numberOfCustomFields; i++)  
       {     
           ul.removeChild(li.previousSibling);          
       }      
       ul.removeChild(li);  
    }  
     
    // --> 
    </script> 

  2. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 11 Dec 2009 Link to this post

    Hello Sheepdog,

    Indeed, there is  a problem with the mentioned code under IE7. In order to workaround this issue, I suggest that you use the following code instead:

    function onClientAddedHandler(sender, eventArgs) {
                var $ = $telerik.$;
                                            var idAddField = sender.getID("additional");
                $(".ruInputs li[class='']:first")
                     .before($("<span>RadioButton1</span>"))
                     .before($("<input type='radio' />").attr("name", idAddField).val("Value1"))
                     .before($("<span>RadioButton2</span>"))
                     .before($("<input type='radio' />").attr("name", idAddField).val("Value2"));
     
            }

    It will produce two radio buttons above the RadUpload. On the server, you can access their values the following way:

    foreach (UploadedFile f in RadUpload1.UploadedFiles)
     {
       string radioButton = f.GetFieldValue("additional");
     }



    Sincerely yours,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top