Jquery - Postback In Chrome Preventing Image Load?
Feb 25, 2011
I'm doing a postback to generate a chart. When the user clicks the button it is using jQuery to add some html to the page to show an animated gif and an overlay.
This works fine in IE and FF but in Chrome the image doesn't load. Anybody know what's going on here?
While looking into the problem I noticed that if I run this code in the JavaScript console it works, and it will work as expected after running it in the console (displays image on postback).
Here is the code I'm using to add the html:
$("body")
.append("<div class='ui-widget-overlay working'></div>")
.append("<div class='ProcessMessage working'><img alt='Loading' src='images/indicator_big.gif' /><br /><br />Loading...</div>");
View 1 Replies
Similar Messages:
Jul 6, 2010
Image button not giving postback in Google Crome, The same code is working fine for IE8 and Firefox 3.6.6
<asp:ImageButton ID="btnlogin" runat="server" ImageUrl="~/images/log.jpg"
onclick="btnlogin_Click" OnClientClick="return confirmAction(this)" />
View 4 Replies
Jan 26, 2010
I have a dynamically generated image placed inside an update panel. The image is generated with the Generated Image control (see here for more:
[URL]. This is basically a specialised httphandler linked to a normal asp:image, where the image src is generated dynamically. In my case, I use some GDI+ to dynamically generate the image, based on values from a database query.
The problem I have is that the image does not update when the update panel updates. The image does, however, update if I manually reload/refresh the page (i.e., hit F5). Why is is that some code fires during an update panel update, and not other code? And, more importantly, what can I do to make sure the image generation code does fire during the updatepanel update?
[Code]....
View 3 Replies
Oct 4, 2012
I have this simple code:
<asp:Label ID="litInfo" runat="server" meta:resourceKey="litInfo" />
<br />
<asp:TextBox ID="txtEmail" runat="server" /><br />
[Code].....
I am expecting the RequiredFieldValidator control to prevent a postback when the textbox is filled in with an incorrect data and the button pressed. What happens is that the validator displays an error message but a postback is fired.
View 1 Replies
Mar 15, 2010
I have an existing app that has a java based search utility - this search utility has a FILTERing mechanism. You can click a button to POSTBACK to the server and there, a new window is generated displaying "blah dee da".
So, click a button to filter the utility, click a button to postback and voila, you get your popup aspx.
Unfortunately, the old aspx loses STATE when on the round trip and refreshes itself too - i lose my filter.
How do I go about NOT losing my STATE ?
I understand that specifying the following in the FORM tag on the old ASPX: target="_blank"
takes the focus away from the old aspx and so, the STATE is not lost. However, when the popup generates, a brand new aspx is created along with the asps pop-up. So, I end up with 3 aspx forms!
View 2 Replies
Mar 30, 2010
I have one TextBox with RequiredFieldValidator control and LinkButton on my page.
May occur the following situation on this page:
I filled the texbox and clicked the linkbutton is make postback on the server - so all ok.When I not filled the textbox and clicked linkbutton it will show message "Please enter your first name." and no postback will happen but when I filled textbox and click linkbutton I got a PROBLEM : Message "Please enter your first name." goes away (correct), but it doesn't preventing posback.
View 8 Replies
Jul 19, 2010
I have an ASP.NET page that takes a long time to load due to the loading of multiple user controls. Is there a way where I can show a loading animation using jQuery while the page is loading?
View 4 Replies
Jan 4, 2014
I have a script for infinie paging data where one of the items i return is an image, not text. Right now I am returning as text. return as the html or asp image? The line I need to fix and can use the logic for other is ==$(".msgpic", table).html(customer.find("MsgPicture").text()); == See code...
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
var pageIndex = 1;
var pageCount;
[Code].....
View 1 Replies
Dec 6, 2010
I'm using a slightly modified version of Valum's upload [github link], I've modified it to upload to a database but haven't modified the javascript that it is using to get the file into the Request as an InputStream. The following line of code is failing in IE 8 but is confirmed to work in Chrome. using (Image imgInput = Image.FromStream(Request.InputStream)) The error received is "Parameter not valid". It appears to be having an issue with the Input Stream being used but it exists/has data (not sure how to validate if the data is good or not).
Page
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>Upload-Pictures</h2>
<div id="file-uploader">
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
</noscript>
</div>
<script src="/Scripts/fileuploader.js" type="text/javascript"></script>
<script type="text/javascript">
function createUploader() {
var uploader = new qq.FileUploader({
element: document.getElementById('file-uploader'),
action: '/Admin/FileUpload/' + <%= Model.PropertyId %>,
debug: true
});
}
window.onload = createUploader;
</script>
</asp:Content>
Controller
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult FileUpload(int id)
{
try
{
byte[] newImageByteArray = GetByteArrayForResizedImage(350, Request.InputStream);
byte[] thumbnailByteArray = GetByteArrayForResizedImage(150, Request.InputStream);
//Add to DB
}
catch (Exception ex)
{
// This is where the exception is caught
return Json(new { success = false, message = ex.Message }, "application/json");
}
return Json(new { success = true }, "application/json");
}
private static byte[] GetByteArrayForResizedImage(int imageSize, Stream inputStream)
{
byte[] imageByteArray;
// For some reason in IE the inputStream here is causing it to crash
using (Image imgInput = Image.FromStream(inputStream))
{
//Image processing
}
return imageByteArray;
}
fileuploader.js - qq.FileUploader
/**
* Class that creates upload widget with drag-and-drop and file list
* @inherits qq.FileUploaderBasic
*/
qq.FileUploader = function(o){
// call parent constructor
qq.FileUploaderBasic.apply(this, arguments);
// additional options
qq.extend(this._options, {
element: null,
// if set, will be used instead of qq-upload-list in template
listElement: null,
template: '<div class="qq-uploader">' +
'<div class="qq-upload-drop-area"><span>Drop files here to upload</span></div>' +
'<div class="qq-upload-button">Upload a file</div>' +
'<ul class="qq-upload-list"></ul>' +
'</div>',
// template for one item in file list
fileTemplate: '<li>' +
'<span class="qq-upload-file"></span>' +
'<span class="qq-upload-spinner"></span>' +
'<span class="qq-upload-size"></span>' +
'<a class="qq-upload-cancel" href="#">Cancel</a>' +
'<span class="qq-upload-failed-text">Failed</span>' +
'</li>',
classes: {
// used to get elements from templates
button: 'qq-upload-button',
drop: 'qq-upload-drop-area',
dropActive: 'qq-upload-drop-area-active',
list: 'qq-upload-list',
file: 'qq-upload-file',
spinner: 'qq-upload-spinner',
size: 'qq-upload-size',
cancel: 'qq-upload-cancel',
// added to list item when upload completes
// used in css to hide progress spinner
success: 'qq-upload-success',
fail: 'qq-upload-fail'
}
});
// overwrite options with user supplied
qq.extend(this._options, o);
this._element = this._options.element;
this._element.innerHTML = this._options.template;
this._listElement = this._options.listElement || this._find(this._element, 'list');
this._classes = this._options.classes;
this._button = this._createUploadButton(this._find(this._element, 'button'));
this._bindCancelEvent();
this._setupDragDrop();
};
fileuploader.js - qq.FileUploaderBasic
/**
* Creates upload button, validates upload, but doesn't create file list or dd.
*/
qq.FileUploaderBasic = function(o){
this._options = {
// set to true to see the server response
debug: false,
action: '/server/upload',
params: {},
button: null,
multiple: true,
maxConnections: 3,
// validation
allowedExtensions: [],
sizeLimit: 0,
minSizeLimit: 0,
// events
// return false to cancel submit
onSubmit: function(id, fileName){},
onProgress: function(id, fileName, loaded, total){},
onComplete: function(id, fileName, responseJSON){},
onCancel: function(id, fileName){},
// messages
messages: {
typeError: "{file} has invalid extension. Only {extensions} are allowed.",
sizeError: "{file} is too large, maximum file size is {sizeLimit}.",
minSizeError: "{file} is too small, minimum file size is {minSizeLimit}.",
emptyError: "{file} is empty, please select files again without it.",
onLeave: "The files are being uploaded, if you leave now the upload will be cancelled."
},
showMessage: function(message){
alert(message);
}
};
qq.extend(this._options, o);
// number of files being uploaded
this._filesInProgress = 0;
this._handler = this._createUploadHandler();
if (this._options.button){
this._button = this._createUploadButton(this._options.button);
}
this._preventLeaveInProgress();
};
View 1 Replies
Jun 10, 2010
I have a 40x1600 image that I use for bg and I do repeat-x in my CSS, like such:
body
View 1 Replies
Mar 23, 2011
i've recognized that on google chrome browser every second postback of my asp.net application is a bit slow (~1 seconds)... every other shows up immediately. internet explorer is doing fine on every postback!
View 3 Replies
Aug 20, 2010
The following flash does not initially load in firefox, but if I click the second tab on the right, and then go back to the first, it loads. This works in Chrome and IE. Here is the webpage.
View 3 Replies
Sep 27, 2010
I am creating one of my first Asp.Net tools and I ran in to a small bump. Currently I am doing a postback on a buttonclick which does some server-side calculations. The server-side code then uses those calculations to alter the contents of a div. In IE and Firefox when a postback happens, the div updates as expected. However, in chrome all postbacks do a complete refresh of the entire page. What is causing this and is there a way around this behavior?
Update:
ClientSide I have the following..
<asp:Button ID="Button2" Style="float: right" runat="server"
OnClick="S_ButtonClick" Text="Calculate" />
Which calls a method summarized as so.
protected void S_ButtonClick(object sender, EventArgs e)
{
//Code parsing values from textboxes ect.
//Do Some Calculations
//Output Results
outputDiv.InnerHtml = "<h2>Foo</h2><br/>";
outputDiv.InnerHtml += "Bar: " + calcValue;
}
It is possible that when this postback(if I understand this correctly) happens, that it is still fully reloading in firefox and ie, but it doesn't show it. This effectively masks the postback. However, when I test in chrome, any postback completely blanks the page before reloading the state. Hopefully this clears up exactly what I am asking. Also, my C#/.Net usage might be slightly flawed and I am willing to take comments on such.
View 1 Replies
Feb 8, 2013
I tried some methods to maintain scroll position on postback but none worked they are
1) In page declaration MaintainScrollPositionOnPostback="true"
2) In Code behind Page.MaintainScrollPositionOnPostBack = true
3)In web.config file in <system.web> section <pages maintainScrollPositionOnPostBack="true" />
I am not using any updatepanel.
View 1 Replies
Jul 25, 2010
I've created code to retrieve an image from the file system using an ASHX handler. The code displays the image correctly in Chrome, but I get a broken image in IE:
[Code]....
View 2 Replies
Feb 10, 2010
I have an image upload form:
[Code]....
That posts back to the action
[Code]....
The code works accross all browsers but Google Chrome. My IDE is Visual Studio 2k8, and I haven't figured out how to debug on Google Chrome with it, however, I am throwing error messages, and I know that for some reason under chrome, the following check doesn't pass:
[Code]....
So apparently, under Chrome, the HttpPostedFileBase parameter picture isn't encoded right and loses its mime type, howwever, this might not be the only problem. What is excatly wrong with the HttpPostedFileBase parameter under Chrome, and how can I fix it?
View 3 Replies
Mar 20, 2011
I have a Jquery UI datepicker control in my asp.net MVC application and it works fine in IE and Firefox but it doens't work in chrome when I click the datepicker button. Here is my Index view:
$(function() {
$('#datepicker').datepicker({
changeMonth: true,
dateFormat: "dd M yy",
changeYear: true,
showButtonPanel: true,
autoSize: true,
altField: "input#txtDate",
onSelect: function(dateText, inst) {
$.ajax({
type: "POST",
url: "/LiveGame/Partial3?gameDate=" + dateText,
dataType: "html",
success: function(result) {
var domElement = $(result);
$("#dvGames").html(domElement);
}
});
}
});
$("#txtDate").val($.format.date(new Date(), 'dd MMM yyyy'));
$('#dvGames').load(
'<%= Url.Action("Partial3", "LiveGame") %>',
{ gameDate: $("#txtDate").val() }
);
});
Here is my partial:
public ActionResult Partial3(string gameDate)
{
return PartialView("Partial3", gameDate);
}
<div id="dvGames" class="cornerdate1">
<%= Url.Action("LiveGame","Partial3") %>
</div>
<input type="text" id="txtDate" name="txtDate" readonly="readonly" class="cornerdate" />
<input id="datepicker" class="cornerimage" type="image" src="../../Content/images/calendar.gif" alt="date" />
</div>
View 1 Replies
Feb 27, 2010
I am working with ihttphandler.It works well in IE,Opera,FireFox. But,in chrome the image is not shown.
HTML Source Code
<!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><title>
</title>
<style type="text/css">*{margin:0 auto}</style>
</head>
<body>
<form name="form1" method="post" action="default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE2MTY2ODcyMjlkZLSbnrzjxrqlo27jCzAHRe8onliv" />
</div>
<marquee width="80%" onmouseover="this.stop();" onmouseout="this.start();"><img id="img" src="ImageHandler.ashx" style="border-width:0px;" /></marquee></form>
</body>
</html>
View 3 Replies
Jan 11, 2010
Ok so I'm not very familiar with Jquery as to know the possible cause of this, but I've been assigned to find out why the datepicker doesn't work porperly on a client's computer (it prints out the date without slashes like this: 24112008
So when I test the webform, I see it doesnt even pop up in Firefox (the client's browser too) nor chrome, only in IE8.
In the scriptManager we have:
<script src="http://www.website.com/Script/jquery.min.js" type="text/javascript"></script>
<script src="http://www.website.com/Script/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://www.website.com/Script/jquery-ui-i18n.min.js" type="text/javascript"></script>
and in the webform:
$(function pageLoad(sender, args) {
// Datepicker
$.datepicker.setDefaults($.extend({ showMonthAfterYear: false }, $.datepicker.regional['']));
$(".dates").datepicker($.datepicker.regional['es']);
});
The textbox that uses it goes like this:
<asp:TextBox ID="txtFeNac" CssClass="dates" style="margin-left: 7px" runat="server" ></asp:TextBox>
View 2 Replies
Mar 23, 2010
Have a look at below link. In that page if you mouse over on any thumbnail image a div opens with that image details with larger size. But there is a point to notice usually when an image gets downloaded in the browser we see that the image loads in parts from top to bottom. In this case the whole is loaded but in blurred state and gets cleared after fully downloaded.
Sample
Link
I just wanted to know how this is achived? Does it require to code something or it is any javascript or dhtml?
View 6 Replies
May 9, 2010
I was trying to prototype some jQuery-based menu into ASP.NET MVC. Just to name two examples here: [URL]Their demo page looks great, but when I integrate their sample code into MVC, the script no longer works in IE and FireFox, but it seems to work just fine under Google Chrome. Can someone kindly enough to point out what I missed? I will be honest here. I am still new to JavaScript. I have placed a copy of my VS2010 solution zip file @ [URL] Here is what I did. In the Site.Master, I have something like
<body>
<div class="page">{truncated...}</div>
<script src=[URL]" charset="utf-8"></script>
<asp:ContentPlaceHolder ID="ScriptContent" runat="server" />
</body>
And inside View file, I have the following
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="original">
{some demo block, copied from javascript demo}
</div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ScriptContent" runat="server">
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.columnview.js") %>" />
<script type="text/javascript">
$(document).ready(function () {
$('#original').columnview();
});
</script>
</asp:Content>
Compiled the code and ran it under IE. Ideally, it should work like the demo in [URL], but in reality, it only displays unordered list in plain view. (If you download the solution file and run it, you should be able to repro this as well). Next, tried with FireFox, not working either, same result as IE. Finally, when I try it under Google Chrome 4.1 (lastest version), and the script displays just fine.
View 2 Replies
Mar 29, 2011
The following code doesn't work with customized CSS.
AddClass('Message'). It works in Chrome but not IE.
[code].....
View 1 Replies
Jan 28, 2011
iam using the Jquery Uframe with asp.net project.Iam getting a postback problem here.
In side the uframe ,button control getting postback the page even the client side method call also.
i tried with the Html button Control also by setting the type="submit" ,iam facing the same problem.
And I got very limited reference about the uframe(codeflex,codeProject).
View 6 Replies
Nov 10, 2010
I have an CalanderExtender in a Update panel that wraps my page. Inisde that it is in a hidden panel the gets shown when they pick what type of information they want to input. The problem is that in Chrome when you click on the Image nothing happens. Though it works fine in IE and Firefox.
Code :
<asp:UpdatePanel runat="server" ID="upJobBid">
View 2 Replies
Mar 10, 2011
using vb.net/asp.net 2005
I've been tasked with creating a page where the user can do the following in this order:
1. browse to and select a jpg image
2. preview the image that the user just selected
3. if the user is happy with the preview then click the GO button to load the image to the Image folder.Does anyone have any good examples or sample code of how to do this?
View 2 Replies
