File Upload using RadAjaxPanel, RadAjaxLodingPanel and RadAjaxManager

[Jessie]

Hi, 

I'm using RadUpload to upload the photo. 

After I selected the photo and click the Upload Button, I want to refresh the image in DataList only by using RadAjaxPanel, RadAjaxLodingPanel and RadAjaxManager.  

I don't want the whole page doing the postback. How can i do that? 

 

 

 

<telerik:RadUpload ID="uplPhoto" runat="server" ControlObjectsVisibility="None" MaxFileInputsCount="1" >
        </telerik:RadUpload>

        <asp:Button ID="btnUpload" runat="server" Text="Upload" onclick="btnUpload_Click" />

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
        <asp:DataList ID="dtlPhoto" runat="server" DataKeyField="CreatedBy"
            DataSourceID="odsPhoto" RepeatDirection="Horizontal" RepeatColumns="3"
            onitemdatabound="dtlBlogPhoto_ItemDataBound">
            <ItemTemplate>
                <img id="img1" alt="" src='<%# Eval("Location") %>' />
            </ItemTemplate>
        </asp:DataList>
        </telerik:RadAjaxPanel>

<telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="btnUpload">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="dtlPhoto"
                            LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManagerProxy>

        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default">
        </telerik:RadAjaxLoadingPanel>

 

Thanks.

Regards,
Jessie

[Pavlina]

Hi Jessie,

We highly recommend avoid working with the RadAjaxManager & RadAjaxPanel controls at the same time. Use the controls depending on your exact scenario as recommended here.
Additional information is available here:
Ajaxifying controls wrapped in RadAjaxPanel and added to AJAX Manager settings

Regards,
Pavlina
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.

[Jessie]

Hi Pavlina,

Thanks for your reply.

I had tried yr recommendation(as below) but it still will refresh the whole page. I just want to refresh the DataList only after click the Upload button. Thanks.

<telerik:RadUpload ID="uplPhoto" runat="server" ControlObjectsVisibility="None" MaxFileInputsCount="1">
</telerik:RadUpload>

<asp:Panel ID="Panel1" runat="server">
<asp:Button ID="btnUpload" runat="server" Text="Upload" onclick="btnUpload_Click" />
</asp:Panel>

<telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="btnUpload">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="dtlPhoto"
                            LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManagerProxy>

[Pavlina]

Hi Jessie,

Please replace RadAjaxManagerProxy with RadAjaxManager control and let me know if it works properly.
I hope this helps to achieve the desired functionality.
 
Greetings,
Pavlina
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.

[Jessie]

Hi Pavlina,

Thanks for your help.

I just replace RadAjaxManagerProxy with RadAjaxManager control and then wrap my JavaScript code in RadCodeBlock  but I still have 1 problem.

When I select the photo and click Upload button, the uplPhoto.UploadedFiles.Count become 0.

 

<telerik:RadUpload ID="uplPhoto" runat="server" ControlObjectsVisibility="None" MaxFileInputsCount="1">
</telerik:RadUpload>

<asp:Button ID="btnUpload" runat="server" Text="Upload" onclick="btnUpload_Click" />


<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="btnUpload">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="dtlPhoto"
                            LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>

[Pavlina]

Hi Jessie,

If the issue persists, I will ask you to open a formal support ticket and supply a small project, demonstrating this erroneous behavior, for additional testing and review.

Kind regards,
Pavlina
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.

[Jaya]

Hi
Pavlina's

How to use radupload with radajaxpanel without Postback any one Guide me. I am new in Telerik Controls

[Pavlina]

Hello,

RadUpload cannot upload files using AJAX calls. This is a limitation of the XmlHttpRequest component, used in all AJAX frameworks for asynchronous calls to the application. In order to upload a file your application must perform a full page postback. You cannot use AJAX behavior while uploading files. For more information on the subject you can refer to the article below:
http://www.telerik.com/help/aspnet-ajax/upload-uploading-ajax.html

Regards,

Pavlina
Telerik

 

 

[Mohamad]

Hey sir,
I really wonder why do you make this control called "RadAjaxPanel" it really bad one, the normal ajax update panel is one hundred time better than yours, after spending weeks in doing some aspx pages with the "RadAjaxPanel" I found that the "asp:UpdatePanel" did it for me just like that. your control really need too much improvement and reliability assurance. I sorry to tell you that I don't recommend your item at all.
sorry

[Mohamad]

Hey sir,
I really wonder why do you make this control called "RadAjaxPanel" it really bad one, the normal ajax update panel is one hundred time better than yours, after spending weeks in doing some aspx pages with the "RadAjaxPanel" I found that the "asp:UpdatePanel" did it for me just like that. your control really need too much improvement and reliability assurance. I sorry to tell you that I don't recommend your item at all.
sorry