angularjs mask override characters - angularjs

I have a mask setup on a date field using the angular-ui masks module like so:
<input type="text"
id="date"
ng-model="transaction.date"
ui-mask="99/99/9999" />
If I have 30/05/2013 in the field and want to change that to 10/05/2013 by simply putting a '1' at the start it pushes all the characters over so it becomes 13/00/5201.
Is there way to force ui-mask to overwrite the character insted of inserting it? (This would save someone from hitting 'delete' then the character.
Example: http://jsfiddle.net/5NbD7/
If you type '30' at the front of my example you will end up with 30/01/0120 I would rather it override the characters and produce 30/01/2010

I don't know it there is an easier way, but you try the following :
You will need to download mask.js, unminified, from source and link it in your html, if you haven't already done so.
https://rawgithub.com/angular-ui/ui-utils/master/modules/mask/mask.js
Then you will need to modify the source code of mask.js like this (seach for the comment //Update Values and put this code below) :
...
// Update values
if (oldValueUnmasked !== "" && oldValueUnmasked!==valUnmasked && !isDeletion) {
var charIndex = maskCaretMap.indexOf(caretPos);
if (charIndex === -1) {
charIndex = maskCaretMap.indexOf(caretPos+1);
}
valUnmasked=valUnmasked.substr(0,charIndex).concat(oldValueUnmasked.substr(charIndex,valUnmasked.length));
}
...
Now, before updating the value, mask will do a concatenation of the characters in the old value and those in the new value, depending on the position of the cursor (caret).
It's by no means an ironproof solution, but it should give you an idea of where to look if you want to customise the input more or check that this change does not break anything else.
Fiddle:
http://jsfiddle.net/CALvj/

I think that the way typed characters are inserted or overwrite input text depends on the keyboard current insert mode. Users can simply change the default pressing the Ins key.
The only way to change it from code would be forcing an Ins key press but this isn't allowed in Javascript.

Related

Place plaintext right beside variables (without whitespace) in VS Code User Snippets

I would like to create a User Snipper in VS Code that is a combination of variables and plaint text. This can typically be achieved by combining variables and plain text with a whitespace between then. But I would like to ad a variable next to a text without a whitespace.
For Example, I would like to create the current timestamp like this:
2022-02-19T21:02:24-0530
Below is what I tried
$CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATET$CURRENT_HOUR:$CURRENT_MINUTE:$CURRENT_SECOND-0530
Notice the T in between $CURRENT_DATE & $CURRENT_HOUR
OUTPUT:
2022-02-CURRENT_DATET21:06:12-0530
You can add $ symbol before the plain-text you want to add.
In this case, you need at add $T instead of T
$CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE$T$CURRENT_HOUR:$CURRENT_MINUTE:$CURRENT_SECOND-0530
Note that $T will get considered as a placeholder, and it will be the last item selected while tabbing through the inserted snippet.

Restricting file types in AngularJS with HTML input type="file"

So my HTML passes a file into AngularJS, and it is named as myFile.
So I use:
console.log($scope.myFile.type);
and it prints out 'application/pdf'.
But when I use this line:
if ($scope.myFile.type == 'application/pdf'){
// some stuff here
}
or
($scope.myFile.type == {'image/jpeg': fileMimeType})
Those will not ever be equal to true. I have no idea how to run this comparison anymore, and would appreciate snippets that would allow me to somehow create this comparison.
Thanks.
I wish i could make comments, but alas i do not have enough points. Did you try console.log( typeof $scope.myFile.type); to make sure it was a string? Also did the output itself have single quotes in it? because if it does have the quotes in it you'll either need to strip those or compare with the quotes in your string.

set selection range after set innerText (angular js)

I have two directives. The first one called restricted-text watch for ngModel changes and replace current value with old one if new one doesn't respect given regexp. It works very well when placed on input.
The second one is a directive called input-editable. It's a span[contendeditable]. It works very well too.
Then, we plug the first one on the second :
<input-editable ng-model="lol" restricted-text="^[a-z]+$"></input-editable>
and it fails…
When I type a not allowed character, then, the content of the spec is well changed. But ! The crret go back to the start of the span. I would like the caret stays at the same place, or at worst, go the the end like an input. I've tried lot of things with getSelection and createRange, all that I get is the caret position. The cursor don't move when I call setStart.
Have a look here

Angularjs: default value when current option not in domain of select

I have cascading select where the value in the first decided what should be the option of others.
When I change the value of the first select so that the currently selected value in one other is no more a possible choice, I get a null (empty) choice. In place, I want to get a default, not null, value (of course, I don't want to reset to a default value is the choice is still legit).
I looked to (rather) similar question like Why does AngularJS include an empty option in select? but is does not seem to work, perhaps because my options are not predefined but generated on change.
I set-up a jsfiddle with the actual code: http://jsfiddle.net/sXu9a/
choose 2 hours or greater on the first select
chosse 1 in the second select (start hour)
choose back less than 1 hour in the first select
=> the second select display a empty option, and the "startHour" model still contains the last selected value (which is no more a valid choice). I really want to update the ng-model for that option to be reseted to 0.
In fact, I would like to be able to encode the condition: "if current model value for selected option is not in the set of possible value, reassign to model a default value (0)". So I tried a "onChange" like that:
$scope.onChangeInterval = function() {
if(jQuery.inArray($scope.agentSchedule.startHour, $scope.startHours() ) ) {
$scope.agentSchedule.startHour = $scope.startHours()[0];
}
}
But that does not seem to work.
Any idea about that ?
So, it happens that the "onChange" solution DOES work, as long as you don't make typos in the variable of your name. So with the following code (onChange is called on the first select):
$scope.onChangeInterval = function() {
if(jQuery.inArray($scope.agentSchedule.startHour, $scope.hours() ) ) {
$scope.agentSchedule.startHour = $scope.hours()[0];
}
}
Sorry for the noise!

unterminated string literal error in salesforce

I am trying to get a value from salesforce class into a javascript variable. I am able to get the value if its a single line value, but if its multiline textarea it gives a unterminated string literal error
caseUpdate.Description = "{!ac__c.C_Info__c}";
After googling for sometime i came to know we can have a workaround for this by having a hidden field and using DOM storing it using the document.getElement.Id. But i am calling this code on a button click so i would not be able to create a input text or hidden field value.
Any body who can provide an way to do it?
Thanks
Prady
You should just be able to use the standard Salesforce JSENCODE() function if you are using OnClick Javascript in a button. This will escape any characters for you.
See the documentation.
It is because of line breaks. merge fields are rendered unescaped into the output stream meaning that CRLFs push into a new line and break javascript strings. Either use the div/input trick or use Apex to replace \r\n's in the field with <br/> or whatever best suits the purpose. Also keep in mind that " will also terminate your JS string.
The easiest way is to just include a function in your extension and then you can use it across board
public String FixNewLine(String s) {
if (s != null) return s.replaceAll('\r\n', '<br/>').replaceAll('"', '\\"');
return null;
}
I had the same issue but was able to fix it! The trick is the JSENCODE function. Its basically {!JSENCODE(Obj.Field)}"; So you are replacing your merge field with this function and nesting the merge field itself within the function. In my scenario I ended up with opptyObj.Description="{!JSENCODE(Case.Description)}"; as my total syntax. First calling upon my set object and field, and then the merge data to populate it.

Resources