英文:
PrimeFaces: Paste Excel table to DataTable with InputNumber
问题
<p:column width="80" headerText="Januar">
<p:inputNumber value="#{mto.month01}" symbol="€" symbolPosition="s" decimalPlaces="0"
disabled="#{((mto.year eq indexController.currentYear) and (indexController.currentMonth gt 1)) or (mto.year lt indexController.currentYear) or (indexController.isComponentDisabled('fieldPMForecastOutflow', 'PM'))}">
<p:ajax process="@this" partialSubmit="true"
update=":contentform:dt-PMDetail contentform:blockButtonDeletePMYear"
listener="#{indexController.updateWorkingCopyProjectManagementFinancesDTO}" />
</p:inputNumber>
</p:column>
$('input').bind('paste', function (e) {
var $start = $(this);
var source
//check for access to clipboard from window or event
if (window.clipboardData !== undefined) {
source = window.clipboardData
} else {
source = e.originalEvent.clipboardData;
}
var data = source.getData("Text");
if (data.length > 0) {
if (data.indexOf("\t") > -1) {
var columns = data.split("\n");
$.each(columns, function () {
var values = this.split("\t");
$.each(values, function () {
$start.val(this);
if ($start.next('input')) {
$start = $start.next('input');
$start.val(this);
}
if ($start.closest('td').next('td').find('input')) {
$start = $start.closest('td').next('td').find('input');
}
else
{
return false;
}
});
$start = $start.closest('td').parent().next('tr').children('td:first').find('input');
});
e.preventDefault();
}
}
});
If you need further assistance, feel free to ask.
英文:
I have a p:dataTable
that has multiple columns for month values like this:
<p:column width="80" headerText="Januar">
<p:inputNumber value="#{mto.month01}" symbol="€" symbolPosition="s" decimalPlaces="0"
disabled="#{((mto.year eq indexController.currentYear) and (indexController.currentMonth gt 1)) or (mto.year lt indexController.currentYear) or (indexController.isComponentDisabled('fieldPMForecastOutflow', 'PM'))}">
<p:ajax process="@this" partialSubmit="true"
update=":contentform:dt-PMDetail contentform:blockButtonDeletePMYear"
listener="#{indexController.updateWorkingCopyProjectManagementFinancesDTO}" />
</p:inputNumber>
</p:column>
My users want to be able to paste excel cells into this DataTable.
I tried different javascript snippets, e. g. this and adapted it like this:
$('input').bind('paste', function (e) {
var $start = $(this);
var source
//check for access to clipboard from window or event
if (window.clipboardData !== undefined) {
source = window.clipboardData
} else {
source = e.originalEvent.clipboardData;
}
var data = source.getData("Text");
if (data.length > 0) {
if (data.indexOf("\t") > -1) {
var columns = data.split("\n");
$.each(columns, function () {
var values = this.split("\t");
$.each(values, function () {
$start.val(this);
if ($start.next('input')) {
$start = $start.next('input');
$start.val(this);
}
if ($start.closest('td').next('td').find('input')) {
$start = $start.closest('td').next('td').find('input');
}
else
{
return false;
}
});
$start = $start.closest('td').parent().next('tr').children('td:first').find('input');
});
e.preventDefault();
}
}
});
When I paste data, the currency symbol is lost, no validation happens (I can paste letters) and as soon as I hover over a field with the mouse, the value is reset to its original value.
What I am looking for is a solution that 'tabs' to the next field and inputs the value like I would via the keyboard (e. g. numbers only). If too many columns are pasted, they can be omitted. A new line in the excel data should result in a new line in the DataTable (if I paste a 3x3 table in column 4 of line 1, columns 4 to 6 in rows 1 to 3 should be filled).
答案1
得分: 2
使用小部件 API 并使用其 setValue
函数来设置组件输入字段的值,而不是直接将值写入组件的输入字段。
从文档中可以得知:
将此输入数字小部件的值设置为给定的值。确保数字被正确格式化。
英文:
Instead of directly writing the value to the component's input field, use the widget API and use its setValue
function to set the value.
From the documentation:
> Sets the value of this input number widget to the given value. Makes sure that the number is formatted correctly.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论