Javascript works and disappears quickly in Sitefinity - javascript

I've been having an issue where JavaScript is not loading for our website built in Sitefinity. We have a custom .master page using the Zurb Foundation framework. At first I thought this was simply an ordering of the external scripts in the .
In breaking it down, I've stripped my page code to do a basic JavaScript output inline. When you click a button, it shows a text message. The script works for a split second then disappears. This is what I was having happen earlier. It's as though the script times out.
This is a basic of basic scripts to test. I don't understand why this is occurring. Something is conflicting with Sitefinity.
My code is below:
<%# Master Language="C#" AutoEventWireup="true" %>
<%# Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.PublicControls" TagPrefix="sf" %>
<%# Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
<%# Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!doctype html>
<html class="no-js" lang="en">
<head id="Head" runat="server">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="utf-8">
<title>Inside Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div id="ContentMainCPH">
<asp:contentplaceholder id="ContentMainCPH" runat="server" />
</div>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "This Works!";
}
</script>
</form>
</body>
</html>
Any thoughts about why I can't get Scripts to work in Sitefinity? I've been trying to resolve this for the entire week, and Sitefinity Support unfortunately is not of any help.
I appreciate your time and help if you can offer, thank you.
Maria

Related

ASP.net C# calling vbscript from javascript

I have this basic page:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Teste1.aspx.cs" Inherits="Testes.Teste1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"><title></title></head>
<body>
<form id="form1" runat="server">
<input id="clickMe" type="button" value="clickme" onclick="getText();" />
</form>
<script type="text/vbscript" language="vbscript">
Function createText()
createText = "A"
End Function
</script>
<script type="text/javascript" language="javascript">
function getText(){
var vbobj;
vbobj = createText();
alert("VBScript text = " + vbobj);
}
</script>
</body>
</html>
But this is not working, I'm getting the following message
Unhandled exception at line 27, column 5 in
http://localhost:59632/Teste1.aspx 0x800a1391 - JavaScript runtime
error: 'createText' is not defined
I hope you know VBScript works only in IE. Try to put this meta tag in your head section:
<head>
<meta http-equiv="x-ua-compatible" content="IE=10">
</head>
It helped me as I was using IE 11 edge mode, in which VBScript is no longer supported.

By default in asp.net web forms it will have two aspNetHidden Divs, How do I remove that

When i create a empty webform page in asp.net it create the code like below:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Threetier.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
additionally i added googleapis jquery in head tag using:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
Now, this means that it has only one div in form and when I console the below code I should get object of one div:
$("#form1").find('div');
but the result is
Object[div.aspNetHidden, div.aspNetHidden, div ]
Try following code
$("#form1").find('div').not('.aspNetHidden');
More precisely if you want to select particular div just say we want to select the first div here then:
$("#form1").find('div').not('.aspNetHidden').eq(0);
this will return the first div in the form with id='form1'.

Redirect using window.location doesn't work

I searched for a related post, but all attempts have not worked.
My problem, is that I'm trying to do a simple redirect in Javascript, using path+querystring. My code is below:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Page1.aspx.cs" Inherits="WebApplication1.Page1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="submit" value="pesq" onclick="Redirect();"/>
</div>
</form>
<script>
function Redirect()
{
window.location.href = 'http://localhost:61267/Page1.aspx?q=name';
}
</script>
</body>
</html>
window.location.href is always set like 'http://localhost:61267/Page1.aspx'.
I have tried using window.location.search but still without success.
What I'm doing wrong?
Use document.location instead.
document.location = 'http://localhost:61267/Page1.aspx?q=name';
Problem code:
<form id="form1" runat="server">
<div>
<input type="submit" value="pesq" onclick="Redirect();"/>
</div>
</form>
HTML elements, specifically, forms, have default events that occur when user actions take place. In your context, the submit event is probably being invoked when you click on that input box. You need to prevent the default event from happening by either returning false from the event handler, or calling preventDefault
<form onsubmit="Redirect(); return false;" id="form1" runat="server">
<div>
<input type="submit" value="pesq" onclick="Redirect(); return false;"/>
</div>
</form>
P.S.
The onsubmit handler will allow yourself to press the enter key and still have the same effect as would have happened if you just clicked the input box.
Not sure why you need a form and submit button for just doing redirects.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Page1.aspx.cs" Inherits="WebApplication1.Page1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<div>
<input type="button" value="pesq" onclick="Redirect();"/>
</div>
<script>
function Redirect()
{
window.location.href = 'http://www.google.com';
}
</script>
</body>
</html>
also i noticed some encoding issues that i was able to resolve by adding:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
Only changed the input type, and it worked perfectly! Thanks to t.niese.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Page1.aspx.cs" Inherits="WebApplication1.Page1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" value="pesq" onclick="Redirect();return false;"/>
</div>
</form>
<script>
function Redirect()
{
window.location.href = 'http://localhost:61267/Page1.aspx?q=name';
}
</script>
</body>
</html>
you need to do either of the following:
1) For server side asp code:
<asp:button text="Navigate" onclientclick="Redirect()" value="pesq" runat="server" />
See MSDN Example
2) if client side code:
<input type="button" value="pesq" onclick="Redirect();"/>

