I m creating Web application using MVC3.In Global.asax we are giving the routings like below.
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
"Default", // Route name
"{controller}/{action}/{id}", // URL with parameters
new { controller = "Login", action = "RedirectToLogin", id = UrlParameter.Optional } // Parameter defaults
);
routes.MapRoute(
"Paging",
"Home/Page/{page}",
new { controller = "Login", action = "RedirectToLogin" }
);
}
After this in Login page we are giving ~ symbol to access the css,js files like below.
<link href="<%=Url.Content("~/Content/jquery.mobile/jquery.mobile.min.css")%>" rel="stylesheet" type="text/css" />
<script src="<%=Url.Content("~/Scripts/jquery.mobile.min.js")%>" type="text/javascript"></script>
And other aspx pages we are access the css,js files like below
<link href="<%= Url.Content("../Content/jquery.mobile/jquery.mobile.min.css")%>" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%= Url.Content("../Scripts/jquery.mobile.min.js")%>"></script>
ADDED
I am using common toast message for all pages.At that time
if (messageType == "notification") {
$.mobile.loading("show", {
text: message,
textVisible: true,
theme: "b",
textonly: false,
html: "<span></span><img src='../Content/jquery.mobile/images/notice.png' style='margin-left:75px'><h1>" + message + "</h1>"
});
While accessing the image in different page creating problem.
}
Url accessing is different between the pages.Is there any way to make it common for all pages.Please suggest the solution for this
Related
I have a nextjs project. I want to implement oneTrust CMP solution for my domain. I am required to place oneTrust scripts before any other scripts In the _app.js file and I want to check if the sub-domain is 'X' then I do not want to load the scripts. I have implemented this using useEffect.I have initially set load = true and in useEffect for domain 'X' I have set load = false. In the code I load the sciprts if the load is set to true. But for domain 'X' my scripts are stil loading.
My Code:
function MyApp({ Component, pageProps }) {
const [load, setLoad] = useState(true);
useEffect(() => {
if (window != undefined) {
// console.log(window.location);
const paths = window.location.host;
if (paths.includes("X")) {
setLoad(false);
}
}
}, []);
return (
<Fragment>
<Head>
</Head>
{load ? (
<>
<Script
strategy="beforeInteractive"
src="src"
type="text/javascript"
charSet="UTF-8"
data-domain-script="some-id"
></Script>
<Script
id="test"
strategy="beforeInteractive"
type="text/javascript"
dangerouslySetInnerHTML={{
__html: `
js code
`,
}}
/>
</>
) : (
""
)}
Some other scripts....
<Component {...pageProps} />
</Fragment>
);
}
What am I doing wrong here? and will my oneTrust script execute before other scripts in this manner?
For those with the same question, I solved the problem. You can add getInitialProps to your _app.js file and add your host detection code there.
rest of the _app.js code
MyApp.getInitalProps = async(context)=>{
const url = context.ctx.req.headers.host;
// pass the url data to your component
return { data: url };
}
export default MyApp
Does reactjs works fine with IE8? I am using React v0.11.1.
Following code is NOT working in IE8. Works fine on all the other browsers
SCRIPT438: Object doesn't support property or method 'isArray'
File: react.js, Line: 17372, Column: 37
SCRIPT5009: 'React' is undefined
File: myreact.js, Line: 3, Column: 1
SCRIPT438: Object doesn't support property or method 'map'
File: JSXTransformer.js, Line: 12637, Column: 3
/** #jsx React.DOM */
var MyComponent = React.createClass({displayName: 'MyComponent',
getDefaultProps:function(){
return{
text:"",
numbers:0
}
},
getInitialState:function(){
return {txt:"initial", id:0}
},
updateText: function(event){
this.setState({text:event.target.value})
},
propTypes:{
text:React.PropTypes.string,
numbers: React.PropTypes.number.isRequired
},
render:function(){
return (
React.DOM.div(null,
Widget({text: this.state.text, update: this.updateText}),
Widget({text: this.state.text, update: this.updateText})
)
)
}
});
var Widget = React.createClass({displayName: 'Widget', render:function(){
return(
React.DOM.div(null,
React.DOM.input({type: "text", onChange: this.props.update}),
React.DOM.div(null, this.props.text)
)
)
}
});
React.renderComponent(
MyComponent({text: "HI there", numbers: 34}),
document.getElementById("content")
);
You need to use the following shims/pollyfills as noted in the react docs. es5-shim will resolve the specific isArray bug you are seeing.
I've managed to launch my React app in IE8 using the following code:App.js:
require('core-js'); //Important!
var React = require('react');
var ReactDOM = require('react-dom');
var Application = React.createClass({ ... });
ReactDOM.render(React.createElement(Application,null), document.getElementById("app-container"));
index.html:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-sham.min.js"></script>
<script type="text/javascript" src="bundle.js" defer></script>
</head>
<body>
<div id="app-container"></div>
</body>
</html>
Comments: bundle.js will be loaded after es5-shim/es5-sham because of defer html attribute
Our application uses an $http interceptor to add tokens to $http requests as a form of security, the token that the interceptor adds are updated every 5 or so minutes. We now want to use ng-grid.
However, the $http interceptor makes is so that ng-grid will not load the template it uses for the header row, which causes the header row to not render.
Here is the issue in action: http://plnkr.co/edit/krvBF2e4bHauQmHoa05T?p=preview
If you check the console it shows the following error:
GET http://run.plnkr.co/l0BZkZ2qCLnzBRKa/ng1389719736618headerRowTemplate.html?securityToken=123456 404 (Not Found)
The reason why this happens is because ng-grid stores the template for the header row in the $templateCache, and then uses an ng-include to later retrieve it.
ng-include uses a $http.get request, with $templateCache as the cache, to get the template.
The $http.get request is intercepted by the interceptor which adds the security token to the url before it has a chance to query $templateCache for the template using the url.
$templateCache is expecting ng1389719736618headerRowTemplate.html but instead gets ng1389719736618headerRowTemplate.html?securityToken=123456
The result is that the $templateCache can't find the template, which then results in $http.get hitting the server and getting the 404 error.
The other issue is that if we ever wanted to use $templateCache to store templates and later retrieve it with ng-include or $http.get, $templateCache would not being able to find the template because the url would get modified.
How can I get ng-grid to display the header row with the $http interceptor adding security tokens to the end of the urls?
here is the code
Html:
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="utf-8">
<title>Custom Plunker</title>
<link rel="stylesheet" type="text/css" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script>
<script type="text/javascript" src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body ng-controller="MyCtrl">
<div class="gridStyle" ng-grid="gridOptions"></div>
</body>
</html>
javascript:
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
$scope.myData = [{name: "Moroni", age: 50},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34}];
$scope.gridOptions = { data: 'myData' };
});
app.config(function($provide, $httpProvider) {
$provide.factory('tokenAuthInterceptor', function($q){
return {
// optional method
'request': function(config) {
// do something on success
config.url = config.url + "?securityToken=123456";
return config || $q.when(config);
}
};
});
$httpProvider.interceptors.push('tokenAuthInterceptor');
});
Update
The solution that was finally decided upon was to use an angular decorator and decorate $templateCache, the plunker was updated to reflect this.
$provide.decorator('$templateCache', function($delegate) {
var get = $delegate.get;
function formatKey(key)
{
// code for formatting keys
}
$delegate.get = function(key) {
var entry = get(key);
if (entry)
{
return entry;
}
else
{
return get(formatKey(key));
}
};
return $delegate;
});
We ran into this same issue and implemented a quick check in our interceptor to check if the item was already in the templateCache.
if ($templateCache.get(config.url)){
return config;
}
I got the idea from the cachebuster project.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Uploadify: show error message from HTTP response
I am developing the application on VS 2010. During debugging, When i upload an image file i get IO Error. Here is the image
Following is my script
<script type="text/javascript">
$(document).ready(function () {
$('#file_upload').uploadify({
'uploader': '/uploadify/uploadify.swf',
'script': 'Home/Upload',
'cancelImg': '/uploadify/cancel.png',
'folder': 'Content/Images',
'fileDesc': 'Image Files',
'fileExt': '*.jpg;*.jpeg;*.gif;*.png',
'auto': true
});
});
</script>
Following is my controller code
public string Upload(HttpPostedFileBase fileData)
{
var fileName = this.Server.MapPath("~/Content/Images/" + System.IO.Path.GetFileName(fileData.FileName));
fileData.SaveAs(fileName);
return "ok";
}
It's hard to say what the problem might be with your code. You will have to debug it.
Here's a full working example:
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult Upload(HttpPostedFileBase fileData)
{
if (fileData != null && fileData.ContentLength > 0)
{
var fileName = Server.MapPath("~/Content/Images/" + Path.GetFileName(fileData.FileName));
fileData.SaveAs(fileName);
return Json(true);
}
return Json(false);
}
}
View (~/Views/Home/Index.cshtml):
#{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link href="#Url.Content("~/uploadify/uploadify.css")" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="file_upload"></div>
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/uploadify/swfobject.js")" type="text/javascript"></script>
<script src="#Url.Content("~/uploadify/jquery.uploadify.v2.1.4.js")" type="text/javascript"></script>
<script type="text/javascript">
$('#file_upload').uploadify({
'uploader': '#Url.Content("~/uploadify/uploadify.swf")',
'script': '#Url.Action("Upload", "Home")',
'cancelImg': '#Url.Content("~/uploadify/cancel.png")',
'folder': '#Url.Content("~/content/images")',
'fileDesc': 'Image Files',
'fileExt': '*.jpg;*.jpeg;*.gif;*.png',
'auto': true
});
</script>
</body>
</html>
Make sure that the ~/Content/Images folder to which you are uploading exists on your server or the controller action will throw an exception. You will also notice how in my example all urls are referenced through url helpers instead of hardcoding them. This way the application is guaranteed to work no matter whether it is hosted inside a virtual directory in IIS or locally.
I have used the uploadify version 2.1.4 that I downloaded and put the contents in the ~/uploadify folder on the server.
Another thing that you should be aware of is the limit of files that can be posted to ASP.NET which could be configured in web.config using the httpRuntime element. So if you nitend to upload large files make sure you have adjusted the maxRequestLength and executionTimeout settings to the desired maximum values you want to allow:
<system.web>
<httpRuntime maxRequestLength="102400" executionTimeout="3600" />
</system.web>
it's help you.
var auth = "#(Request.Cookies[FormsAuthentication.FormsCookieName]==null ? string.Empty : Request.Cookies[FormsAuthentication.FormsCookieName].Value)";
var ASPSESSID = "#(Session.SessionID)";
$("#uploadifyLogo").uploadify({
...
'scriptData': { 'ASPSESSID': ASPSESSID, 'AUTHID': auth }
});
In Global.asax :
protected void Application_BeginRequest(object sender, EventArgs e)
{
/* we guess at this point session is not already retrieved by application so we recreate cookie with the session id... */
try
{
string session_param_name = "ASPSESSID";
string session_cookie_name = "ASP.NET_SessionId";
if (HttpContext.Current.Request.Form[session_param_name] != null)
{
UpdateCookie(session_cookie_name, HttpContext.Current.Request.Form[session_param_name]);
}
else if (HttpContext.Current.Request.QueryString[session_param_name] != null)
{
UpdateCookie(session_cookie_name, HttpContext.Current.Request.QueryString[session_param_name]);
}
}
catch
{
}
try
{
string auth_param_name = "AUTHID";
string auth_cookie_name = FormsAuthentication.FormsCookieName;
if (HttpContext.Current.Request.Form[auth_param_name] != null)
{
UpdateCookie(auth_cookie_name, HttpContext.Current.Request.Form[auth_param_name]);
}
else if (HttpContext.Current.Request.QueryString[auth_param_name] != null)
{
UpdateCookie(auth_cookie_name, HttpContext.Current.Request.QueryString[auth_param_name]);
}
}
catch
{
}
}
private void UpdateCookie(string cookie_name, string cookie_value)
{
HttpCookie cookie = HttpContext.Current.Request.Cookies.Get(cookie_name);
if (null == cookie)
{
cookie = new HttpCookie(cookie_name);
}
cookie.Value = cookie_value;
HttpContext.Current.Request.Cookies.Set(cookie);
}
Using soundManager2, I made a simple anchor with onclick="mySound.play()", but there is a big gap (almost half a second) before the sound is actually heard! This is, even though I pre-loaded the sound. How can I get a better response-time?
Here is the source code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="Shawn Inder" />
<title>jeuReno</title>
<style type="text/css">
<!--
-->
</style>
<!-- include SM2 library -->
<script type="text/javascript" src="soundManager/script/soundmanager2.js"></script>
<!-- configure it for your use -->
<script type="text/javascript">
soundManager.url = 'soundManager/swf/'; // directory where SM2 .SWFs live
// Note that SoundManager will determine and append the appropriate .SWF file to the URL,
// eg. /path/to/sm2-flash-movies/soundmanager2.swf automatically.
// Beta-ish HTML5 audio support (force-enabled for iPad), flash-free sound for Safari + Chrome. Enable if you want to try it!
// soundManager.useHTML5Audio = true;
// do this to skip flash block handling for now. See the flashblock demo when you want to start getting fancy.
soundManager.useFlashBlock = false;
// disable debug mode after development/testing..
// soundManager.debugMode = false;
// Option 1: Simple onload() + createSound() method
/*soundManager.onload = function() {
// SM2 has loaded - now you can create and play sounds!
soundManager.createSound('helloWorld','sounds/crash.mp3');
soundManager.play('helloWorld');
};*/
// Option 2 (better): More flexible onload() + createSound() method
/*soundManager.onload = function() {
var mySound = soundManager.createSound({
id: 'aSound',
url: 'sounds/kick.mp3'
// onload: [ event handler function object ],
// other options here..
});
mySound.play();
}*/
// Option 3 (best): onready() + createSound() / ontimeout() methods for success/failure:
/*soundManager.onready(function() {
// SM2 has loaded - now you can create and play sounds!
var mySound = soundManager.createSound({
id: 'aSound',
url: 'sounds/snare.mp3'
// onload: [ event handler function object ],
// other options here..
});
mySound.play();
});*/
soundManager.useHighPerformance = true;
soundManager.ontimeout(function() {
// (Optional) Hrmm, SM2 could not start. Show an error, etc.?
alert("wtf");
});
</script>
<script type="text/javascript">
/*var snare = soundManager.createSound({
id: 'snare',
url: 'sounds/snare.mp3'
});
var kick = soundManager.createSound({
id: 'kick',
url: 'sounds/kick.mp3'
});
var crash = soundManager.createSound({
id: 'crash',
url: 'sounds/crash.mp3'
});
var highHat = soundManager.createSound({
id: 'highHat',
url: 'sounds/highHat.mp3'
});*/
soundManager.onready(function() {
// SM2 has loaded - now you can create and play sounds!
mySound = soundManager.createSound({
id: 'aSound',
url: 'sounds/snare.mp3'
// onload: [ event handler function object ],
// other options here..
});
mySound.load();
// mySound.play();
});
</script>
</head>
<body>
click
</body>
</html>
I don't see where the song gets preloaded. You want to set autoLoad to true in the default or createSound section (the defaults should be inherited by createSound).
In the default section it would be soundManager.autoLoad = true;
Or in the createSound method autoLoad:true, id: 'aSound', url: 'sounds/kick.mp3'