We Keep Coding

Use a variable inside an html quote

I'm using angular and i have this HTML code
<input
onKeyDown="if(this.value.length==12 && event.keyCode!=8) return false;"/>
How can i add the variable "myNum" instead of that 12?

I assume you have defined mynum in your .js file?
<input
onKeyDown="if(this.value.length=={{mynum}} && event.keyCode!=8) return false;"/>
though that is very unclean like this.
you would better write a method that you call here:
<input onKeyDown=checkInput(this.value.length, event.keyCode)>
and in your .js in the method you can make the check and return true/false:
checkInput(int valueLength, int keyCode){
if (valueLength == this.mynum && keyCode != 8){
return false;
}
}

How to handle alphanumeric and null in JavaScript?

We are facing an issue on handling null, because if the value is null, it is not reaching the server. Below is the code snippet:
<input ... onchange="return checkEmpty(this);" />
And the JavaScript:
function checkEmpty(value) {
alert("Empty Check() "+value);
if (myTrim(value.length == 0)) {
alert("please Enter Value!"+ value +" value");
return false;
}
return true;
}
We are trying to display one popup for null value and the request should go to the server, but some exception is occurring we are unable to identify it and the request is not coming to server.

You can do this:
if (variable == null) {
// do something
}
--which is 100% equivalent to the more explicit but less concise:
if (variable === undefined || variable === null) {
// do something
}

While there are ways to solve this specific problem (and the other answer(s) manage to answer that), I'll try to address a more general one.
What you essentially want is the form control to not be empty. Well, you don't need JavaScript for that at all
<input ..... required>
That will prevent the form from submitting unless the required field was filled.
<form>
Try to submit me empty! <input required>
<button>I dare you!</button>
</form>

AngularJS How to dynamically get the ng-model value of inputs in a form or whatever

I have a form containing inputs with a ng-model defined for each of them :
<form>
<input type="date" ng-model="dateFilterInput" id="dateFilter" class="...">
<select class="..." id="authorFilter" ng-model="authorFilterInput">
...
</select>
<input type="text" class="..." id="categoryFilter" ng-model="categoryFilterInput">
</form>
As my form could get dynamically further inputs (using ng-repeat), I want to check in each input if the value is empty using ng-model dynamically
I'm doing a foreach loop for each inputs in the form, and calling this function with the ng-modal name (string) as parameter :
$scope.isEmpty = function(ngModelInput) {
if(modelInput == "" || typeof modelInput == 'undefined') {
//do something if field is empty...
}
};
or
$scope.isEmpty = function(ngModelInput) {
if($scope.modelInput == "" || typeof $scope.modelInput == 'undefined') {
//do something if field is empty...
}
};
But this doesn't work because ngModelInput is a string.
For example :
Imagine ngModelInput = "dateFilterInput"
How to translate this :
$scope.ngModelInput (How to write it ?)
to make this :
$scope.dateFilterInput
Hope you see what I mean ^^
Thanks for your help !

Modify the isEmpty function as below and that should solve your problem.
Do not use ng as prefix to any variable as ng is a angular reserved keyword and it may confuse other developers.
$scope.isEmpty = function(modelInput) {
if($scope[modelInput] == "" || typeof $scope[modelInput] == 'undefined') {
//do something if field is empty...
}
};
The above code takes whatever the parameter(string) you pass to the isEmpty function and checks for that particular name in the $scope object and gives you the value based on it.

HTML Input element (field.validate) is always undefined

I'm having two text boxes defined with an onblur event. On pressing tab, whenever the onblur event is get called field.validate is always undefined.
At the same time, when I'm trying to print field.name or field.getAttribute("validate") it does return the proper value.
<input width="100%" type="text" name="NV_active" id="NV_active" value="5" onblur="return doValidate(this);" validate=" return validateValueField(document.getElementById('NV_active'), 'Active' );">
<input width="100%" type="text" name="NV_throttled" id="NV_throttled" value="15" onblur="return doValidate(this);" validate=" return validateValueField(document.getElementById('NV_throttled'), 'Throttled' );">
function doValidate(field) {
console.log("field.validate- " + field.validate); //always printing undefined
console.log("getAttr- " + field.getAttribute("validate")); //return validateValueField(document.getElementById('NV_active'), 'Active' );
if (field.validate != null) {
var f = new Function(field.validate);
return f();
}
return true;
}
function validateValueField(field, displayName)
{
if ((field.name == 'NV_activePollingInterval') || (field.name == 'NV_throttledPollingInterval') )
{
//some validation code and error alert message
}
}
I am not able to figure it out why it's always undefined.

Using field.getAttribute('attr') you retrieve the value of the DOM element's attribute.
Using field.attr you retrieve the property attr of the DOM element and they are not always the same thing.
I recommend you to check this SO question: getAttribute() versus Element object properties? and the accepted answer, it should help you.

Javascript can't locate HTML form ID

I'm creating a basic HTML form, and a Javascript form validator that looks for any input value in the "first name" field. The problem I'm having is that nothing seems to be working to return the first name form value to check it in JS.
Relevant HTML:
<form id="form1" name="formName">
First name:<br>
<input type="text" id="fn" >
<br>
Last name:<br>
<input type="text" name="ln" >
<br>
Email address: <span style="color:red">(required)</span><br>
<input type="text" name="email" >
<br><br>
<button onclick="validate()">Submit</button>
</form>
My JS:
var validate = function (){
var x = document.getElementById("fn").value;
if (x == null || "" || "undefined"){
alert("Please fill out your first name");
return false;
}
kickoff();
}
var kickoff = function () {
var visitor = document.forms["form1"].fn.value;
alert("Thanks for filling out, " + visitor +"\n");
return visitor;
};
Here's a JSFiddle.
My X variable is never reached, it seems, and keeps returning "undefined" when I submit the page. I've been fiddling with it for quite a while and can't seem to figure out what I'm doing wrong. Any help?

This doesn't mean what you think:
if (x == null || "" || "undefined") {
Can also be written as:
if ((x == null) || // might be false
"" || // will be false
"undefined" // will be true
) {
so the if will always be true.
You really just need:
if (! x) {

Besides the syntax issues, that method is also out-of-scope. You're not even going to be able to debug the issue with your conditional until you fix that.
You can either in-line the script higher up in the DOM or define validate directly on the window object:
window.validate = function () {
http://jsfiddle.net/frg37t3u/5/
Neither case is ideal, you should know. Globals are bad, but that's another discussion.