In sap.ui.table.Table I have input field in one column. It will get nearly 300 records of data from back-end and binded in other columns.
User manually enters in the input field. Further, when he clicks on submit button I have to take all values from all input as array. Please give suggestions.
You can do it using data binding of table, as invoking getRows() on Table control to access Input fields of each row would not help in this case;it only returns only currently visible rows and you have around 300 records to access.
Here is the solution:
Get all data from back-end in JSONModel.
Add one property say inputValue to each item in model's data by iterating over it.
Bind this model to table and use inputValue property in table's template to bind column containing Input fields.
As JSONModel supports two-way binding, all the values which user has entered in an Input fields are available in your model.
And, lastly iterate over model's data to get inputValue for each row.
Above steps in action:
Step 1 and 2:
setModelForTable: function() {
var oModel = sap.ui.model.json.JSONModel( < URLToLoadJSON > );
var length = oModel.getData().results.length;
for (var i = 0; i < length; i++) {
var path = "/results/" + i + "/inputValue";
oModel.setProperty(path, "");
}
}
Step 3:
Now, that you have model with inputValue property in all the items of data, set the model on table; which will show all the Input fields in columns empty initially and will update the corresponding model entry as user modifies it.
<t:Column>
<t:label>
<Text text="User Input" />
</t:label>
<t:template>
<Input value="{inputValue}" />
</t:template>
</t:Column>
Finally, get all entered values in array.
var length = oModel.getData().results.length;
var aInputvalues = []
for (var i = 0; i < length; i++) {
var path = "/results/" + i + "/inputValue";
aInputvalues.push(oModel.getProperty(path));
}
I had the case which is a bit similar and I did it in the following way. Will work if you really do not need records which are not changed.
have a variable to store [] of changed records
Attach change to input field
on change push changed record to a variable
var source = event.getSource();
source.getModel().getProperty(source.getBindingContext().getPath());
or the value of the input field.
event.getSource().getValue();
In case you have a record Id you can just push this ID and input value.
4. on submit iterate through an []
Related
I want to repeat the parsys in the columns based on the number of columns added in cq dialog. I can only get one column and the numbers of columns as entered
<div class="items">
<div data-sly-repeat="${grid.cols}" class="col col-lg-4 col-md-2 pt-2 pb-2">
<div data-sly-resource="${'content-{0}' # format=[colList.index], resourceType='wcm/foundation/components/parsys'}"></div>
</div>
</div>
</div>
carousel.js:
"use strict";
use(function() {
var properties = granite.properties,
colCount = properties.numberofcolumns ? properties.numberofcolumns : 3,
cols = '';
return {
"cols" : colCount
};
});
data-sly-repeat expects a list, not a number. You're only returning the number of columns. If you return an n-element list, data-sly-repeat will render an element for each item in the list.
It's a bit of a hack but in your carousel.js, you'd have to return an array with a list of values. The primary use case of data-sly-repeat (and data-sly-list) is to iterate over the elements of a collection returned by the underlying Java/JS code and output the properties of each item in the list. In your case, the only difference between the repeated div elements is the index.
use(function() {
var properties = granite.properties,
colCount = properties.numberofcolumns ? properties.numberofcolumns : 3;
var resultList = [];
for (var i = 0 ; i < colCount ; i++) {
resultList.push(i);
}
return {
"cols" : resultList // data-sly-repeat expects a collection
};
});
On a more general note, it seems what you're aiming to do is to include a bunch of paragraph systems by name to achieve some sort of column layout. Before attempting this, I would consider using the OOTB Layout Container component, which can be resized in Edit mode to fit any number of columns without any new development.
I have a sap/ui/comp/smarttable/SmartTable which receives data of one EntitySet (MAINSet). The table has 5 columns. I added three extra columns manually where I put data from another EntitySet (DetailSet) when a specific button is pressed. I do that manually by iterating throw the table and setting the properties like this:
table.getModel().setProperty(sPath + "/EXAMPLE", EXAMPLE);
Filtering works fine for all the properties of the MAINSet. But filtering properties which I retrieve from the DETAILSet does not work with the following logic:
var oBinding = this.getView().byId("table0").getBinding("items");
var aFilter = [];
var sQuery = oEvent.getParameter("query");
if (sQuery) {
aFilter.push(new Filter("EXAMPLE", FilterOperator.Contains , sQuery));
}
oBinding.filter(aFilter);
Is there any way I can filter the SmartTable for the data received from the DETAILSet?
I created a Form for requesting new student Google account. I want a Sheets Script to email the person who submits the Form the new account information, which is created via a formula on a "Results" sheet.
function Notification() {
// Send email notice for accounts
var lastRow = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Results").getLastRow();
var range = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Results").getRange("A" + lastRow);
if (range.getValue() !== "") {
return lastRow;
} else {
return range.getNextDataCell(SpreadsheetApp.Direction.UP).getRow();
var AccountName = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Results").getRange("H" + lastRow);
var Password = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Results").getRange("I" + lastRow);
var PW = Password.getValue();
var Account = AccountName.getValue();
// Fetch the email address
var emailRange = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Results").getRange("G" + lastRow);
var emailAddress = emailRange.getValues();
// Send Alert Email.
var message = 'Account Request - Account Name: ' + Account + ' Password: ' + PW; // Second column
var subject = 'Google Account Request';
MailApp.sendEmail(emailAddress, subject, message);
}
This script is triggered on a new Form Submit. Attempting to pull the values from the last created row queried to a "Results" sheet, using lastRow to find the latest entries row, from select columns. Script runs without error, but no email is sent, telling me that it's not getting the values, or returning null values.
This is the sheet its pulling data from
You are only sending row 2 because you are retrieving only one value (Password.getValue() and AccountName.getValue()). Consider the difference between getValue versus getValues.
On the other hand, by declaring a range such as getRange("H2:H") ("Account Name") you are including every row in the spreadsheet, including rows with and without content.
How would I make it pull the values from the last created row?
There are two options:
getlastRow() (the "Sheet" versus "Range" version) "returns the position of the last row that has content" doc ref here. In fact, that item of documentation has a good example of how to declare a Range using the command.
there is another (very useful) utility described on StackOverflow that is a favourite of mine. This describes the number of contiguous rows, in a column, with content.
I suggest that you declare the range using getRange(row, column, numRows, numColumns).
"row" having been determined using one of the methods described above, "numRows"=1. Then getValues for that range will include only the values in that row, and your email will be sent only in relation to that row.
I have created a table with a drop-down control (sap.m.ComboBox). I am adding rows dynamically using JSONModel. Here is the logic to bind my table:
My Table bind logic.
Now, I am trying to get values from the table:
var oTable = this.getView().byId("mytable");
var data = oTable.getModel();
var len = oTable._iBindingLength; // Get total Line Items in table
for (var i = 0; i < len; i++) {
var _val1 = data.oData[i].item1;
var _val2 = data.oData[i].item2;
// my value logic here
}
But this is bringing all the values instead of just selected value from my drop-down control.
If you want to get selected key from the ComboBox (drop-down), bind the appropriate model data to its property selectedKey. Once the user selects something, the selected key will be stored in the model thanks to the two-way data binding.
<m:ComboBox width="100%"
selectedKey="{foo/selectedKey}"
items="{
path: 'foo/items',
templateShareable: false
}"
>
<core:Item key="{key}" text="{text}"/>
</m:ComboBox>
I've updated my example from your previous question: https://plnkr.co/edit/8YvXxk?p=preview
The model data is automatically updated when the user selects something from the drop-down:
This may be a basic question, but it's my first, so please be kind :-).
I have a sap.m.table with two models, one model with transaction data (trxModel) and another model that is used to display a sap.m.select list (reasonCodeModel). The table model is set to trxModel.
The selected value key from the dropdown needs to update a value (ReasonCodeID) in the trxModel when a value from the reason code list is selected.
I can retrieve the selected key in the change event as so
var selKey = evt.getParameter("selectedItem").getKey();
Is there a simple way to find the trxModel relevant model path from the table row Select list value I've just modified? Or is it possible to bind the ReasonCodeID from the trxModel to the ReasonCodeID field in the reasonCodeModel?
Just an extra piece of info, The current row is selected and is accessible
var selItem = dtlTable.getSelectedItem();
2nd question and I guess could be kind of related, is there a way of getting the table model path based on the selected item (highlighted row) of the table? And vice a versa?
More details on Select & Table binding.
var tabTemplate = new sap.m.ColumnListItem(
{
::
new sap.m.Select(
"idReasonCodeSelect",
{
enabled : false,
change : function(evt) {
oS4View.getController().changeReasonCodeSel(evt);
}
}
),
Bind the resource code Select to the Table
// bind the reason codes to the reason code model
sap.ui.getCore().byId("idReasonCodeSelect").setModel(
oReasonCodeModel);
sap.ui.getCore().byId("idReasonCodeSelect").bindAggregation("items", "/results",
new sap.ui.core.Item({
key : "{ReasCodeID}",
text : "{ReasCodeDesc}"
}));
Per Qualiture comment, how do I bind the Select key to the table model ReasonCodeID value?
I found an approach to tackle the first part of my question above
From the change function on the Select, I can find the path of the table model using the following.
var path = evt.getSource().getParent().getBindingContext().sPath;
2nd Update:
On the selectionChange event on the table, there's a couple of options to find the associated model path or model content.
// find the model path
oModelPath = selItem.getBindingContext().getPath();
// model values
oItem = oEvent.getParameter("listItem").getBindingContext().getObject();
So my only remaining issue, While I loop through the table model results (trxModel) and I want the Select List (using setSelectedKey) to reflect the ReasonCodeID value in the trxModel.