Invalid argument error with an AsyncFileUpload inside a modalpopupextender - asp.net

I receive this error when the page loads: Invalid argument.
On this line:
a._innerTB.style.width=a._inputFile.offsetWidth-107+"px"
If I remove this attribute UploaderStyle="Modern", I don’t have the error. Also, if I use the control without the ModalPopupExtender, I don’t have the error as well.
Do you have an idea how can I resolve this problem with the cool Modern style?
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ajax:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</ajax:ToolkitScriptManager>
<div>
<asp:Button ID="btnOpen" runat="server" Text="Open" />
<ajax:ModalPopupExtender ID="pnlUpload_mpe" runat="server" DynamicServicePath=""
Enabled="True" TargetControlID="btnOpen" PopupControlID="pnlUpload" BackgroundCssClass="modalBackground">
</ajax:ModalPopupExtender>
<%--ModalPopup file upload--%>
<asp:Panel ID="pnlUpload" runat="server">
<script type="text/javascript" language="javascript">
function uploadComplete(sender, args) {
var filename = args.get_fileName();
var contentType = args.get_contentType();
var text = "Size of " + filename + " is " + args.get_length() + " bytes";
if (contentType.length > 0) {
text += " and content type is '" + contentType + "'.";
}
$get("<%=lblStatus.ClientID %>").innerText = text;
}
function uploadError(sender, args) {
$get("<%=lblStatus.ClientID %>").innerText = args.get_fileName(), "<span style='color:red;'>" + args.get_errorMessage() + "</span>";
}
function startUpload(sender, args) {
$get("<%=lblStatus.ClientID %>").innerText = 'Uploading Started.';
}
</script>
<br />
<br />
<ajax:AsyncFileUpload ID="AsyncFu" runat="server" Width="300" UploaderStyle="Modern"
OnClientUploadError="uploadError" OnClientUploadStarted="startUpload" OnClientUploadComplete="uploadComplete"
ThrobberID="ibWait" OnUploadedComplete="AsyncFu_UploadedComplete" />
<asp:ImageButton ID="ibWait" runat="server" ImageUrl="~/images/Wait.gif" AlternateText="loading" />
<br />
<br />
<asp:Label ID="lblStatus" runat="server" Text="Label"></asp:Label>
<br />
<br />
<asp:Button ID="btnOk" runat="server" Text="Ok" Width="64" />
<br />
<br />
</asp:Panel>
</div>
</form>
</body>
</html>
Code behind:
protected void AsyncFu_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
}
Thanks.

I'd wrap a div with the image around it to force it to take that background image:
<div style="background:url(/WebResource.axd?d=4aicOdyPTcU1uCDL6TJaMogi8jp7nEFhFdMy-zDDeZJHfZibfnO3WL4-FoFVjZ0IkhjgO6JOuY3LFuoQynhgqy49bl_CUdY4W5bofG0AYNxySS0gZV5Juyg6wn8MYlfPPLaCzhYwPDsFiLP25YErWX8X0GHvUyt9wnznVOgENUo1&t=634092594280000000) no-repeat 100% 1px; height:24px; margin:0px;width:300px;">
<ajax:AsyncFileUpload ID="AsyncFu" runat="server" Width="300" UploaderStyle="Modern"
OnClientUploadError="uploadError" OnClientUploadStarted="startUpload" OnClientUploadComplete="uploadComplete"
ThrobberID="ibWait" OnUploadedComplete="AsyncFu_UploadedComplete"/>
</div>

I have solved this by setting the UploaderStyle="Traditional". Don't know how but it works.

Related

Custom validator not working in asp.net

Why didn't it work?
If the user selects “Programmer” in the drop down list and inputs “12” to the textbox, I want the validation to fire. But nothing’s happening when I click the submit button.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script language="JavaScript">
var text = document.getElementById("Textbox2");
function Date(oSrc, args) {
args.IsValid = (args.Value == "Programmer" && text == "12");
}
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
<asp:CustomValidator ID="dateValidator" runat="server"
ClientValidationFunction="Date" ControlToValidate="DropDownList1" Display="Dynamic"
ErrorMessage="Sample error!"></asp:CustomValidator>
<asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem Selected="True">Select a profession</asp:ListItem>
<asp:ListItem>Programmer</asp:ListItem>
<asp:ListItem>Lawyer</asp:ListItem>
<asp:ListItem>Doctor</asp:ListItem>
<asp:ListItem>Artist</asp:ListItem>
</asp:DropDownList>
</div>
</form>
</body>
</html>
try below
<script language="JavaScript">
function Date(oSrc, args) {
args.IsValid = (args.Value == "Programmer" && document.getElementById('<%=TextBox2.ClientID%>').value== "12");
}

