Ok, I'm working on a website for a friend's business. I have the layout that he wants. I was going to use the DropShadowExtender on a couple of DIV/Panel controls, just to add some "depth" to the site, since it looks too flat otherwise.

My home setup is WinXP with IE8 and FireFox.

The issue I'm having is that when I apply the DropShadowExtender (using ASP.NET Ajax 4), it looks like it's supposed to -- in FireFox.

Unfortunately, in IE, it's all messed up. The shadow doesn't look like it's supposed to at all, and the layout is completely messed up (shadow over here, container over there, shadow over top of text, shadow doesn't extend length of container, all sorts of problems). However, as soon as I remove the DropShadowExtender, both of the layouts in IE and FireFox basically look the same!

I have a couple of theories as to why, but I can't figure out entirely why this is happening.

1. It's because I'm using percentages or the wrong type of positioning in my CSS.

2. It's because I'm not using the correct DOCTYPE. I've even tried simply <!DOCTYPE> but that didn't really help, either.

3. It's because I incorporated a tad bit of jQuery into the website.

Any assistance would be greatly appreciated!

Hi

i use  below ajax in a js file 

$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "NewHere.aspx/BindDatatable",

data: "{}",
dataType: "json",
success: function(data) {
var theHtml = data.d;
// alert(data.d);
window.location.href = data.d;
},
error: function(result) {
alert("Error is " + result.value);
}
});

and in NewHere.aspx , i have [WebMethod]

but it gives error 

Error is undefined..

also it does not call funtion WebMethod

pls advice issue (is it because i use ajax post in separate js file)

hi

i have a repeater full of data..now on a edit button click the whole data will come into a lightbox and then by json i have to updatye it...kindly can any onehelp me to sort it how..how to do that...i did the part to update it...but from repeater how to get the data to a lightbox

Can someone tel me how to save multiple image using ajax file upload, for a normal upload it is ok but when the ajax file is uploading multiple image how would it save the path of each images please?

is there any example of ajax file uploader with database please

Hello everyone 

I'm trying to upload different images in my database by ajax file uploader, but i have a problem to how to save it as it contain different image which are upload in one go can someone help here are my code

<form id="form1" runat="server"><asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager><div><asp:Label runat="server" ID="myThrobber" Style="display: none;"><img align="absmiddle" alt="" src="images/uploading.gif"/></asp:Label><asp:AjaxFileUpload ID="AjaxFileUpload1" runat="server"
            onuploadcomplete="AjaxFileUpload1_UploadComplete" ThrobberID="myThrobber" MaximumNumberOfFiles="10" AllowedFileTypes="jpg,jpeg"/></div></form>

rotectedSub btnsubmit_Click(ByVal sender AsObject,ByVal e AsSystem.EventArgs)Handles btnsubmit.ClickDim s AsInteger=DropDownList1.SelectedValueDim available AsString="Available"Using conss AsNewSqlConnection(_start)Dim sql1 AsString="INSERT INTO Item (Name,Description,Quantity,Image1,SellerID,CategoryID,DateCreated,Price,Status) VALUES(@Name,@Description,@Quantity,@Image1,@seller,@cat,@Date,@price,@stat)"Dim myCommand1 =NewSqlCommand(sql1, conss)

                conss.Open()
                myCommand1.Parameters.AddWithValue("@Name",TextBox1.Text)
                myCommand1.Parameters.AddWithValue("@Description",TextBox6.Text)
                myCommand1.Parameters.AddWithValue("@Quantity",TextBox3.Text)
                myCommand1.Parameters.AddWithValue("@Image1", filepath)

                myCommand1.Parameters.AddWithValue("@seller", temp)
                myCommand1.Parameters.AddWithValue("@cat", s)
                myCommand1.Parameters.AddWithValue("@Date", finaldate)
                myCommand1.Parameters.AddWithValue("@price",TextBox2.Text)
                myCommand1.Parameters.AddWithValue("@stat", available)
                myCommand1.ExecuteNonQuery()EndProtectedSubAjaxFileUpload1_UploadComplete(ByVal sender AsObject,ByVal e AsAjaxControlToolkit.AjaxFileUploadEventArgs)HandlesAjaxFileUpload1.UploadCompleteDim filePath AsString="~/Seller/images/"&Convert.ToString(e.FileName)AjaxFileUpload1.SaveAs(filePath)