Error with JQuery Mobile

Below, I am receiving this error:
I have narrowed the problem code to JQuery Mobile 1.0 or greater and Asp.NET ScriptManager.
I added a new Web Forms Project to Visual Studio 2012 and included the code below:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" ScriptMode="Release" runat="server"></asp:ScriptManager>
<div>
</div>
</form>
</body>
</html>
No Code in Code Behind page.
This is it, however when I run the project, I receive the above error
when both ScriptManager and JQuery Mobile script is included.
No error occurs when either the JQuery Mobile or ScirptManager is
removed.
Half a day wondering and trying to find a explanation, one particular website that I came across suggested adding ScriptMode="Release" to ScriptManager.
After adding ScriptMode="Release" to ScriptManager, I didn't receive the above error.
Searching MSDN, which defined ScriptMode: Gets or sets a value that specifies whether debug or release versions of client script libraries are rendered.
An error wasn't thrown after adding ScriptMode to ScriptManager, but Why? Can someone explain why adding ScriptMode stop the error from appearing, and would, just adding ScriptMode, mean truly a solver or a Band-Aid?
The error is thrown here:
Thank you
Below I have included rendered HTML page:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
</title><link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<form method="post" action="WebForm1.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE3MTc1MDc5MjBkZKegov+UVDfF6HxSUeRymFH24991gFZlPU0b/IsFSVOC" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<script src="/WebResource.axd?d=YNeW-uV30W9QUFseu7cpdlXTvjGS-17TUbJFOrYgly8h7oJPnNmO65B9MsXEKqakJOaVgg29CB6vB4ZdmlLF7g8EEKPfdXLBpPT96ABclOM1&t=634773918900000000" type="text/javascript"></script>
<script src="/ScriptResource.axd?d=1zt3Mkq4WcBu9zbsV4m9-M7KCvrT-jr1XXgEzhW9nlIjwSm5LqLoLvy1RRMu-5CPbCTtFRsnupAShqvEwf1EA89LxKLiAOgKvWaOicLhKJXKcoRKfxG9wfeNLN-ZylWfgK9ozBiE9bfZ-FsMcBHxpWRRemoiIMSGZzuYvNAs6Evl_1N7xJCIcbyAp01izsBK0&t=6119e399" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');
//]]>
</script>
<script src="/ScriptResource.axd?d=QXV43dBeyoevgM325nU9rlBmVyB375pfaFEuLQ1v1BisiTdf-HdmxtF90_hgFfCcn3l6abc0C_OIvNebx_7cosgD1E8ZEeTK680r4HRGT7Pngzk9Ei-BKOI48hrwHGv9cUfKN2zloA0qh8YHXKfefO8eUGQhV8M-XarSzMOPpgJwr8FS8Yb8rvlVPvcSzSTE0&t=6119e399" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ScriptManager1', 'form1', [], [], [], 90, '');
//]]>
</script>
<div>
</div>
</form>
</body>
</html>
Below I show how I tried turning on noConflict:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$.noConflict();
</script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
I tested your code and I was able to replicate the error.
First, I think ScriptManager must exist before anything that is using it. Doing this will result in no error:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
</form>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</body>
</html>
Second, The scripts you are including are the minified or release versions. This is an unconfirmed guess but maybe it is expecting non-minified or debug versions for rendering and they do not exist and putting the ScriptMode="Release" possibly lets it know it should use minified versions. This could be tested by including the minified and debug scripts in the project instead of getting them remotely...... That is how MVC works so that is why I am suggesting that maybe Web Application works the same.
Aside:
Following the info at this link here is another way that does not produce any errors:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"/>
<asp:ScriptReference Path="http://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js" />
</Scripts>
</asp:ScriptManager>
</form>
</body>
</html>
Edit:
For some reason I also tried setting this in Web.config:
<compilation debug="true" targetFramework="4.0"/>
to this:
<compilation debug="false" targetFramework="4.0"/>
This also works with your original code but, for some reason, I feel like it is a bandaid because it is most likely just hiding the error instead of fixing it.

jQuery not working in ASP 2.0 page - Visual Web Developer 2008 Express

JQuery is not working in ASP 2.0 pages which were developed under VS 2005 and now doing Javascript in it using Visual Web Developer 2008 Express. I have included the jquery file.
I have also installed all patches required. JQuery intellisense works fine in the IDE, but no jquery command is running. btw, the page renders fine from the server side coding.
Please give some remedy to this, and whats the problem in the code?
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%# Register Src="Calendar.ascx" TagName="Calendar" TagPrefix="uc1" %>
<!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>Control Trial Page</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.3.2.js">
$(document).ready(function() {
$("#divBody").css("display", "none");
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="showDiv" type="button" value="hi there"/>
</div>
<div id="divBody">
....
</html>
You need 2 script tags. One which imports the jQuery.js file and one which contains your script. Observe:
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.3.2.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$("#divBody").css("display", "none");
});
</script>

Categories