Hello all,
Update
I have investigated several times until now - and it seems to be something with the following error: "TypeError: $(...).inputmask is not a function" by executing the line
$('[data-inputmask]').inputmask();
in the childpages with an UpdatePanel.
End Update
I have tried to make use of RobinHerbots InputMask and inherited the functionality in my ASPX's masterpage and it works nearly fine. But only on some of my inherited pages it works fine and shows the inputmask on hover and focus. On other ASPX-pages it does not show the inputmask on hover and focus. I have based my coding on this jsfiddle:
https://jsfiddle.net/sotosamper1234/7vddjcwu/
I have googled a lot without finding the answer until now :-(
So my question is what do I have to do for making the inputmask visible on hover and on focus on all my inherited ASPX-pages inherited from SitePage.Master?
I am very new to JavaScript - so maybe there is something which for me is new to learn.
Thanks in advance,
Michael
What I have tried:
In my SitePage.Master I have called the RobinHerbots code by adding the following:
<script type="text/javascript" src="Inputmask-5.x/jquery.js?v="+<%# DateTime.Now.ToString("ddMMyyyyhhmmss") %> ></script>
<script type="text/javascript" src="Inputmask-5.x/dist/jquery.inputmask.js?v="+<%# DateTime.Now.ToString("ddMMyyyyhhmmss") %> ></script>
In my pages I have called the input mask in this way:
<asp:TextBox ID="txtAddADate" runat="server" Text="" Width="150px" data-inputmask="'alias': 'FreEconomic-datetime'"></asp:TextBox>
var customInputmask = (function () {
var config = {
extendDefaults: {
showMaskOnHover: true,
showMaskOnFocus: true
},
extendDefinitions: {},
extendAliases: {
'FreEconomic-datetime': {
alias: "datetime",
inputFormat: "dd.mm.yyyy"
},
'FreEconomic-decimal': {
alias: 'currency',
prefix: '',
radixPoint: ',',
groupSeparator: '.',
autoGroup: false,
}
}
};
var init = function () {
Inputmask.extendDefaults(config.extendDefaults);
Inputmask.extendDefinitions(config.extendDefinitions);
Inputmask.extendAliases(config.extendAliases);
$('[data-inputmask]').inputmask();
};
return {
init: init
};
}());
$(document).ready(function () {
customInputmask.init();
}());