How to bind drop down list dynamically using ajax without page load

I have a called FormView frmcontrato, I want that after click of btnstatus saw jquery it makes the update of the ones of the data of the FormView with the DataBind. What I am ordering in $.post is for making a Update in the data base.

$('#btnstatus').click(function () {
  event.preventDefault();
  $.post('xcrud.aspx?acao=mudastatus&t=contratos&s=<%# Eval("status")%>&codigo=<%# Eval("codigo")%>');<%frmContrato.DataBind()%>;
}); //Click

I tried to use

<%frmContrato.DataBind()%>;

 thus but it did not function.

I have a couple CascadingDropDown Lists, which are working properly. What I can't figure out is how to pre-populate the dropdownlists until a parent selection is made.

Here's an example:

Let's say I have two CascadingDropDowns: 1) Country 2) State

When a user selects a country, the state dropdownlist is enabled and populated using the CascadingDropDown webservice. In this scenario, a user must select a Country to select State. Until a Country is selected, the state cascadingdropdown is disabled (I tried the EnableAtLoading but it failed to load any values in State). I want to popoulate the State DropDown with every state in the database until a Country is selected. At that time, the State list is set to those states associated with the selected country. I hope this makes sense.

So, what I want to do is: Populate every state until a country is selected. At that time, the state ddl is reset to only those associated with that select country in the parent allowing the CascadingDropDown extender to override the dropdownlist data binding. The dropdownlist overrides the cascadingdropdown extender until a parent selection is made.

How is this done?

Here's my ASPX Markup (Keep in mind this works, but does not provide the needed functionality outlined above)

<asp:DropDownList ID="ddlCountries" runat="server" Width="150">
        </asp:DropDownList>
        <ajaxToolkit:CascadingDropDown ID="cdlCountries" TargetControlID="ddlCountries" PromptText="Select Country"
           PromptValue="" ServicePath="LocationCascadeService.asmx" ServiceMethod="GetCountries" runat="server"
           Category="Country" LoadingText="Loading..." />
        <br /><br />
        <asp:DropDownList ID="ddlStates" runat="server" Width="150">
        </asp:DropDownList>
        <ajaxToolkit:CascadingDropDown ID="cdlStates" TargetControlID="ddlStates" PromptText="Select State"
            PromptValue="" ServicePath="LocationCascadeService.asmx" ServiceMethod="GetStates" runat="server"
            Category="State" ParentControlID="ddlCountries" LoadingText="Loading..." />
        <br /><br />
        <asp:DropDownList ID="ddlCounties" runat="server" Width="150">
        </asp:DropDownList>
        <ajaxToolkit:CascadingDropDown ID="cdlCounties" TargetControlID="ddlCounties" PromptText="Select County"
            PromptValue="" ServicePath="LocationCascadeService.asmx" ServiceMethod="GetCounties" runat="server"
            Category="County" ParentControlID="ddlStates" LoadingText="Loading..."  />

Webservice Markup

