I migrated a VS 2003 app to VS 2010.
The application has side_menu.ascx which is referenced in default.aspx.
in side_menu.ascx, a javascript function menu is invoked which is present in side_menu.js.
However, when the function menu is invoked, it gives an error during runtime - 'Cannot find function menu' This works fine in VS 2003
This is where I am getting this error - this code is in side_menu.ascx
new menu (SIDE_MENU_ITEMS, SIDE_MENU_POS, SIDE_MENU_STYLES)
This is the code in default.aspx
<!-- Side Menu -->
<td valign="top" class="page_side_menu">
<mycontrols:sidemenu id="SideMenu1" runat="server"/>
</td>
This is the code in side_menu.ascx
<%# Control Language="vb" AutoEventWireup="false" Codebehind="side_menu.ascx.vb" Inherits="TOrders.UI.Controls.SideMenu" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<table cellPadding="0" width="100%">
<tr>
<td vAlign="top" align="left" width="100%">
<table cellSpacing="10" cellPadding="0" width="100%">
<tr>
<td align="left">
<asp:Literal ID="litError" Runat="server" Text="<font color=#E0E0E0 size=1>* </font>" Visible="False"></asp:Literal><asp:label id="lblJump" runat="server" ForeColor="#E0E0E0" Font-Size="XX-Small">Jump to Telex/Order:</asp:label>
<br>
<asp:textbox id="txtJumpTo" runat="server" Width="125px" CssClass="textbox"></asp:textbox> <input type="button" value="Go" runat="server" id="btnGo" class="TabOut-Button">
</td>
</tr>
</table>
</td>
</tr>
</table>
<script language="JavaScript" src="~/library/scripts/side_menu.js" type="text/javascript"></script>
<script language="JavaScript" src="~/library/scripts/side_menu_items.js" type="text/javascript"></script>
<script language="JavaScript" src="~/library/scripts/side_menu_tpl.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">
<!--
new menu (SIDE_MENU_ITEMS, SIDE_MENU_POS, SIDE_MENU_STYLES);
// -->
</script>
This is the javascript function side_menu.js
var menus = [];
function menu (item_struct, pos, styles) {
// browser check
this.item_struct = item_struct;
this.pos = pos;
this.styles = styles;
this.id = menus.length;
this.items = [];
this.children = [];
this.add_item = menu_add_item;
this.hide = menu_hide;
this.onclick = menu_onclick;
this.onmouseout = menu_onmouseout;
this.onmouseover = menu_onmouseover;
this.onmousedown = menu_onmousedown;
var i;
for (i = 0; i < this.item_struct.length; i++)
new menu_item(i, this, this);
for (i = 0; i < this.children.length; i++)
this.children[i].visibility(true);
menus[this.id] = this;
}
try removing tilde (~) from javascript src path and make sure path is actually correct
To me it was the same and so solution is:
Change the relative path and leave them in taking away the root ~ /
before
<%# Control Language="VB" AutoEventWireup="false" CodeFile="wucDTmisc1.ascx.vb" Inherits="wucDTmisc1" %>
<%# Register Src="wucBeneficiarios.ascx" TagName="wucBeneficiarios" TagPrefix="uc1" %>
<%# Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<%# Register Src="Controles/wucMoneda.ascx" TagName="wucMoneda" TagPrefix="uc1" %>
<link href="~/css/content.css" rel="stylesheet" type="text/css" />
<link href="~/css/Blue.css" rel="stylesheet" type="text/css" />
<script src="~/js/siscli.js" type="text/javascript"></script>
<script src="~/js/json2.js" type="text/javascript"></script>
<script src="~/js/date.js" type="text/javascript"></script>
after
<%# Control Language="VB" AutoEventWireup="false" CodeFile="wucDTmisc1.ascx.vb" Inherits="wucDTmisc1" %>
<%# Register Src="wucBeneficiarios.ascx" TagName="wucBeneficiarios" TagPrefix="uc1" %>
<%# Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<%# Register Src="Controles/wucMoneda.ascx" TagName="wucMoneda" TagPrefix="uc1" %>
<link href="/css/content.css" rel="stylesheet" type="text/css" />
<link href="/css/Blue.css" rel="stylesheet" type="text/css" />
<script src="/js/siscli.js" type="text/javascript"></script>
<script src="/js/json2.js" type="text/javascript"></script>
<script src="/js/date.js" type="text/javascript"></script>
Also while looking for the solution, I realized that in controls is better to leave the JS code.
It worked for me, I hope you too.
What you need is maybe something as explained here. You'll have to replace the "~" with something that will follow the usercontrol where he PRESENTLY is instead of where he is landed phisicaly in the application.
<script language="javascript" type="text/javascript" src="<%=Page.ResolveUrl("~/JS/VerticalMenu.js")%>"></script>
<script language="javascript" type="text/javascript" src="<%=Page.ResolveUrl("~/library/scripts/side_menu_items.js")%>"></script>
<script language="javascript" type="text/javascript" src="<%=Page.ResolveUrl("~/library/scripts/side_menu_tpl.js")%>"></script>
RESOLVED
I finally found the solution to the problem. It was with the script tag
I rewrote it as
<script src="../library/scripts/side_menu.js" type="text/javascript" />
instead of
<script src="../library/scripts/side_menu.js" type="text/javascript"></script>
Related
I have a pop up I am making thats intended function is to open with interactive calendar Which allows the User to input a Start date and End date using jquery datepicker. However currently on page load, I have to open and close the pop up twice before it functions as intended I am wondering why this is happening / how to fix it ? Here is the code
webpage in question
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<title> {(BnB)} Market </title>
</head>
<div id= 'user_listings'>
</div>
<body>
Market BnB
</body>
<a href = '/make_listings' > Looking to show your own listing? </a>
<div id = 'table'>
<table>
<tr>
<h1> BnB-able properties </h1>
</tr>
<% #BnB.each do |record| %>
<tr>
<td class ='new_BnB'><%= record['address'] %> </td>
<td class ='code_BnB'> | <%= record['post_code']%> </td>
<br>
<a id="OpenDialog" href="#"> <img src = <%= record['photo'] %> width="300" height="200" alt='test' >
</a>
<div id="dialog" title="Property Info" style="display: none;" >
<p>
<p>Start date: <input type="text" id="datepicker"> End date: <input type="text" id="datepicker2"></p>
<input type = "submit" value='Submit'>
</p>
</div>
</tr>
</table>
<% end %>
<head>
<head>
<title></title>
</head>
<body>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</body>
<%# <title>jQuery UI Datepicker - Default functionality</title> %>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<script src="interface.js"></script>
</div>
interface.js
$(document).ready(function() {
$("#OpenDialog").click(function () {
$("#dialog").dialog({modal: true, height: 500, width: 700 });
});
});
$( function() {
$( "#datepicker" ).datepicker();
} );
$( function() {
$( "#datepicker2" ).datepicker();
} );
** what the #BnB value is **
require 'pg'
class BnBControl
attr_accessor :connection
def self.all
#connection = PG.connect(dbname: 'bnb')
listings = #connection.exec("SELECT * FROM properties")
end
------
class BnB < Sinatra::Base
enable :sessions
get '/' do
#if session[:user]
#BnB = BnBControl.all
erb :index_logged_in
# else
# erb :index
# end
end
these are seperate files just included in same code fence
you using document.ready as well as $(function() which are same and need not to be used multiple time. also, call datepicker function inside $(document).ready before popup click event handler, which should work for you.
Try below
$(document).ready(function() {
$( "#datepicker" ).datepicker();
$( "#datepicker2" ).datepicker();
$("#OpenDialog").click(function () {
$("#dialog").dialog({modal: true, height: 500, width: 700 });
});
});
The following code works in a standalone web forms page but not when I bring it into my website which has a master page. Using the Chrome developer tools I see that jQuery and jQuery.uploadify are loaded. The error that occurs when the page loads is:
Uncaught TypeError: $(...).uploadify is not a function
Error occurs on line:
$("#file_upload").uploadify({
Here is the code:
<%# Page Title="" Language="C#" MasterPageFile="~/Shared/DefaultMaster.master" AutoEventWireup="true" CodeBehind="UploadUploadify.aspx.cs" Inherits="Impact.Thm.Web.Utilities.UploadUploadify" %>
<asp:Content ID="Content1" ContentPlaceHolderID="DefaultHeaderContent" runat="server">
<link rel="Stylesheet" type="text/css" href="./App_Themes/Uploader/uploadify.css" />
<script type="text/javascript" src="scripts/jquery-1.8.3.js"></script>
<script type="text/javascript" src="./Scripts/jquery.uploadify.min.js"></script>
<title>Testing Uploadify</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="JavascriptContent" runat="server">
<script type = "text/javascript">
$(function () {
$("#file_upload").uploadify({
'auto': false,
'swf': '/Scripts/uploadify.swf',
'uploader': 'UploadifyStatus.ashx'
});
});
</script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="DefaultContent" runat="server">
<div style="border: thin solid black">
<p><input type="file" name="file_upload" id="file_upload" /></p>
</div>
<p>Upload Files</p>
</asp:Content>
How can I get rid of this error so that it sees the uploadify function?
I'd suggest moving your click event to the page load event (with your other uploadify function), rather than on the link itself:
<asp:Content ID="Content2" ContentPlaceHolderID="JavascriptContent" runat="server">
<script type="text/javascript">
$(function() {
$("#file_upload").uploadify({
'auto': false,
'swf': '/Scripts/uploadify.swf',
'uploader': 'UploadifyStatus.ashx'
});
$("#upload-link").click(function() {
$('#file_upload').uploadify('upload','*');
});
});
</script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="DefaultContent" runat="server">
<div style="border: thin solid black">
<p><input type="file" name="file_upload" id="file_upload" /></p>
</div>
<p>
<a id="upload-link" href="#">Upload Files</a>
</p>
</asp:Content>
To get jQuery.uploadify to work when using a Master Page I had to add a reference to the javascript file. Added the following to the DefaultMaster.master
<asp:ScriptManager> ...
<Scripts>
<asp:ScriptReference Path="~/Scripts/jquery.uploadify.min.js" />
Now I don't get the error:
Uncaught TypeError: $(...).uploadify is not a function
I work with Spring MVC. I have a dynamic web project Eclipse
Structure folder is
I have the following jsp actualizarCorreo.jsp
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%# taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%# taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html>
<html>
<head>
<title>EusurveyAdmin menu princiapl</title>
<script type="text/javascript" src="/resources/js/properties.js"></script>
<script type="text/javascript">
function pruebaB()
{
alert('en prueba');
}
</script>
</head>
<body>
<c:set var="pageNumber" value="${pageNumber}" />
<table class="actualizarCorreos">
<tbody>
<a href="#" onclick="prueba()"; return false;">
<input type="radio" onclick="prueba()" class="check" id="id1"
name="id1" value="true" />
<spring:message code="label.ModificarCorreos" />
</tbody>
</table>
</body>
In this jsp I load another js
<script type="text/javascript" src="/resources/js/properties.js">
This js is the path WebContent/resources/js.
properties.js is
alert('cargado properties');
function checkConfirmationPage()
{
alert('en check');
if ($("#conflink").is(":checked"))
{} else {};
}
function prueba()
{
alert('en prueba');
}
I call function prueba from actualizarCorreo.jsp when a radio button is clicked
<input type="radio" onclick="prueba()" class="check" id="id1"
name="id1" value="true" />
<spring:message code="label.ModificarCorreos" />
I don't see the alert message function prueba.
What is it wrong?
Try this
<script type="text/javascript" src="../resources/js/properties.js"></script>
or use the below as reference and find the exact path:
/ = Root directory
. = This location
.. = Up a directory
./ = Current directory
../ = Parent of current directory
../../ = Two directories backwards
Or directly get the context path to fetch the .js
<script type="text/javascript" src="<%=request.getContextPath()%>/resources/js/properties.js" >
</script>
While using Spring framework in mvc you have to provide resources path as below in your dispatcher-servlet.xml.
< mvc:resources mapping="/resources/**" location="/resources/" />
And then that folder will be allowed for resources. You can call them as
< script type="text/javascript" src="../../resources/js/properties.js" >
</ script>
I have a button that i use to call code behind in my aspx file. I am trying to change the text on the button to no avail.
HTML:
<button class="radius button" runat="server" id="buttonUpload" onServerClick="buttonUpload_Click" >Execute SQL</button>
Here is the javascript:
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<%--<asp:ScriptManager ID="scripman1" runat="server" EnablePageMethods="True">
</asp:ScriptManager>--%>
<link rel="stylesheet" href="stylesheets/foundation.min.css">
<link rel="stylesheet" href="stylesheets/app.css">
<script src="javascripts/modernizr.foundation.js"></script>
<style >
#import "css/datatables/demo_page.css";
#import "css/datatables/demo_table.css";
#import "Table Sorter/style.css";
</style>
<script type="text/javascript" src="js/tablesorter/jquery.tablesorter.js"></script>
<script type="text/javascript" src="js/vendor/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#buttonUpload").text('Save');
});
I have tried $("#buttonUpload").html('Save'). Nothing seems to work.
Wait until the DOM has been loaded first (and jQuery). .text() and .html() will both work.
$(document).ready(function() {
$("#buttonUpload").text('Save');
});
I found out the problem was the runat"server" property
<button class="radius button" runat="server" id="buttonUpload" onServerClick="buttonUpload_Click" >Execute SQL</button>
When you remove that the button's text updates fine.
I have already added these js file to my aspx page. But i still couldn't able to get pdf file of my table data. the generated pdf is blank.i need all table data to that generated pdf .please if any one know how to do this?
<script src="../Script/jspdf.js"></script>
<script src="../Script/FileSaver.js"></script>
<script src="../Script/Blob.js"></script>
<script src="../Script/BlobBuilder.js"></script>
<script src="../Script/deflate.js"></script>
<script src="../Script/adler32cs.js"></script>
<script src="../Script/jspdf.plugin.addhtml.js"></script>
<script src="../Script/jspdf.plugin.from_html.js"></script>
<script src="../Script/jspdf.plugin.split_text_to_size.js"></script>
<script src="../Script/jspdf.plugin.standard_fonts_metrics.js"></script>
<script src="../Script/base64.js"></script>
<script src="../Script/sprintf.js"></script>
// Here is my aspx table or div content:
<div id="divReport" style="display: none">
<input type="button" id="btnSavePdf" value="Save as Pdf" />
<table id="example">
<tr id="trProject">
<td><span>Project :</span></td>
<td><span id="spanProject" runat="server"></span></td>
</tr>
<tr>
<td><span>Total Number of Employee :</span></td>
<td>
<asp:Label ID="spanTotalEmp" runat="server" EnableViewState="false" ClientIDMode="Static" ></asp:Label>
</td>
</tr>
<tr>
<td><span>Total Number of Hours :</span></td>
<td>
<asp:Label ID="spanTotalHours" runat="server" name="_name2" EnableViewState="false" ClientIDMode="Static" ></asp:Label>
</td>
</tr>
</table>
</div>
// Below is my Javascript button onclick code:
$('#btnSavePdf').click(function () {
var doc = new jsPDF('p', 'in', 'letter');
var source = $('#divReport').html();
var specialElementHandlers = {
'#bypassme': function (element, renderer) {
return true;
}
};
doc.fromHTML(
source, // HTML string or DOM elem ref.
0.5, // x coord
0.5, // y coord
{
'width': 7.5, // max width of content on PDF
'elementHandlers': specialElementHandlers
});
doc.output('dataurl');
I assume you want to render the table only instead of the entire page. You can do this using the HTML table export jQuery plugin. This is what your HTML would look like:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<!-- jQuery 2.0.2 -->
<script type="application/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script type="application/javascript" src="tableExport.js"></script>
<script type="application/javascript" src="jquery.base64.js"></script>
<script type="application/javascript" src="jspdf/libs/sprintf.js"></script>
<script type="application/javascript" src="jspdf/jspdf.js"></script>
<script type="application/javascript" src="jspdf/libs/base64.js"></script>
</head>
<body>
<table id="example">
<!-- rows here -->
</table>
As PDF
</body>
</html>
That style="display:none" would prevent it from rendering, thus you get a blank page.
That said, i think you're using quite old templates, cause sprintf.js and base64.js were removed something like three years ago. You should just need to include one of the files available on the dist folder.
https://github.com/MrRio/jsPDF/tree/master/dist
Here you have a working fromHTML table example using the latest version: http://jsfiddle.net/dGLmr/7/