This is a migrated thread and some comments may be shown as answers.

Upload with custom fields - Clear problem

5 Answers 107 Views
Upload (Obsolete)
This is a migrated thread and some comments may be shown as answers.
Ali Mohamad
Top achievements
Rank 1
Ali Mohamad asked on 23 Mar 2010, 07:19 PM
Hi,

I am having a problem with the Radupload functionality in relation to the Clear button and custom fields; when I click on the clear button the control removes itself and creates a new version but it does not seem to remove the previous instance of the custom field resulting in two copies of the field after the clear is complete.  I used a Javascript example I found on this forum to add the custom field in the "OnClientAdded" event handler, but I guess the example is missing the cleanup logic.  I included placeholders for the OnClientClearing and OnClientDeleting event handlers ready for some logic :-)
Below is the code, can you help please?

Explanation:  the RadUpload control is being used within a grid that displays a list of document placeholders, when the document does not have an attached document, the RadUpload control is displayed, otherwise it is hidden and disabled.  Documents' Streams are being uploaded to a database using the dynamic property docid and docbarcode.  BTW, there is a save button above the grid (not displayed in code) that causes a full page postback.

Thank you
Ali M.

UploadDocuments.aspx
<telerik:RadGrid ID="RadGrid1" runat="server" AllowMultiRowSelection="false" GridLines="None" 
    Width="100%" Height="500px" AllowSorting="true" EnableAjaxSkinRendering="true" 
    EnableViewState="true" AutoGenerateColumns="false"
    <MasterTableView AllowAutomaticUpdates="true" AutoGenerateColumns="false" AllowCustomSorting="true" 
        AllowNaturalSort="false" NoMasterRecordsText="This item has no documents"
            <Columns> 
                <telerik:GridBoundColumn UniqueName="DocumentID" DataField="DocumentID" HeaderText="ID" Display="false"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="Barcode" DataField="Barcode" HeaderText="Barcode" Display="true" ItemStyle-Width="110px"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="Type" DataField="Type" HeaderText="Document Type" Display="true" ItemStyle-Width="200px"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="FolderID" DataField="ID" HeaderText="FolderID" Display="false"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="ReceivedOn" DataField="Received On" HeaderText="Received On" Display="true" ItemStyle-Width="70px"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="LinkedOn" DataField="Linked On" HeaderText="Linked On" Display="true" ItemStyle-Width="70px"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="FileType" DataField="File Type" HeaderText="File Type" Display="true" ItemStyle-Width="130px"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="eDocSource" DataField="eDocSource" HeaderText="eDocSource" Display="false"></telerik:GridBoundColumn> 
                <telerik:GridBoundColumn UniqueName="Ref1" DataField="Ref1" HeaderText="Ref1" Display="false"></telerik:GridBoundColumn> 
                <telerik:GridCheckBoxColumn UniqueName="Linked" DataField="Linked" HeaderText="Linked" Display="false"></telerik:GridCheckBoxColumn> 
                <telerik:GridTemplateColumn UniqueName="doclink" ItemStyle-Width="300px"
                    <ItemTemplate> 
                        <telerik:RadUpload ID="RadUpload1" runat="server" MaxFileInputsCount="1" RegisterWithScriptManager="true" 
                                TargetFolder="" OnValidatingFile="RadUpload1_ValidatingFile" EnableFileInputSkinning="true" 
                                ControlObjectsVisibility="RemoveButtons" Visible='<%# IIf(DataBinder.Eval(Container.DataItem, "Linked"), false, true) %>' 
                                Enabled='<%# IIf(DataBinder.Eval(Container.DataItem, "Linked"), false, true) %>' 
                                docid='<%# DataBinder.Eval(Container.DataItem, "DocumentID") %>' InputSize="25" 
                                docbarcode='<%# DataBinder.Eval(Container.DataItem, "Barcode") %>' 
                                OnClientAdded="OnClientAddedHandler" OnClientDeleting="OnClientDeleting" OnClientClearing="uploadFileClearing" 
                                OnClientFileSelected="uploadFileSelected"
                        </telerik:RadUpload> 
                    </ItemTemplate> 
                </telerik:GridTemplateColumn> 
            </Columns> 
    </MasterTableView> 
    <ClientSettings EnableRowHoverStyle="true" EnablePostBackOnRowClick="false"
            <Scrolling AllowScroll="true" /> 
            <Selecting AllowRowSelect="true" /> 
            <ClientEvents OnRowCreating="radDummy" OnRowCreated="radDummy" /> 
    </ClientSettings> 