public class LocationCascadeHerpService : System.Web.Services.WebService
    {
        [WebMethod]
        public CascadingDropDownNameValue[] GetCountries(string knownCategoryValues)
        {
            string query = "SELECT DISTINCT(Country) FROM Location WHERE Country IS NOT NULL ORDER BY Country";
            List<CascadingDropDownNameValue> countries = GetData(query);
            return countries.ToArray();
        }
        [WebMethod]
        public CascadingDropDownNameValue[] GetStates(string knownCategoryValues)
        {
            string country = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)["Country"];
            string query = string.Format("SELECT DISTINCT State FROM Location WHERE Country = '{0}' AND State IS NOT NULL ORDER BY State", country);
            List<CascadingDropDownNameValue> states = GetData(query);
            return states.ToArray();
        }

        [WebMethod]
        public CascadingDropDownNameValue[] GetCounties(string knownCategoryValues)
        {
            string state = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)["State"];
            string query = string.Format("SELECT DISTINCT County FROM Location WHERE State = '{0}' AND County IS NOT NULL ORDER BY County", state);
            List<CascadingDropDownNameValue> counties = GetData(query);
            return counties.ToArray();
        }

        private List<CascadingDropDownNameValue> GetData(string query)
        {
            string conString = ConfigurationManager.ConnectionStrings["ResearchCollectionsConnectionString"].ConnectionString;
            SqlCommand command = new SqlCommand(query);
            List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
            using (SqlConnection con = new SqlConnection(conString))
            {
                con.Open();
                command.Connection = con;
                using (SqlDataReader reader = command.ExecuteReader())
                {
                    while (reader.Read())
                    {
                        values.Add(new CascadingDropDownNameValue
                        {
                            name = reader[0].ToString(),
                            value = reader[0].ToString()

                        });
                    }
                    reader.Close();
                    con.Close();
                    return values;
                }
            }
        }

I am getting an error in an auto generated script when usng the HTMLEditor Extender in IE in an application that is currently in development ... it doesn't seem to happen in Firefox or Chrome. Here is the generated code:

_editableDiv_submit: function () {
                var char = 3;
                var sel = null;

                setTimeout(function () {
                    if (this._editableDiv != null)
                        this._editableDiv.focus();
                }, 0);
                if (Sys.Browser.agent != Sys.Browser.Firefox) {
                    if (document.selection) {
                        sel = document.selection.createRange();
                        sel.moveStart('character', char);
                        sel.select();
                    }
                    else {
                        sel = window.getSelection();
                        sel.collapse(this._editableDiv.firstChild, char);
                    }
                }

                this._textbox._element.value = this._encodeHtml();
            },

When it reaches the line that is in italics in the code above, even thought this._editablediv contains the ID of the HTMLeditor extender, the firstchild of this._editablediv is empty and is set to Nothing producing an error. Does anyone have an ideas what may be causing this ... very frustrating since I can't correct or change auto generated code which I assume is coming from the AjaxToolKit DLL. Below is the page code with the editor extender:

<asp:updatePanel ID="PanelEditHTML" runat="server"><ContentTemplate><div style="border: 1px solid #000000; background-color: #FFFFFF; color: #000000; text-align: left;" class="rounded"><asp:TextBox ID="TextBoxEditHTML" runat="server" TextMode="MultiLine" Rows="7" Columns="70" BorderStyle="None" BorderWidth="0"></asp:TextBox><ajaxToolkit:HtmlEditorExtender ID="HtmlEditorExtender1" runat="server" TargetControlID="TextBoxEditHTML" EnableSanitization="False"><Toolbar><ajaxToolkit:Bold /><ajaxToolkit:Italic /><ajaxToolkit:Underline /><ajaxToolkit:StrikeThrough /><ajaxToolkit:Subscript /><ajaxToolkit:Superscript /><ajaxToolkit:HorizontalSeparator /><ajaxToolkit:JustifyLeft /><ajaxToolkit:JustifyCenter /><ajaxToolkit:JustifyRight /><ajaxToolkit:JustifyFull /><ajaxToolkit:Indent /><ajaxToolkit:InsertOrderedList /><ajaxToolkit:InsertUnorderedList /><ajaxToolkit:HorizontalSeparator /><ajaxToolkit:SelectAll /><ajaxToolkit:UnSelect /><ajaxToolkit:Copy /><ajaxToolkit:Cut /><ajaxToolkit:Delete /><ajaxToolkit:Paste /><ajaxToolkit:RemoveFormat /><ajaxToolkit:HorizontalSeparator /><ajaxToolkit:Undo /><ajaxToolkit:Redo /><ajaxToolkit:HorizontalSeparator /><ajaxToolkit:BackgroundColorSelector /><ajaxToolkit:ForeColorSelector /><ajaxToolkit:FontNameSelector /><ajaxToolkit:FontSizeSelector /></Toolbar></ajaxToolkit:HtmlEditorExtender></div></ContentTemplate></asp:updatePanel>

