update label.text multiple times during button click event in asp.net - javascript

I want to show the processing of the code,which runs on button click event.
Please help.
My code is something like below.
protected void btnSubmit_Click(object sender, EventArgs e)
{
//Do some stuff
//Show the message that the application is processing
lblCaption.Text = "Processing...updating label data";
//Do more stuff
lblCaption.Text = "Processing...creating label files.";
//More stuff that will take some time
lblCaption.Text = "Processing...updating label counts.";
//More stuff
lblCaption.Text = "Processing...completed.";
}

Related

Run Js function only once after 2 seconds from c# code behind

Hello i have the next question, ive got the next function =
protected void lnk_Click( object sender, EventArgs e )
{
LinkButton btn = sender as LinkButton;
string text = btn.CommandName;
ScriptManager.RegisterStartupScript( this, GetType(), "script", "alert('"+ text + "');", true );
}
I want to run the function after a second or 1.5 secs because this is running before the page renders visually, causing a "visual bug" on which the li tags (for example) dont get the css properties.
Any suggestion would help, thanks!
The JavaScript content should run on the event DOMContentLoaded like this:
document.addEventListener("DOMContentLoaded", function(){alert('text');});
If you're sure you want to use the "dirty" way, use setTimeout:
setTimeout(function(){alert('text');}, 1500); // 1500 milliseconds
In async you can wait using Task.Delay
private async Task<Response> ExecuteTask(Request request)
{
var response = await GetResponse();
switch(response.Status)
{
case ResponseStatus.Pending:
await Task.Delay(TimeSpan.FromSeconds(2))
response = await ExecuteTask(request);
break;
}
return response;
}

How can I change cursor to wait icon in Visual Studio asp.net?

I have a Web Forms project in VS 2013 in which I call an asynchronous process from a button within an update panel. I would like the wait icon to show while the asynchronous process is running.
I am using the code- behind shown below, but the cursor does not change from the default pointer when cmdAutoCaption is clicked. However, after the asynchronous process has completed and content_string returned, the cursor changes to a wait icon if it is moved outside the update panel.
protected void cmdAutoCaption_Click(object sender, EventArgs e)
{
string sUser = AuthoriseUser();
if (sUser == "") return;
string script1 = "document.body.style.cursor = 'wait';";
ScriptManager.RegisterStartupScript(this, GetType(), "ServerControlScript", script1, true);
CreateAutoCaption();
}
private async void CreateAutoCaption()
{
await MakeAnalysisRequestAsync(Session["strImagePath"].ToString());
}
private async MakeAnalysisRequestAsync(string imageFilePath)
{
...
response = await client.PostAsync(uri, content);
// Get the JSON response.
string contentString = await response.Content.ReadAsStringAsync();
...
string script1 = "document.body.style.cursor = 'auto';";
ScriptManager.RegisterStartupScript(this, GetType(), "ServerControlScript", script1, true);
...
}
You can use the following code to change the cursor:
Cursor.Current = Cursors.WaitCursor
This should solve your problem.

Null reference from control after page loads

