Asp:FileUpload and RAD ajaxmanager not working together - asp.net

I have following code for uploading a file:
<asp:Panel ID="pnlCauses" runat="server">
<asp:FileUpload ID="uplCauses" runat="server" />
<asp:Button runat="server" ID="btnUplCauses" Text="Upload" OnClick="btnUplCauses_Click" />
<asp:Label runat="server" ID="lblUplCausesStatus" Text="Upload status: " />
</asp:Panel>
And i have used following code to allow only pnlCauses to refresh.
<rad:AjaxSetting AjaxControlID="btnUplCauses">
<UpdatedControls>
<rad:AjaxUpdatedControl ControlID="pnlCauses" />
</UpdatedControls>
</rad:AjaxSetting>
But seems Upload control and Ajax dont work together.
Can anyone suggest me alternatives ? That how can i allow only panel to refresh and not complete page ?

ASP.NET FileUpload cannot upload files using AJAX calls. You must force a postback request, or use a control like RadAsyncUpload to upload files asynchronously.
Telerik documentation has a workaround for older Telerik ASP.NET controls on how to disable upload button AJAX calls in a RadAjaxPanel:
<script type="text/javascript">
//on upload button click temporarily disables ajax to perform upload actions
function conditionalPostback(sender, args)
{
if(args.EventTarget == "<%= ButtonSubmit.UniqueID %>")
{
args.EnableAjax = false;
}
}
</script>
<rada:radajaxpanel runat="server" id="RadAjaxPanel1"
clientevents-onrequeststart="conditionalPostback">
<rad:radupload runat="server" id="RadUpload1" />
<asp:button id="ButtonSubmit" runat="server" text="Upload" />
</rada:radajaxpanel>

Related

Call hidden ASP.NET FileUpload control from a Button control

I have a webpage containing one ASP.NET file upload control and a button to upload the file to server. The existing code looks like below.
<div runat="server" style="width: 110%">
<asp:FileUpload ID="fileUpload" runat="server" />
<asp:Button ID="BtnFileUpload" runat="server" OnClick="BtnFileUpload_Click" Text="Upload" />
</div>
But our client don't want to see the default look and feel of a standard file upload control. He wants us to add another button and wrap the file upload control with the button, so that whenever user clicks on the button, file upload dialog window opens.
Thanks
you cna do that using jquery you can set fileupload visiblity as none and can open fileuploader from button click like
<div runat="server" style="width: 110%">
<asp:FileUpload style="display:none" ID="fileUpload" runat="server" />
<asp:Button ID="BtnFileUpload" runat="server" onclick="$('#fileUpload').trigger('click'); return false;" OnClick="BtnFileUpload_Click" Text="Upload" />
</div>
you need to reference of jquery for this.
In addition to #Kevin Shah's solution, I got it working this way:
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="BtnFileUpload" runat="server" OnClientClick="$('#ContentPlaceHolder1_FileUpload1').trigger('click'); return false;" Text="Upload" />
My Webform is inside a MasterPage, so I had to look at "View source" while debugging in Chrome to get the correct element ID ContentPlaceHolder1_FileUpload1 instead of just FileUpload1

cannot access js code in content page

I took one masterpage and one web form selected with the first master page.
In this webform i took textbox and button. Button's OnClientClick property set with validate()
I took one JScript.js file in that i write the following function :
function validate() {
var no = document.getElementById('<%=TextBox1.ClientID %>').value;
if (isNaN(no)) {
alert('not a number.');
}
}
In default.aspx page i write the textbox and button code is as following
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" onclientclick="validate()" Text="Button" />
In master page's head section i call the js file as following :
<script src="JScript.js" type="text/javascript">
</script>
So the my question is this is not worked the alert message not appears as i write non numeric number in textbox.
You can't use asp .net binding syntax in js files.
this will be rendered the same in your js file, and will not contain ur TextBox1ClientId:
var no = document.getElementById('<%=TextBox1.ClientID %>').value;
either pass the client Id from your aspx page as a parameter to the validate method, or embed your javascript function in ur aspx.
You can add clientIDMode="Static" in your control.
<asp:TextBox ID="TextBox1" runat="server" clientIDMode="Static"></asp:TextBox>
<asp:Button ID="Button1" runat="server" clientIDMode="Static" onclick="Button1_Click" onclientclick="validate()" Text="Button" />
Or if you want to make it project level, just add the line in web config file
<pages clientIDMode="Static"></pages>
inside <system.web>.

My modal window is not transferring values to vb.net codebehind