<div><asp:UpdatePanel ID="updatePanelbooksGridView" runat="server"><ContentTemplate><asp:GridView ID="booksGridView" OnPageIndexChanging="booksGridView_PageIndexChanging" runat="server" AllowPaging="True" PageSize="3"
                    CellPadding="4" ForeColor="#333333" GridLines="None"><AlternatingRowStyle BackColor="White" ForeColor="#284775" /><EditRowStyle BackColor="#999999" /><FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /><HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /><PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" /><RowStyle BackColor="#F7F6F3" ForeColor="#333333" /><SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" /><SortedAscendingCellStyle BackColor="#E9E7E2" /><SortedAscendingHeaderStyle BackColor="#506C8C" /><SortedDescendingCellStyle BackColor="#FFFDF8" /><SortedDescendingHeaderStyle BackColor="#6F8DAE" /></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="booksLinkButton" EventName="Click" /></Triggers></asp:UpdatePanel></div><div><asp:UpdatePanel ID="updatePanelRepeater" runat="server"><ContentTemplate><asp:Repeater ID="booksRepeater" runat="server"><ItemTemplate><asp:LinkButton ID="booksLinkButton" runat="server" Text='<%#Eval("Text") %>' CommandArgument='<%#Eval("Value") %>'
                            Enabled='<%#Eval("Enabled") %>' OnClick="booksLinkButton_Click"></asp:LinkButton></ItemTemplate></asp:Repeater></ContentTemplate></asp:UpdatePanel></div>

A control with ID 'booksLinkButton' could not be found for the trigger in UpdatePanel 'updatePanelbooksGridView'. 
Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

Exception Details: System.InvalidOperationException: A control with ID 'booksLinkButton' could not be found for the trigger in UpdatePanel 'updatePanelbooksGridView'.

Source Error: 
An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below. 

Hi, I trying to upload image using AsyncFileUpload and button. Below is the code I use to do it. But it causing double upload not sure how to let it upload image only after clicking the btnUpload. Current problem is that once I browse the image I want in asyncfileupload control there will be a loading.gif showing it loading and I refresh the page without clicking the btnUpload the image already been upload into database. What I wanted to do was let the image upload ONLY after clicking on the btnUpload. Do help out on solving this problem. THANKS!

Markup Code:

<script type="text/javascript" language="javascript">
        function StartUpload(sender, args) {
            var filename = args.get_fileName();
            var path = args.get_path();
            if (filename != "") {
                // code to get File Extension..
                var arr1 = new Array;
                arr1 = filename.split("\\");
                var len = arr1.length;
                var img1 = arr1[len - 1];
                var filext = img1.substring(img1.lastIndexOf(".") + 1);


                // Checking Extension
                if (filext == "jpg" || filext == "JPG") {
                    $get("<%=lblUpload.ClientID %>").innerHTML = "";
                    $get("<%=btnUpload.ClientID %>").disabled = false;
                    return true;
                }
                else {
                    $get("<%=lblUpload.ClientID %>").innerHTML = "Only .jpg and .JPG image allowed.";
                    $get("<%=btnUpload.ClientID %>").setAttribute('disabled', 'disabled');
                    return false;
                }
            }
        }</script>

<asp:AsyncFileUpload ID="AsyncFileUpload1" runat="server" 
CompleteBackColor="Lime" UploaderStyle="Modern" 
ErrorBackColor="Red" ThrobberID="Throbber" 
OnUploadedComplete="btnUpload_Click" 
UploadingBackColor="#66CCFF"
OnClientUploadStarted="StartUpload"
align="center"/>
<br /><br />
<asp:Label ID="Throbber" runat="server" Style="display: none"><img src="image/indicator.gif" alt="loading" /></asp:Label>
<asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" Text="Upload" />
<br /><br />
<asp:Label ID="lblUpload" runat="server" Text=""></asp:Label>

