Hello.
How to add input mask like this ?
I readed the documentation and found this.
It works with normal form, but it doesn’t work with master detail form. I can’t find event for master detail form.
Hello.
How to add input mask like this ?
I readed the documentation and found this.
Hello @heruprambadi ,
I don’t understand what is your question to be honest. Would you like to trigger this event but for detailed/master form?
Regards
Johnny
Hello john. I want to create javascript input mask like this Edit fiddle - JSFiddle - Code Playground
How to create it in gc ? I try like this article JavaScript Events | Grocery CRUD v3 but doesn’t work.
Anyway, you can click on word “this” in my question above
Hello @heruprambadi ,
You will need to:
window.addEventListener('gcrud.form.add-load', ({detail}) => {
// Your custom JavaScript here
});
I hope this helped.
Regards
Johnny
Thx @johnny now i’m able to do it. I need this event “gcrud.form.add-load” to make it work.
I hope future GCE have feature like money input mask, because some user type 1.000.000, another user type 1,000,000, and the other type 1000000. We need to make standart for it.
For you who expriencing similar problem with me, i’m just gonna put it here, in case you need it.
callback add field in controller :
$crud->callbackAddField('nama', function ($fieldType, $fieldName) {
return '<input type="text" name ="nama" class = "myForm">';
});
script in view file :
<script>
window.addEventListener('gcrud.form.add-load', ({
detail
}) => {
let input = document.getElementsByClassName("myForm");
console.log(input.length);
for (var i = 0; i < input.length; i++) {
input[i].addEventListener("keyup", (e) => {
formatCurrency(e.target);
});
input[i].addEventListener("keypress", (e) => {
formatCurrency(e.target);
});
}
function formatNumber(n) {
// format number 1234567,89 to 1 234 567,89
return n.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",")
}
function formatCurrency(input) {
var input_val = input.value;
if (input_val === "") {
return;
}
var original_len = input_val.length;
var caret_pos = input.selectionStart;
input_val = formatNumber(input_val);
input.value = input_val;
var updated_len = input_val.length;
caret_pos = updated_len - original_len + caret_pos;
input.setSelectionRange(caret_pos, caret_pos);
}
});
</script>
@johnny it doesn’t work if we use it on master detail :
But if we open master detail link directly, it works.
Hello @heruprambadi ,
That’s weird. I will check it and let you know. Probably during the weekend.
Regards
Johnny
Hello @heruprambadi ,
I confirm that this is a Grocery CRUD bug and this will be fixed for the next version.
I will keep you updated once the new version is released.
Regards
Johnny
Hello @heruprambadi ,
I am glad to inform you that the new version is now released (3.0.15) . You can download it from here:
https://www.grocerycrud.com/users/enterprise-version-wizard
Let me know if you are still having issues with the publish of the events on master-detail grid.
Regards
Johnny
Hello @johnny , i confirm this not work with the latest version of GCE (V3.1.4). I just update my GCE using “composer update --prefer-dist” and my input mask not working anymore. I try to replace my GCE with the old one, and it working again. Any solution for this ?
Hello @heruprambadi that’s weird since I haven’t changed anything related with this change. Can you please check if publish_events configuration
is set to true
? This will only work when this is true, the default configuration is false.
Regards
Johnny
Before update, the publish_events is true. So after update, it still true.
I dont know what’s the problem, but after update, my input mask does not work anymore.
And after i replace GCE file in vendor folder, it works.
Hello @heruprambadi ,
Are you still having the same issues even with the latest version? 3.1.9
?
Regards
Johnny