Error when accesing Razor Boolean variable in Javascript - javascript

I have tried several tactics to use the boolean value within the JS ,but nothing works :
<script type="text/javascript">
var model = #Html.Raw(Json.Encode(Model));
if (model.IsNew == true) {
alert("1");
}
</script>
Tried the following:
var IsNew = #Model.IsNew ;
var IsNew = "#Model.IsNew";
I keep getting the following error :
Conditional compilation is turned off
Anyone could explain why this occurs and maybe guide me to a possible solution ?

Try
if ('#Model.IsNew' == 'true') {
alert("Is New");
}

That's just the VS IDE failing to understand the mix of Razor and Javascript.
Your code will work fine.

Related

Javascript (strict) errors in Safari and Firefox with jQuery

I have the following javascript function that prevents form submission if all required fields are not complete and is part of a form I am creating using Google Apps Scripts. Note that the #submitbutton is actually a regular button and Google Apps Scripts forces strict javascript. The script works fine on chrome, but when I test it on Safari or Firefox, it doesn't appear to be running. Am I using a method that only works on Chrome? Am I missing something here?
I get the following errors in Safari:
Uncaught TypeError: undefined is not a function (evaluating '(1, $)('#submitbutton')') and Uncaught Strict mode does not allow function declarations in a lexically nested statement.
Firefox gives a similar issue: Uncaught in strict mode code, functions may be declared only at top level or immediately within another function 2699307207-maestro_htmlapp_bin_maestro_htmlapp.js:84:360 and Uncaught TypeError: $ is not a function
<script type="text/javascript">
$('#submitbutton').on('click', function() {
$(this).val("Submitting...");
//check for required fields
var emptyFields = $('[required]').filter(function() {
$(this).removeClass("warning");
if ($(this).val().length === 0){
$(this).addClass("warning")
return true
} else {
return false
}
});
if (emptyFields.length === 0) {
$(this).prop('disabled', true);
document.getElementById('incompleteWarning').style.display = 'none';
document.getElementById('bePatient').style.display = 'inline';
google.script.run.withSuccessHandler(fileUploaded).uploadFiles(this.parentNode);
} else{
$(this).val("Submit Application")
document.getElementById('incompleteWarning').style.display = 'inline';
document.getElementById('incompleteWarning').style.color = 'red';
}
});
</script>
jsfiddle here: https://jsfiddle.net/hofresre/
Note that the jsfiddle doesn't use the google.script, but replaces it with this.parentNode.submit()
Any help is greatly appreciated.
Per comments:
Line 84 of maestro_htmlapp_bin_maestro_htmlapp.js:84:360:
function ys(a){for(var b=[],c=0;c<a.length;++c){var d=a[c];b[c]=Mn(d)?(new String(d)).toString():d}return b}var As=[vh,"[object Object]"];var Bs=["alert",ts(function(a){return alert(a)},16,[4]),"confirm",ts(function(a){return confirm(a)},16,[4]),"prompt",ts(function(a,b){return prompt(a,b)},16,[4,4])];var Cs=window.console&&window.console.error?function(a){window.console.error(a)}:void 0,Ds=window.console&&window.console.info?function(a){window.console.info(a)}:void 0,Es=window.console&&window.console.log?function(a){window.console.log(a)}:void 0,Fs=window.console&&window.console.warn?function(a){window.console.warn(a)}:void 0,Gs=["console.debug",ts(window.console&&window.console.debug?function(a){window.console.debug(a)}:void 0,16,[4]),"console.error",ts(Cs,16,[4]),"console.info",ts(Ds,16,[4]),
I guess you know that browser don't support web functionalities the same way. We know that google always focalize their web library and their support firstly for chrome browser.
When you just have this error:
functions can only be declared at top level or immediately within another function
You must not put a function declaration inside any other block, like an if-statement or for-loop; cause any block scope that use curly braces: try-catch-finally, if-else if-else, for, switch, and ES6 also define new feature that utilize block scope such as class.
you can't: "use strict" { Function bar(){/****/} }
Therefore, independents solutions that i can provide are:
Find if there is a version of script (here google script or JQuery) (which is recent) where this problem have been solved.
You can also comment "use strict" in the corresponding script (for example in google script).
Make show that you first include google script and JQuery before the other js scripts.
Try to use non minified script library because something (an example which append with JQuery 1.11) it's the cause of the problem.
Before trying previous solutions, maybe this modified code can work:
<script type="text/javascript">
var trySubmission = function() {
$(this).val("Submitting...");
//check for required fields
var emptyFields = $('[required]').filter(function() {
$(this).removeClass("warning");
if ($(this).val().length === 0){
$(this).addClass("warning")
return true
} else {
return false
}
});
if (emptyFields.length === 0) {
$(this).prop('disabled', true);
document.getElementById('incompleteWarning').style.display = 'none';
document.getElementById('bePatient').style.display = 'inline';
google.script.run.withSuccessHandler(fileUploaded).uploadFiles(this.parentNode);
} else{
$(this).val("Submit Application")
document.getElementById('incompleteWarning').style.display = 'inline';
document.getElementById('incompleteWarning').style.color = 'red';
} ;
}
$('#submitbutton').on('click', trySubmission ) ;
</script>
What mode are you loading the HTML as from the GS file?
When in SandboxMode.NATIVE the error occurs in SandboxMode.IFRAME things seem to work
Here is some test code for a GS file
function doGet(e) {
var html= HtmlService.createTemplateFromFile("test.html");
return html.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
...and the HTML as test.html
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
function myFunction() {
if (jQuery) {
// jQuery is loaded
console.log( "Loaded" );
} else {
// jQuery is not loaded
console.log( "Not Loaded" );
}
$("#message").html("Something happened.");
}
$(document).ready(myFunction);
</script>
<p id="message">Nothing happened. </p>

Any reason why this javascript blink code won't work?

I have the below code in the second of two js files from a web-app.
It works fine, until I combine the two js files into one. Then the js breaks.
function oBlink()
{
return window.setInterval
(
function()
{
$("#sOr").css("background-color", function (){ this.switch = !this.switch; return this.switch ? "#F90" : "" });
}
, 500
);
}
I've isolated the problem to the code
this.switch = !this.switch; return this.switch ? "#F90" : ""
If I take that out, the rest of my js works fine.
I understand there are a lot of external variables that could be coming into play here, but I just wanted to check with you guys that the above function code doesn't have any errors in it.
Thanks for taking a look.
it's working fine in the browser, but failing when checking it on certain devices in the Android emulator.
That's probably because you are using switch in your code which is a reserved word in JavaScript. Only ECMAScript5-based browsers allow using reserved words as object's properties.
Instead of using a flag you can declare a CSS class and use the jQuery's toggleClass method.
Make sure you define somewhere
switch = false
Then Try
$("#sOr").css("background-color", function (){ this.switch =
!this.switch; return (this.switch ? "#F90" : "#FFF" ) });

JavaScript: Variable is false but if statement is true?

I have this JS code:
var show = elm.hasClassName('level0') ? false : true;
if(show) {
doSomething()
}
I am using FireBug to check the value of show and it clearly states false. While debugging, I noticed that the doSomething function is called anyway. What am I missing?
Using if(false) does not run the doSomething function.
Thanks!
From whatever code you have shown (!!!), I believe that your debugging is wrong. May be you are seeing the value of
elm.hasClassName('level0')
as
false
But, var show = elm.hasClassName('level0') ? false : true; means show will be set to inverse of elm.hasClassName('level0')
Just add an alert(show) above the if condition and see what is printed. See this fiddle http://jsfiddle.net/g4Zqp/1/ It works perfectly fine.
If this is not the case, you need to put your complete code
Try this
if( !elm.hasClassName('level0')) {
doSomething()
}

How know if ModelState contains errors

When a form is posted in my controller, I make the following check:
if(ModelState.IsValid)
If the model is not valid, errors are added to the ModelState. The model is then passed to the view with validation summary.
However, I want to check if the ModelState has errors from inside the jQuery ready handler, so that I can add some additional behavior if the form has errors. Is that possible?
You could spit global javascript variable:
<script type="text/javascript">
var isValid = #Html.Raw(Json.Encode(ViewData.ModelState.IsValid));
</script>
and then:
$(function() {
if (!isValid) {
alert('opa');
}
});
a little addition to #Dimitrov answer:
<script type="text/javascript">
var isValid = '#Html.Raw(Json.Encode(ViewData.ModelState.IsValid))';
if (isValid != 'true')
// model has some errors...
</script>
It's important to use single qoutes around the helper. Otherwise, that ending semicolon ; cause problems. Nether you can write it, nor you can't, at all cases it cause a syntax error. Unless you put those single quotes around the helper as I mentioned.
In addition to Darins Answer:
In .cshtml:
#Html.Hidden("IsValid", Json.Encode(ViewData.ModelState.IsValid))
in JS
var isValid = $('#IsValid').val().toLowerCase() == "true";

can't find javascript error

I would like to add new attribute to select box which name and id are 'firm_id'. So far I have tried with this code, its working fine in mozila but not working in IE.
I am doing this with javascript because select box is coming from ajax.
The function sbmtfrm() is not calling in IE.
Error: Message: 'FB' is undefined.
May be FB is a object called in my js lib files, but now i am writing code within a another saperate script tag.
<script type="text/javascript">
function sbmtfrm()
{
alert('now submitting...');
document.frmsearch.submit();
}
function setOnclickAtt(name)
{
alert("'"+name+"'" + document.getElementById(name).getAttribute('onchange'));
alert(document.getElementById(name));
if(document.getElementById(name))
{
alert('attrr changed');
var ref = document.getElementById(name);
ref.setAttribute('onchange', 'sbmtfrm();');
alert("now new atrr = " + document.getElementById(name).getAttribute('onchange'));
}
else
{
alert('again');
setTimeout("setOnclickAtt('firm_id')",100);
}
}
setOnclickAtt('firm_id');
</script>
Any suggestion or ideas would be greatly appreciated.
Thanks a lot.
I think IE is picky when it comes to event handling. Try:
ref.onchange = sbmtfrm;
instead of:
ref.setAttribute('onchange', 'sbmtfrm();');
Also, I think the error message has nothing to do with this issue. It´s wrong but it´s another issue.

Categories