btnUpload Code:

protected void btnUpload_Click(object sender, EventArgs e)
        {
            if (AsyncFileUpload1.HasFile == true)
            {
                String nric = (String)Session["nric"];

                string filePath = AsyncFileUpload1.PostedFile.FileName;
                string filename = Path.GetFileName(filePath);
                string ext = Path.GetExtension(filename);

                string contenttype = String.Empty;

                switch (ext)
                {
                    case ".jpg":
                        contenttype = "image/jpg";
                        break;

                    case ".JPG":
                        contenttype = "image/jpg";
                        break;
                }
                if (contenttype != String.Empty)
                {
                    System.Drawing.Image uploaded = System.Drawing.Image.FromStream(AsyncFileUpload1.PostedFile.InputStream);

                    System.Drawing.Image newImage = new Bitmap(1024, 768);
                    using (Graphics g = Graphics.FromImage(newImage))
                    {
                        g.InterpolationMode = InterpolationMode.HighQualityBicubic;
                        g.DrawImage(uploaded, 0, 0, 1024, 768);
                    }

                    byte[] results;
                    using (MemoryStream ms = new MemoryStream())
                    {
                        ImageCodecInfo codec = ImageCodecInfo.GetImageEncoders().FirstOrDefault(c => c.FormatID == ImageFormat.Jpeg.Guid);
                        EncoderParameters jpegParms = new EncoderParameters(1);
                        jpegParms.Param[0] = new EncoderParameter(Encoder.Quality, 95L);
                        newImage.Save(ms, codec, jpegParms);
                        results = ms.ToArray();
                    }

                    //insert the file into database
                    string strQuery = "Update MemberAccount Set profilepicture = @Data Where nric = @Nric";
                    SqlCommand cmd = new SqlCommand(strQuery);

                    cmd.Parameters.Add("@Nric", SqlDbType.VarChar).Value = nric;

                    cmd.Parameters.AddWithValue("@Data", results);

                    InsertUpdateData(cmd);

                    UpdatePanel2.Update();                    
                    
                    lblUpload.ForeColor = System.Drawing.Color.Green;
                    lblUpload.Text = "Profile Picture Updated.";
                }
            }
        }

Hi, 

Is the Tabs control in the Ajax control toolkit enables to addding and deleting tabs at run time like it can be done in browsers (IE,FF,Chrome...)?

Thanks

David

Hi

I have two AJAX Calendar Extender controls, which populate a textbox each, one for a from date and one for a to date. What I am trying to achieve is when the from date is set to add 7 days to the to date, and if the to date is clicked and the date changed, to respectively set the date in the from date to be 7 days in the past. The overall effect I am trying to get is that the dates between the two controls should only be 7 days, i.e. a week.

Trying to search on this, I am not seeing any examples, has anyone tried this, and if so, how can I do it?

Thanks

Hi, I've just upgraded to the latest AjaxControlToolkit (July 2013 release) and now my filedownloads have stopped working in IE 7/8.

IE9, Firefox, Chrome etc are unaffected.

My app basically takes a gridview which is embedded in an updatepanel and exports the contents to an Excel spreadsheet using code as below;

Response.Clear()
Response.AddHeader("content-disposition", "attachment;filename=myexcelfile.xls")
Response.Charset = ""
Response.ContentType = "application/vnd.xls"

Dim stringWrite As System.IO.StringWriter = New System.IO.StringWriter()
Dim htmlWrite As System.Web.UI.HtmlTextWriter = New HtmlTextWriter(stringWrite)

paycalc_GridView.RenderControl(htmlWrite)

Response.Write(stringWrite.ToString())
Response.End()