Removing scrollbar from RadWindow

Code contains RadWindow with RadSplitter, inside which are two RadPanes. Second pane contains RadTextBox.
I'am trying to remove scrollbars from window and i tried solutions like Scrolling="None", fixed positioning, but nothing seems to work.
This is what i get.
This is what i'am trying to accomplish
Code:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="DefaultCS2.aspx.cs" Inherits="RadControlsWebApp1.DefaultCS2" %>
<%# Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>Modal Popup</title>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="QsfSkinManager" runat="server" Skin="Office2007" />
<telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
<telerik:RadAjaxPanel runat="server" ID="rapConfiguration" LoadingPanelID="ralpConfiguration" HorizontalAlign="NotSet">
<telerik:RadWindow ID="modalPopup" VisibleStatusbar="false" runat="server" AutoSize="true" OnClientResize="ResizeRadSplitter" OnClientCommand="ResizeRadSplitter">
<ContentTemplate>
<telerik:RadSplitter ID="MainSplitter" runat="server" Height="100%" Width="100%" Orientation="Horizontal">
<telerik:RadPane ID="Radpane4" runat="server" Width="100%">
Splitter Top Pane
</telerik:RadPane>
<telerik:RadSplitBar ID="Radsplitbar4" runat="server" CollapseMode="Forward">
</telerik:RadSplitBar>
<telerik:RadPane ID="Radpane5" runat="server" Height="100%" Scrolling="None" Width="100%">
<telerik:RadTextBox ID="chatBox" runat="server" TextMode="MultiLine" Resize="None" Rows="10" Width="100%"
EmptyMessage="type here" AutoPostBack="true" BorderStyle="None" Style="border: none; margin: 0 auto; outline: none">
</telerik:RadTextBox>
</telerik:RadPane>
</telerik:RadSplitter><br />
</ContentTemplate>
</telerik:RadWindow>
</telerik:RadAjaxPanel>
<telerik:RadCodeBlock runat="server" ID="rdbScripts">
<script type="text/javascript">
function ResizeRadSplitter(sender, args) {
var splitter = $find("<%=MainSplitter.ClientID %>");
var container = $telerik.$(sender.get_contentElement());
splitter.resize(container.width(), container.height());
}
function showDialogInitially() {
var wnd = $find("<%=modalPopup.ClientID %>");
wnd.show();
Sys.Application.remove_load(showDialogInitially);
}
Sys.Application.add_load(showDialogInitially);
</script>
</telerik:RadCodeBlock>
</form>
Try the following CSS and it should work
<style type="text/css">
#modalPopup_C
{
overflow:hidden !important;
}
</style>
Thanks
AB
The above solution worked for me with 1 tweak due to the client ID changing. My css looked like this:
#<%=modalPopup.ClientID %>_C
{
overflow:hidden !important;
}

Calendar extender is not working

