Doing some javascript for the first time.
I'm playing around with a sessiontimeout and it was working well while I had the code within the .aspx page.
Next stape was to put the code in a .js page. So here's my current lineup.
Script.aspx.js
var iddleTimeoutWarning = null;
var iddleTimeout = null;
function pageLoad()
{
if (iddleTimeoutWarning != null)
clearTimeout(iddleTimeoutWarning);
if (iddleTimeout != null)
clearTimeout(iddleTimeout);
var millisecTimeOutWarning = <%= int.Parse(System.Configuration.ConfigurationManager.AppSettings["SessionTimeoutWarning"]) * 60 * 1000 %>;
var millisecTimeOut = <%= int.Parse(System.Configuration.ConfigurationManager.AppSettings["SessionTimeout"]) * 60 * 1000 %>;
iddleTimeoutWarning = setTimeout("DisplayIddleWarning()", millisecTimeOutWarning);
iddleTimeout = setTimeout("TimeoutPage()", millisecTimeOut);
}
function DisplayIddleWarning()
{
document.getElementById("LblWarning").innerHTML = "Warning Message";
}
function TimeoutPage()
{
__doPostBack('FiresAutoIdle','');
}
ASPX page (Pretty sure error is here since the code in .js page works)
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="Scripts/Script.aspx.js"/>
</Scripts>
</asp:ScriptManager>
I also have some code lines in web.config to set keys SessionTimeout and SessionTimeoutWarning.
So, any idea on where's the glitch? Things used to run, now they won't.
EDIT
I'm using a script manager for a quick handling of the necessary ASP.NET AJAX components to enable partial postback. I need __doPostBack.
I found out if a js function is named pageLoad(), the function will activate when the page loads or when a partial postback. Just what I need.
So, asp.nex page is not loading pageLoad() function from .js.
Solved.
You can't set asp variables inside of javascript. So we have to set the variables in ASPX page, and then let javascript use them.
ASPX
<script type="text/javascript">
var millisecTimeOutWarning = <%= int.Parse(System.Configuration.ConfigurationManager.AppSettings["SessionTimeoutWarning"]) * 60 * 1000 %>;
var millisecTimeOut = <%= int.Parse(System.Configuration.ConfigurationManager.AppSettings["SessionTimeout"]) * 60 * 1000 %>;
</script>
Then use them in .js file.
Related
I am trying to build a progressbar trying to periodically run an ajax call from the client side while a postback is occuring.
However, it seems like the ajax call gets blocked, maybe because of to the postback. When the postback is finished, the http request with the ajax calls goes from pending to canceled.
Questions:
Is it impossible to issue ajax calls during postback?
Can I use the Session like I am doing in the following code example to keep track of the progress?
The webpage aspx:
<%# Page Language="C#" AutoEventWireup="true"
CodeBehind="TestProgressIndicator.aspx.cs"
Inherits="Test.TestProgressIndicator" %>
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-3.2.1.min.js"
type="text/javascript"></script>
<script type="text/javascript">
function start_progress()
{
var indicator = $(".progress-indicator");
indicator.show();
var num_div = indicator.find(".num");
num_div.text("0%");
setTimeout(update_progress, 80);
function update_progress()
{
console.log("update_progress");
$.post(
"Ajax/ProgressBarCallback.aspx"
, function (progress)
{
num_div.text(progress + "%");
if (progress < 100)
setTimeout(update_progress, 80);
else
indicator.hide();
});
}
}
</script>
</head>
<body>
<form runat="server">
<asp:ScriptManager runat="server"/>
<div class="progress-indicator">
<div class="num"></div>
</div>
<asp:Button ID="btnStart" runat="server" Text="Starta"
OnClientClick="start_progress()" OnClick="btnStart_OnClick" />
</form>
</body>
</html>
Ajax/ProgressBarCallback.aspx:
<%# Page Language="C#" %>
<script runat="server">
void Page_Load(object sender, EventArgs e)
{
var progressObj = HttpContext.Current.Session["progress"];
var progress = progressObj != null ? int.Parse(progressObj.ToString()) : 0;
Response.ContentType = "text/json";
Response.Write(progress);
}
</script>
I am aware of this post being a duplicate of ASP.NET making AJAX calls during long Postback but it was 5 years since asked and it did not get any explanatory answers.
I have a javaScript source file, named LIMDU.js, that contains a var and a function, like this --
var SessionTimeOutID;
function KeepSessionAlive() {
var sessionTimeoutWarning = #Session.Timeout;
var sTimeout = parseInt(sessionTimeoutWarning) * 60 * 1000;
clearTimeout(SessionTimeOutID);
SessionTimeOutID = setTimeout('SessionEnd()', sTimeout);
function SessionEnd() {
window.location = "/Account/LogOff";
}
}
and in the cshtml file, I have this:
<script type="text/javascript" src="~/Scripts/LIMDU.js"></script>
<script>
$(document).ready(function () {
KeepSessionAlive();
});
</script>
but when I try to execute the code, I get the error "KeepSessionAlive" not found.
I thought that the src code would be loaded before the local script code was executed; if that's not the case, how do I refer to a function in my local script block that's defined in a src'd file?
Check your console. Your LIMDU.js file is not compiling (probably undefined #Session ?)
I am trying to access a asp:panel in an external script to make it not visible,but it does not seem to be working. When the Script is in the .aspx file it works fine though.Any suggestions?
In the .aspx file
<script src="App_Themes/custom.js"></script>
<asp:Button ID="descriptionButton" Text="Description" runat="server" OnClientClick="descButton(); return false;" />
<asp:Panel ID="desciptionPanel" runat="server">
///random stuff
<asp:panel>
in the custom.js file
function descButton() {
var desc = document.getElementById('<%=desciptionPanel.ClientID%>');
desc.style.visibility = "visible";
desc.style.height = "800px";
}
Thanks in advance
Split it to two.
First, in the aspx at the server, leave the ID so that you can reuse it later
<script>
window.panelID = '<%= whatever.ClientID %>';
</script>
Then, in an external script, just use the ID
function externalJSfunction() {
var desc = document.getElementById(window.panelID);
}
Use a parameter to your function
OnClientClick="descButton('<%=desciptionPanel.ClientID%>');
then script will be
function descButton(id) {
var desc = document.getElementById(id);
desc.style.visibility = "visible";
desc.style.height = "800px";
}
I am getting an error when I try to post data from an asp textbox to the database. The reason for this is that the text is html due to using an html text editor.
However when I try to encode the html I get the following error: BC30451: 'Bind' is not declared. It may be inaccessible due to its protection level.
Below is the asp code I have for the textbox that's causing the error.
<asp:TextBox ID="TxtBx" runat="server" Text='<%# Server.HtmlEncode(Bind("Details").ToString())%>'/>
I'm sure it's something small but can't resolve it. I have also tried the below with the same outcome:
Text='<%# System.Web.HttpUtility.HtmlEncode(Bind("Details"))%>'
I have also attempted to create my own function in the backend to resolve this with the following asp and vb:
Text='<%# encodeIT(Eval("Details"))%>'
Public Function encodeIT(Details As String) As String
Return HttpUtility.HtmlEncode(Details)
End Function
Any help would be greatly appreciated.
Update 1
I have attempted a client solution but still doesn't appear to be working, not sure if I've missed something, been testing in a basic web project to avoid any compatibility issues that could crop up. I have removed the databind for the purpose of this test as ASP throws the same error regardless.
ASP
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<script src="../Scripts/tinymce/tinymce.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
tinymce.init({
menubar: false,
width: 800,
height: 250,
selector: "textarea"
});
var decodeStuff = (function () {
// preventing any overhead from creating more than one instance of the function
var element = document.createElement('div');
function decodeHtml(str) {
if (str && typeof str === 'string') {
// strip script and html tags
str = str.replace(/<script>[^>]*>([\S\s]*?)<\/script>/gmi, '');
str = str.replace(/<\/?\w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');
element.innerHTML = str;
str = element.textContent;
element.textContent = '';
}
return str;
}
return decodeStuff;
});
var text = decodeStuff('TxtBx');
});
</script>
<asp:Panel runat="server" ID="panel1">
<table>
<tr>
<td>
<asp:TextBox ID="TxtBx" runat="server" Width="100%" TextMode="MultiLine" Rows="20"></asp:TextBox>
</td>
</tr>
Code behind (VB) where I'm trying to call the function on post back.
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
If DDL.Text <> "Select" Then
TxtBx.Text = DDL.Text``
End If
Page.ClientScript.RegisterClientScriptBlock(Page.GetType(), "TxtBx", "decodeHtml();", True)
End Sub
If this is only for internal use go into the web config file and within system.web you'll find httpRunTime and Pages add attributes requestValidationMode="2.0" and validateRequest="false" respectively.
Code:
<httpRuntime requestValidationMode="2.0"/>
<pages validateRequest="false"/>
My project uses the Telerik upload file control with manager:
<telerik:RadUpload ID="RadUpload" Runat="server" MaxFileInputsCount="5" />
<telerik:RadProgressManager ID="RadProgressManager" Runat="server" />
On the client side I want to display a progress bar with jQuery UI:
<script type="text/javascript">
function GetRadUpload() { return $find("<%=RadUpload.ClientID %>"); }
function GetRadProgressManager() { return $find("<%=RadProgressManager.ClientID %>"); }
$('#upload_buttonSubmit').click(function() {
var upload = GetRadUpload();
var fileInputs = upload.getFileInputs();
var M = GetRadProgressManager();
$("#progressbar").progressbar({ value: ??? });
});
</script>
I need to get a percent complete from RadUpload/RadProgressManager or get the time needed to upload the file. How can I get one of these values?
Have you taken a look at the demo, they have the progress all built in with very little code. Does the built in Progress Manager not fit your needs?