I am getting the username and password to run some scripts
<act:ModalPopupExtender ID="unixLoginMPE" runat="server" TargetControlID="rdoUnix"
PopupControlID="unixPanel" BackgroundCssClass="modalBackground" CancelControlID="unixCancel" OkControlID="unixSubmit"
/>
<asp:Panel ID="unixPanel" runat="server"
CssClass="modalPopup" align="center" Style="display: none">Unix Username: <asp:TextBox ID="unixName" ClientIDMode="Static" runat="server" />
<br />
Unix Password: <asp:TextBox ID="unixPass" runat="server" ClientIDMode="Static" TextMode="Password" />
<br />
<asp:Button ID="unixCancel" runat="server" Text="Cancel" />
<asp:Button ID="unixSubmit" ClientIDMode="Static" runat="server" Text="Submit" OnClientClick="enableRDO()" />
</asp:Panel>
In my codebehind, I'm doing something like this just to test if the values have passed.
Dim UNIXPASSWORD As String = unixPass.text
Dim UNIXUSERNAME As String = unixName.Text
MsgBox(UNIXCOMPUTERNAME)
MsgBox(UNIXUSERNAME)
MsgBox(UNIXPASSWORD)
I do reference a script to enable the radio button. I asked a question to help me with that issue, it is all resolved Radio Button won't stay check if I have a modal window open up when it is selected
<script type="text/javascript">
function enableRDO() {
var cancel = document.getElementById('rdoUnix');
cancel.setAttribute('checked', 'true');
};
</script>
For some reason the values are passing just fine in Google Chrome but not in IE. I've been at this for a few hours and don't know what else to try...or search for
EDIT:
I'm still trying to attempt this. I setup up dummy text boxes which I will hide later on if I can pass to them. I'm still very lost with this...
<asp:TextBox ID="dummyUnixName" runat="server" />
<asp:TextBox ID="dummyUnixPass" runat="server" />
If you aren't performing a postback or an AJAX call, nothing will be passed to the code behind.
During debugging, Console.WriteLine can be redirected to the output window in VS; in production, it's going to go nowhere. A logging solution is often appropriate for a web application which needs to know more of what happened than which page was requested by a user (IIS logs).

why ajax loader image always shown using jquery and asp.net

with asp.net code below my ajax_loader image doesn't work well and always shown ..
<asp:ScriptManager ID="MainScriptManager" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label runat="server" ID="lblname">
Name</asp:Label><br />
<asp:TextBox runat="server" ID="txbname"></asp:TextBox><br />
<asp:Label ID="lblemail" runat="server">
Email</asp:Label><br />
<asp:TextBox runat="server" ID="txbemail" /><br />
<asp:Label runat="server" ID="lblsugg">
Suggestion</asp:Label><br />
<asp:TextBox runat="server" Rows="3" Columns="20" ID="txbsugg" TextMode="MultiLine"></asp:TextBox>
<asp:Button runat="server" ID="btnsubmit" OnClick="btnsubmit_onclick" Text="submit" />
<asp:Label runat="server" ID="lblresultmsg"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<div id="loading">
<p>
<img src="Images/ajax-loader.gif" />
Please Wait</p>
</div>
and jquery code
$("#loading").ajaxStart(function() {
$(this).show();
}).ajaxStop(function() {
$(this).hide();
});
any suggestions !?
ajaxStart and ajaxStop works only for ajax request sent by jQuery, if you use other libraries or UpdatePanel, it won't help you.
jQuery only.
Whenever an Ajax request is about to be sent {With jQuery-gdoron}, jQuery checks whether there are any other outstanding Ajax requests. If none are in progress, jQuery triggers the ajaxStart event. Any and all handlers that have been registered with the .ajaxStart() method are executed at this time.
Example of jQuery ajax request that will fire the ajaxStart and ajaxStop:
$.ajax({
url: 'foo',
...
...
});
You could create a generic way to handle this by adding the following code to a common js include. Here's a quick and dirty example:
Note: Be sure you initialize it by calling SetupGlobalAjaxHandlers on your page load.
function SetupGlobalAjaxHandlers()
{
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
}
function InitializeRequest(sender, args)
{
if(typeof(OnPageInitRequest) != "undefined")
OnPageInitRequest();
}
function EndRequest(sender, args)
{
if(typeof(OnPageEndRequest) != "undefined")
OnPageEndRequest();
}
Then, in any page that includes the js file, you could optionally implement the OnPageInitiRequest() and OnPageEndRequest() methods. There, you could show/hide your loading indicator.
I do recommend, though, that you use an UpdateProgress control as you get the show/hide logic for free.
This technique opens up some possibilities for you, say, if you wanted to disable controls while a partial postback is occurring.

Show "passed" image or text after validating an asp.net (req. field)validator

I have the following asp.net code:
<asp:TextBox CssClass="mf" runat="server" ID="mail1" Width="270" />
<asp:RequiredFieldValidator ID="rfv1"
runat="server"
ControlToValidate="mail1"
Display="Dynamic" />
Now I want to show an image (or text) if the validation passes on the fly (no postback)
A jQuery solution is also fine by me, but that wouldn't be so safe if javascript is disabled.
Without relying on an external framework you can tap into the ASP.Net Client Side Validation framework to handle extended/advanced functionality. In this way you are working with the framework, augmenting it instead of replacing it.
A tiny bit of JavaScript is all that is needed to enable the behavior you want.
<asp:TextBox CssClass="mf" runat="server" ID="mail1" Width="270" OnChange="showValidationImage();" />
<asp:RequiredFieldValidator ID="rfv1"
runat="server"
ControlToValidate="mail1" ClientIDMode="Static"
Display="Dynamic" >
<img src="../Image/fail.jpg" />
</asp:RequiredFieldValidator>
<img id="imgPass" src="../Image/pass.jpg" style="visibility:hidden" />
<script language="javascript">
// This function will be called whenever the textbox changes
// and effectively hide or show the image based on the state of
// the client side validation.
function showValidationImage() {
if (typeof (Page_Validators) == "undefined") return;
// isvalid is a property that is part of the ASP.Net
// client side validation framework
imgPass.style.visibility = rfv1.isvalid ? "visible" : "hidden";
}
</script>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
Notice here that I am using a feature of ASP.Net 4 with ClientIDMode="Static" if you are not using .Net 4 then you will need to use the standard <%= rfv1.ClientID %> server side include to get at the client id inside your script.

Resources