Gridview and Export button are contanined within the UpdatePanel; a PostBack trigger has been added to the triggers section of the UpdatePanel.

This worked in the previous version I was using, but now it doesn't.

If I switch the scriptmanager from

<ajaxToolkit:ToolkitScriptManager runat="Server" ID="ToolkitScriptManager1" CombineScripts="false"
        AsyncPostBackTimeout="15000" />

back to

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

that also works.

Also, this is over SSL.

Hope someone can help?

Hi, I created a usercontrol that will show on a textbox a calendarextender that displays only the years, here is the code:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<script type="text/javascript" language="javascript">

//function onCalendarShown(sender, e) {sender._switchMode("years"); }
function onCalendarShown(sender, e) {
var cal = $find("calendar"); 
//Setting the default mode to year
cal._switchMode("years", true);

//Iterate every year Item and attach click event to it
if (cal._yearsBody) {
for (var i = 0; i < cal._yearsBody.rows.length; i++) {
var row = cal._yearsBody.rows[i];
for (var j = 0; j < row.cells.length; j++) {
Sys.UI.DomEvent.addHandler(row.cells[j].firstChild, "click", call);
}
}
}
}

function onCalendarHidden() {
var cal = $find("calendar"); 
//Iterate every month Item and remove click event from it
if (cal._yearsBody) {
for (var i = 0; i < cal._yearsBody.rows.length; i++) {
var row = cal._yearsBody.rows[i];
for (var j = 0; j < row.cells.length; j++) {
Sys.UI.DomEvent.removeHandler(row.cells[j].firstChild, "click", call);
}
}
}
}

function call(eventElement) {
var target = eventElement.target;
switch (target.mode) {
case "year":
var cal = $find("calendar");
cal._visibleDate = target.date;
cal.set_selectedDate(target.date);
cal._switchMonth(target.date);
cal._blur.post(true);
cal.raiseDateSelectionChanged();
break;
}
}
</script>

<asp:textbox ID="txtBox" runat="server" Width="90px" Font-Size="Small"></asp:textbox>
<cc1:CalendarExtender ID="calendar" runat="server" TargetControlID="txtBox" OnClientHidden="onCalendarHidden" OnClientShown="onCalendarShown" Enabled="True" Format="yyyy" DefaultView="Years">
</cc1:CalendarExtender>

When I use a single instance of this control in my aspx page it works fine but when i use more than one instances in my aspx page the javascript of all of the controls is overwritten by the last instance of the control in my page and no other control works.

Please tell me how I have to call the specific "calendar" in the Javascript functions

Thanks

 Hi,

 I want to develop igoogle like interface in a asp.net application. Is it possible through AJAX? 

Any pointers on this would be of great help

Cheers

Prady

In my page i have used lot of Collapsible Panel with update panels to load different type of information to navigation the customer info.As per the user request each panel
will show required information.Intially i got a regno to load the customer information through a user control after doing clicks on Collapsible Panel or any postbacks happen,

it cannot load another customer information using another regno.


NOTE: That user control is not in a updatepanel.It will slide using jquery.I think u may understand my scenario.. if not pl ask. I will gave more explanation.

Hi,

I am facing a strange issue with asyncfileupload. I am using jquery accordion in my form. Say, I have div with id="formcontent" and I am having 4 div's inside. say, div1,div2,div3 and div 4. I am displaying one div at a time using accordion. I have 7 asyncfileuploads in div4. I have two in div1. If I place an asyncfileupload in div2, the uploads in div4 stopped working(uploads in div1 continues to work).And the upload I placed in div2 also not working. When I am clicking select file,it opens file location, I am selecting the file, after that no event happening.StartUpload function is not firing. No clue of what is happening.Because,if I place the upload which is in div2 to div4, all uploads starts working fine.

Please help me with a solution. Struggling with the same from the last week.

Additional Info: I am using ajax control tool kit version 3.0.30930.28736. I am working in a SharePoint 2010 application. So, I can't use higher versions.