I am trying to run a piece of javascript after the page loads:
protected void Page_LoadComplete(object sender, EventArgs e)
{
if (IsPostBack)
{
string controlName = getPostBackControlName();
if (controlName == "btnSubmit" || controlName == "ddlSalary")
{
Page.ClientScript.RegisterStartupScript(GetType(), "myAlertScript", "onLoadDisplay(this)", true);
}
}
}
Here is the referenced javascript:
function onLoadDisplay(sender) {
PerDiemClicked(sender);
}
function PerDiemClicked(sender) {
if (document.getElementById('<%= chkbxPerDiem.ClientID %>').checked == true) {
document.getElementById("PerDiemDisplay").style.display = 'inline';
}
else {
document.getElementById("PerDiemDisplay").style.display = 'none';
}
}
I'm getting this error:
0x800a138f - JavaScript runtime error: Unable to get property
'checked' of undefined or null reference
I dont understand why the checked is coming back null because I am waiting for the page to complete postback before checking. How do I check this control and run the above code correctly?
edit: here is the checkbox:
<asp:CheckBox ID="chkbxPerDiem" runat="server" Checked="false" onclick="PerDiemClicked(this)" />
Your script likely executed before chkbxPerDiem was added to the DOM. Perform your script in the window load event:
window.addEventListener("load", function() {
onLoadDisplay(this);
});
Try this:
Page.ClientScript.RegisterStartupScript(GetType(), "myAlertScript", #"
window.addEventListener('load', function() {
onLoadDisplay(this);
});", true);
See this answer
Here is how I solved it.
This code does in fact post after page load:
protected void Page_LoadComplete(object sender, EventArgs e)
{
if (IsPostBack)
{
string controlName = getPostBackControlName();
if (controlName == "btnSubmit" || controlName == "ddlSalary")
{
Page.ClientScript.RegisterStartupScript(GetType(), "myAlertScript", "window.addEventListener('load', function() { onLoadDisplay(this); });", true);
}
}
}
I had to modify the javascript function to check if it exists before checking whether its checked:
function PerDiemClicked(sender) {
if (document.getElementById('<%= chkbxPerDiem.ClientID %>') != null) {
if (document.getElementById('<%= chkbxPerDiem.ClientID %>').checked == true) {
document.getElementById("PerDiemDisplay").style.display = 'inline';
}
else {
document.getElementById("PerDiemDisplay").style.display = 'none';
}
}
}
Thanks everyone.
Page_LoadComplete is a server-side event, and all server-side events will run before the page is even sent to the browser. Remember, these server-side events are related to constructing the page. You need to run your JavaScript after the page has been constructed, served, and fully loaded by the browser. This means the Page_LoadComplete event runs long before your JavaScript code can run.
Page.ClientScript.RegisterStartupScript(GetType(), "myAlertScript", "onLoadDisplay(this)", true);
The code above registers a call to your JavaScript load function. But it will insert the call to that function at the top of your page. So it will run before the rest of the page is loaded.
You need to review how ASP.NET events work. Again, all of the server-side events run before the page is even sent to the browser. The JavaScript shouldn't run until after the browser has received and loaded the page.

Javascript function and web service call synchronization

Hi i have this code in page_load event on aspx page:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
FillSomeDropDownLists();
}
EnableExportButton(false);
if (!string.IsNullOrEmpty(Page.Request["__EVENTTARGET"]) && !string.IsNullOrEmpty(Page.Request["__EVENTARGUMENT"]) && Page.Request["__EVENTARGUMENT"] == "true")
{
ScriptManager.RegisterStartupScript(Page, GetType(), "Show", "ShowPopup();", true);
if (CallToWebService(Convert.ToInt32(Page.Request["__EVENTTARGET"]), 1))
{
SomeOtherCallToWebService();
Global.ShowMessage(this.Page, StringConstants.SUCCESS_TRANSACTION_TITLE);
}
else
{
Global.ShowMessage(this.Page, StringConstants.FAIL_TRANSACTION_TITLE);
}
ScriptManager.RegisterStartupScript(Page, GetType(), "Hide", "HidePopup();", true);
}
}
I would like to show a javascript popup, then do webservice related stuff, and then hide the popup. That is how I coded it.
But in page execution I get call to webservices first, and then shows and hides the popup. Showing and hiding the popup is so fast that it seems nothing happens.
Is there solution to get what I want?

fire a function after triggering a click event

How can fix this :
function Navigation(sender) {
var senderID = sender.id;
var answer = confirm("do you want to save your current layout ?");
if (answer) {
$("#loadingImg").css("display", "block");
$("#<%=Button1.ClientID %>").click();
//the next line is never fired
if (senderID == "AboutClick") { setTimeout('ShowLoadingMsg()', 3000); }
}
}
function ShowLoadingMsg() {
window.location="About.aspx";
}
<a href="javascript:void(0)" id="AboutClick" class="menu" onclick="Navigation(this);" >Navigate Click</a>
<asp:Button ID="Button1" runat="server" OnClick="btnSaveState_Click" style="display:none;" />
//Server side:
protected void btnSaveState_Click(object sender, EventArgs e)
{
SaveState();
}
The main problem is that this line is never fired what am i doing wrong here
The problem here is that $("#<%=Button1.ClientID %>").click(); causes the entire page to reload. It won't really matter what scripts you set a timeout for after that, since the page is refreshed anyway.
You could try putting Button1 inside an UpdatePanel, or just solve the problem in another way, such as saving state and redirecting in the same method.
Try this:
Navigate Click​
-
$(function(){
$(".trigger").click(function(){
var answer = confirm("do you want to save your current layout ?");
if (answer) {
$("#loadingImg").show();
if (this.id == "AboutClick") { setTimeout('ShowLoadingMsg()', 3000); }
$("#<%=Button1.ClientID %>").click();
}
})
})
function ShowLoadingMsg() {
window.location="About.aspx";
}
Demo here!

Categories

Resources