</telerik:RadGrid> 


UploadDocuments.aspx.vb
'*** some validation here - removed from example 
Try 
    _sDocid = TryCast(sender, Telerik.Web.UI.RadUpload).Attributes.Item("docid"
Catch ex1 As Exception 
    _isValid = False 
End Try 
If Not _isValid Then 
    '** deal with invalid upload 
    Return 
End If 
Try 
    _barcode = TryCast(sender, Telerik.Web.UI.RadUpload).Attributes.Item("docbarcode"
Catch ex1 As Exception 
    _isValid = False 
End Try 
If Not _isValid Then 
    '** deal with invalid upload 
    Return 
End If 
 
Try 
    _docName = e.UploadedFile.GetFieldValue("Name"
    _docName = _docName.Trim() 
Catch ex1 As Exception 
    _docName = "" 
End Try 
 
If _docName.Length = 0 Then 
    _docName = String.Format("Document [{0}]", _barcode) 
End If 
 
'** process the upload 
'** -- code removed from example 


uploaddocuments.js
var numberOfCustomFields = 0; 
function OnClientAddedHandler(sender, eventArgs) { 
  var inputRow = eventArgs.get_row(); 
  var uList = inputRow.parentNode; 
  var count = 0; 
 
  // add a new row for a Title field 
  newRow = document.createElement("li"); 
  count++; 
  uList.insertBefore(newRow, inputRow); 
  var label = document.createElement("span"); 
  label.innerHTML = "Name : "
  label.style.width = "150px"
  label.style.fontSize = "10pt"
  label.style.fontWeight = "bold"
  input = document.createElement("input"); 
  input.type = "text"
  input.style.width = "200px"
  input.id = input.name = sender.getID("Name"); 
  newRow.appendChild(label); 
  newRow.appendChild(input); 
 
  //add a File label in front of the file input 
  var fileInputSpan = inputRow.getElementsByTagName("span")[0]; 
  label = document.createElement("span"); 
  label.innerHTML = "File :&nbsp;&nbsp;&nbsp;&nbsp;"
  label.style.width = "150px"
  label.style.fontSize = "10pt"
  label.style.fontWeight = "bold"
  label.style.verticalAlign = "middle"
  label.style.paddingTop = "5px"
  inputRow.insertBefore(label, fileInputSpan); 
  numberOfCustomFields = count; 
}; 
 
function uploadFileClearing(sender, eventArgs) { 
}; 
 
function OnClientDeleting(sender, eventArgs) { 
}; 







5 Answers, 1 is accepted

Sort by
0
Genady Sergeev
Telerik team
answered on 26 Mar 2010, 11:38 AM
Hi Ali Mohamad,

We have a fix for this situation, however, we need to know the exact version of the RadControls that you use. As soon as you post your version here I will supply you with the respective fix.

Sincerely yours,
Genady Sergeev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Ali Mohamad
Top achievements
Rank 1
answered on 29 Mar 2010, 06:40 AM
Hi Genady,

I am running RadControls for ASP.NET AJAX Q3 2009, and the "Telerik.Web.UI.dll" has version "2009.3.1314.20".

Would your fix be different when I upgrade to the 2010 Q1+ version?

Thanks
Ali

0
Genady Sergeev
Telerik team
answered on 30 Mar 2010, 10:37 AM
Hello Ali Mohamad,

You can find sample project demonstrating the approach as an attachment. The solution will work with the latest Telerik.Web.UI version as well as with the version that you currently use.

Best wishes,
Genady Sergeev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Ali Mohamad
Top achievements
Rank 1
answered on 30 Mar 2010, 06:01 PM
Thanks Genady for the example, but it is not working for me.
I am getting an error in the browser that "$telerik" is not defined; I did enable jquery and its intellisense is working in vs but the error occurs in the browser.  This might explain the reason why the clear button does not correctly re-add the custom field.  Any ideas?
Below is the current state of the code...
Ali

uploaddocuments.aspx
<head runat="server"
  <title></title
  <link type="text/css" href="styles.css" rel="Stylesheet" /> 
  <script src="js/uploaddocuments.js" type="text/javascript"></script> 
  <script src="js/jquery-1.2.6.js" type="text/javascript"></script> 
  <script language="javascript" type="text/javascript"
    var _idAddField; 
    var _uploadIndex = 0
    var $ = $telerik.$; 
     
    function onClientAddedHandler(sender, eventArgs) { 
      var _inputRow = eventArgs.get_row(); 
 
      var _label = document.createElement("span"); 
      _label.innerHTML = "Name : "
      _label.style.width = "150px"
      _label.style.fontSize = "10pt"
      _label.style.fontWeight = "bold"
      _input = document.createElement("input"); 
      _input.type = "text"
      _input.style.width = "200px"
      _input_input.id = _input.name = sender.getID("Name"); 
 
      var _wrapper = $('<div></div>').append(_label).append(_input); 
 
      $(_wrapper) 
        .insertBefore(".ruInputs li:eq(" + _uploadIndex + ") .ruFileWrap"); 
 
      _uploadIndex++; 
 
      //add a File label in front of the file input  
      var fileInputSpan = _inputRow.getElementsByTagName("span")[1]; 
      _label = document.createElement("span"); 
      _label.innerHTML = "File :&nbsp;&nbsp;&nbsp;&nbsp;"
      _label.style.width = "150px"
      _label.style.fontSize = "10pt"
      _label.style.fontWeight = "bold"
      _label.style.verticalAlign = "middle"
      _label.style.paddingTop = "5px"
      _inputRow.insertBefore(_label, fileInputSpan); 
    }; 
 
    function onClientClearingHandler(sender, args) { 
      _uploadIndex = $(args.get_row()).index(); 
    }     
  </script> 
</head> 
<body> 
  <form id="form1" runat="server"
  <asp:ScriptManager ID="ScriptManager1" runat="server"
    <Scripts> 
       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> 
    </Scripts> 
  </asp:ScriptManager> 
 
 
<%--  BEGIN radGrid here --%> 
<telerik:GridTemplateColumn UniqueName="doclink" ItemStyle-Width="300px"
  <ItemTemplate> 
    <telerik:RadUpload ID="RadUpload1" runat="server" MaxFileInputsCount="1" RegisterWithScriptManager="true" 
      TargetFolder="" OnValidatingFile="RadUpload1_ValidatingFile" EnableFileInputSkinning="true" 
      ControlObjectsVisibility="ClearButtons" Visible='<%# IIf(DataBinder.Eval(Container.DataItem, "Linked"), false, true) %>' 
      Enabled='<%# IIf(DataBinder.Eval(Container.DataItem, "Linked"), false, true) %>' 
      docid='<%# DataBinder.Eval(Container.DataItem, "DocumentID") %>' InputSize="25" 
      docbarcode='<%# DataBinder.Eval(Container.DataItem, "Barcode") %>' 
      OnClientAdded="onClientAddedHandler" OnClientClearing="onClientClearingHandler"
    </telerik:RadUpload> 
  </ItemTemplate> 
</telerik:GridTemplateColumn> 
<%--  END radGrid here --%> 

0
Genady Sergeev
Telerik team
answered on 31 Mar 2010, 11:43 AM
Hello Ali Mohamad,

The reason for this malfunction is because the line var $ = $telerik.$ is in the head tag and is being executed before ScriptManager has loaded the scripts. In order to workaround this please move var $ = $telerik.$ inside both onClientAddedHandler and onClientCliearingHandler. Moreover, you don't need to manually include jQuery using Script tag, it is automatically shipped to your pages as long as there are RAD controls on it.

Best wishes,
Genady Sergeev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
Upload (Obsolete)
Asked by
Ali Mohamad
Top achievements
Rank 1
Answers by
Genady Sergeev
Telerik team
Ali Mohamad
Top achievements
Rank 1
Share this question
or