I have a requirement to show edit panel as second row of a datagrid upon addnew link click. for this I have taken a div which has set display:none. I am able to show as second row upon addnew link click. now the actual problem starts.
this div got a text box which is tied to calendar extender to behave as a claendar upon textbox click. but calendar is not showing up when the html of invisible div is inserted as second row of grid. please let me know if anyone need code for better understanding the problem. any help will be appreciated.
In your gridview put a templatedfield instead of a div. make that templated field hold a textbox and calender extender.
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
but If you want it when your inserting you should put
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</ItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</InsertItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I hope this helps.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxControlToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
function AddCalendars()
{
//The last parameter should be the TargetControl's id. If you use "TextBox1", the TextBox1 would be associated.
var elem = $(".deneme");
for (var a = 0; a < elem.length; a++)
{
if ($find("CalendarExtender" + elem[a].id))
{
$find("CalendarExtender" + elem[a].id).dispose();
}
}
for (var i = 0; i < elem.length; i++)
{
$create(AjaxControlToolkit.CalendarBehavior, { "id": "CalendarExtender" + elem[i].id }, null, null, elem[i]);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<%--the dummy calendar which is used to download the related script file.--%>
<asp:TextBox ID="dummyTextBox" runat="server" Style="display: none"></asp:TextBox>
<AjaxControlToolkit:CalendarExtender ID="dummyCalendarExtender" runat="server" Enabled="True"
TargetControlID="dummyTextBox">
</AjaxControlToolkit:CalendarExtender>
<%--the dummy calendar which is used to download the related script file.--%>
<asp:Button ID="Button1" OnClientClick="AddCalendars();return false" runat="server"
Text="CreateCalendarFromClient" /><br />
input:<input id="deneme1" type="text" class="deneme" /><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
TextBox:
<asp:TextBox ID="deneme2" runat="server" cssclass="deneme" ClientIDMode="Static"></asp:TextBox>
</div>
</form>
</body>
</html>

How to get data from controls in Repeater

I have repeater with item template:
<asp:Repeater ID="queryParametersRepeater" runat="server"
DataSourceID="queryParametersObjectDataSource">
<ItemTemplate>
<tr class="itemTemplate">
<td class="labelTd" style="width: 300px;">
<asp:HiddenField runat="server" Value='<%# Eval("ParameterType") %>' />
Define <%# Eval("ParameterName") %> (type <%# Eval("ParameterType") %>)
</td>
<td class="valueTd">
<asp:TextBox runat="server" Width="300px" Text='<%# Eval("ParameterName") %>' />
<asp:CheckBox runat="server" Width="300px" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
In jQuery I change display property of textBox and chekBox. How can I get data from those controls?
I can't use FindControls() function, because I don't know id of my controls.
You can use ID's and findcontrol to get the values. Here is a working example:
<%# Page Language="C#" %>
<%# Import Namespace="System.Collections.Generic" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//bind the data source
RepeaterExample.DataSource = new List<KeyValuePair<int, string>>{
new KeyValuePair<int, string>(1, "Test1"),
new KeyValuePair<int, string>(2, "Test2"),
new KeyValuePair<int, string>(3, "Test3")
};
RepeaterExample.DataBind();
}
}
protected void cmdSubmit_Click(object sender, EventArgs e)
{
//read the values and output them
litResults.Text = "";
foreach (RepeaterItem i in RepeaterExample.Items)
{
TextBox txtExample = (TextBox)i.FindControl("txtExample");
if (txtExample != null)
{
litResults.Text += txtExample.Text + "<br />";
}
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="RepeaterExample" runat="server">
<HeaderTemplate>
test</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txtExample" runat="server" Text='<%#Eval("Value") %>'></asp:TextBox>
</ItemTemplate>
</asp:Repeater><br />
<asp:Button ID="cmdSubmit" runat="server" Text="Submit" OnClick="cmdSubmit_Click" />
<br />
<asp:Literal ID="litResults" runat="server"></asp:Literal>
</div>
</form>
</body>
</html>
Can you add a class to your controls?
If so you could try with $(".givenClass").

Why do I get "Error: object expected" when trying to call jQuery?

Code produces an "error object expected" on:
<script type ="text/javascript" >
var doRedirect = function() { location.href='http://www.google.com' };
$("#<%=Button1.ClientId%>").click(function() {
$("#<%=Label1.ClientId%>").show();
window.setTimeout("$('#<%=Label1.ClientId%>').fadeOut('slow', doRedirect)", 10000);
});
</script>
What is wrong in this code?
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div style="color: #009933; font-weight: 700">
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
<p style="color: #336600; font-weight: 700">
<asp:Label ID="Label1" runat="server" Text="Label" Visible="False"></asp:Label>
</p>
</form>
<script type ="text/javascript" >
var doRedirect = function() { location.href='http://www.google.com' };
$("#<%=Button1.ClientId%>").click(function() {
$("#<%=Label1.ClientId%>").show();
window.setTimeout("$('#<%=Label1.ClientId%>').fadeOut('slow', doRedirect)", 10000);
});
</script>
</body>
</html>
You probably need to include a jQuery reference inside your <head>
<script src="javascript/jquery-1.3.2.min.js" type="text/javascript"></script>
http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=609
IF you do have jQuery and that is not the problem, you will not be able to make a label appear using javascript if you have it hidden server side...
This will not be part of the page, so you cannot just make it visible:
<asp:Label ID="Label1" runat="server" Text="Label" Visible="False"></asp:Label>
You could hide it like this perhaps
<asp:Label ID="Label1" runat="server" Text="Label" style="display:none;"></asp:Label>
Does that help?

Resources