DataTable search in not used field - angularjs

I want to search in a datatable field that not used as columns in serverSide mode.
$scope.dtColumns = [
DTColumnBuilder.newColumn('title').withTitle('title')
.renderWith((data, type, full) => {
return `${data} <br> ${full.title_en}`;
}
)
]
I Have used title filed as a column, But don't have used title_en.
Now When I search title_en, the result is empty!
What's your idea?

Related

Solr and TYPO3 faceting

I've created a field called "international" in my TYPO3 project. This field is a checkbox and is displayed on my backend with an associated label.
'international' => [
'exclude' => FALSE,
'label' => 'LLL:EXT:projects/Resources/Private/Language/locallang_db.xlf:tx_projects_domain_model_requestprojects.international',
'config' => [
'type' => 'check',
'items' => [
// label, value
['LLL:EXT:projects/Resources/Private/Language/locallang_db.xlf:tx_projects_domain_model_requestprojects.international.items.1', 1],
],
]
],
If I go to my frontend, the faceting is indeed showing the field as link to filter my content thanks to this :
fieldRenderingInstructions {
international =< plugin.tx_solr.search.faceting.facets.international.renderingInstruction
international.field = international_intS
}
faceting {
facets.international {
label.data = LLL:EXT:skin/Resources/Private/Language/locallang.xlf:tx_projects_domain_model_requestprojects.international
field = international_intS
renderingInstruction = TEXT
renderingInstruction {
field = optionValue
wrap = {LLL:EXT:projects/Resources/Private/Language/locallang_db.xlf:tx_projects_domain_model_requestprojects.international.items.|}
insertData = 1
}
}
}
Starting with this, I have 2 questions:
Why does my content which have the field "international" not selected are triggering an "extra faceting" this the name of my root page?
If I have 2 "international" and 3 "international" not checked, my facets returns "international (2)" and "root page (3)" ? (the 3 have an empty value)
How can I hide this facet, but keep getting the value that was set to my content ?
I need to hide this facet on front (but probably I will have to fix the "bug" from 1), but keep the given value.
That was quite simple, actually.
Just added this in my facet
includeInAvailableFacets = 0

Loop through objects containing array of objects in reactjs

I am new to reactjs.
I have a survey question answer UI, where I can enter question title and have the option to select the type of option.
If I select Text and Boolean type no option will be provided.
But if I select Lsit or Multiselect etc, a text box will be provided to add options.
So when I select Text type
{...questions.map((x, idx) => ( console.log(questions[idx] )) )}
I get the output like this first time
Object {
"text": "asdsad",
"type": "text",
"options": null
}
First time options will be null which is fine. So I just need the question title and type to DB.
Then on clicking on 'List' type in my UI , this console becomes :
Object{
"text": "asdsad",
"type": "list",
"options": [
{
"value": "sdsad"
}
]
}
I need to check whether options.value is set or not every time. If it is set then I need to look whether options.value is null or not for validation. How can I get that in the below loop.
{...questions.map((x, idx) => ( console.log(questions[idx] )) )}
Without knowing the details of your code, here is a function that you can use to validate your questions. It will return a boolean true/false.
It uses Array.prototype.every to test that all questions match the condition. The condition that the options are not null.
const isQuestionsValid = (questions) => {
return questions.every((question) => question.options !== null);
};

Convert an iterable map object to array object in ReactJS

I'm trying to load some json file in a DropdownList from react-widgets. When I load the json file the data type looks like this:
Map {size: 1, _root: ArrayMapNode, __ownerID: undefined, __hash: undefined, __altered: false}
__altered
:
false
__hash
:
undefined
__ownerID
:
undefined
_root
:
ArrayMapNode
size
:
1
__proto__
:
KeyedIterable
While the Dropdown component (from react-widgets) needs an array! So It makes this error:
Failed propType: Invalid prop `data` of type `object` supplied to `DropdownList`,
expected `array`. Check the render method of `Uncontrolled(DropdownList)`.
I can't load the json file directly and I have to use ajax to load it (or technically I can but it's a huge file and each time the user click on the dropdown list it takes couple of seconds to load the data from file). How can I convert this to an array?
P.S. The json file looks like this:
{
"items":[
{
"id": "aaa",
"name": "english"
},
{
"id": "aab",
"name": "Swedish"
},
]
}
I think you're looking for something along the lines of:
var dropdownList = jsonObject.items.map((item, i) => {
return (
<option key={i} val={item.id}>{item.name}</option>
);
})
The Array.prototype.map function simply goes over a list and produces a new list of the same size but with changes based on the modifier/callback function.
Update based on comment:
Based on the docs for DropdownList, you have two options for passing data to the list: a flat array of item names, or a list of objects with specific keys for the item name and value.
Option 1: flat list of item names
var itemNames = jsonObject.items.map((item) => item.name );
Option 2 : list of objects
var items = jsonObject.items.map((item) => {
return {
textField: item.name,
valueField: item.id
}
});
The benefit to using the second option would be when someone selects one of the items, the event that is created with point to the val attribute of the HTML <option>. This is useful for you especially since your ids and names are not the same. An example:
Option 1 (from above):
<DropwdownList
data={itemNames}
onSelect: (event) => {
// Will give the `val` attribute set by DropdownList
// This might be the item name, or it might be something unique to DrowdownList
console.log(event.target.value);
}
/>
Option 2 (from above):
<DropwdownList
data={items}
onSelect: (event) => {
// Will give the `valueField` attribute you set, which for you is the item's `id` field
// This might be the item name, or it might be something unique to DrowdownList
console.log(event.target.value);
}
/>

Import a table from an Excel Sheet into HTML table , using AngularJS

How do I import an excel sheet into a HTML table , such that every row can be converted into an Object, based on the Column Names. Using Angular JS
P.S: The Objects are needed for the future sorted tables .
I have developed a component for that. Please take a look if it helps you: https://github.com/Helvio88/angular-xlsx-model
Using
<input type="file" xlsx-model="excel">
will give you the ability to select a file.
For multiple files:
<input type="file" xlsx-model="excel" multiple>
It can be further extended to filter out specific extensions and so on. Refer to http://www.w3schools.com/jsref/dom_obj_fileupload.asp
Once you select a file, an Angular JSON object named after the xlsx-model attribute (in this case 'excel') will be created in this format:
$scope.excel (multiple files):
{
"file1.xlsx": {
"Sheet1": [
{
"Col1Name": "Row1Col1_Value",
"Col2Name": "Row1Col2_Value"
},
{
"Col1Name": "Row2Col1_Value",
"Col2Name": "Row2Col2_Value"
}
],
"Sheet2" : [...]
},
"file2.xlsx": {...}
}
That model is valid if you've selected multiple files. For a single file, it's slightly different.
$scope.excel (single file):
{
"Sheet1": [
{
"Col1Name": "Row1Col1_Value",
"Col2Name": "Row1Col2_Value"
},
{
"Col1Name": "Row2Col1_Value",
"Col2Name": "Row2Col2_Value"
}
],
"Sheet2" : [...]
}
Playground:
http://plnkr.co/edit/inETA0PcxIkm4EmS9qjD?p=preview

How to set combox value on form from grid with nested data? Extjs 4.2 Mvc

I have a grid that pops up an edit form with combobox. Before I show the view I load the combobox store. Then I set the values of the form using form.loadRecord(record);. This loads the primary record ok. But how do I load the associated data value that is tied to the combobox so the combobox's value is set correctly.
I know I can use setValue manually, but I guess I was thinking could be handled via a load form.
If my form has 3 fields lets say firstName lastName and then a combobox of ContactType. The firstName and lastName are in my primary record with ContactType being the associated record. If I change values in fields lastName or firstName a change is detected and the record is marked as dirty. If I change the combobox value the record is not marked as dirty. I am guessing because they are two different models. How to make it one record. I would think having a combobox on a form that has its values set from a record in a grid is common but I can't find any examples of best way to accomplish this.
Here is some code.
My json looks like this. Primary record has firstName lastName hasOne associated record is ContactType
{
"__ENTITIES":[
{
"__KEY":"289",
"__STAMP":12,
"ID":289,
"firstName":"a",
"middleName":"",
"lastName":"asd",
"ContactType":{
"__KEY":"2",
"__STAMP":4,
"ID":2,
"name":"Home"
}
}
]
}
Controller list function,edit function and updatefunction, fires when grid row is clicked
list: function () {
var mystore = this.getStore('Contacts')
mystore.proxy.extraParams = { $expand: 'ContactType'};
mystore.load({
params: {
},
callback: function(r,options,success) {
// debugger;
} //callback
}); //store.load
editContact: function (grid, record) {
//load store for combobox
var store = this.getStore('ContactTypes');
store.load({
params: {
},
callback: function(r,options,success) {
// debugger;
} //callback
}); //store.load
var view = Ext.widget('contactsedit');
var form = view.down('form')
//load primary record
form.loadRecord(record);
//load associated record
form.loadRecord(record.getContactType());
updateContact: function (button) {
var win = button.up('window'),
form = win.down('form'),
record = form.getRecord(),
values = form.getValues(),
store = this.getStore('Contacts')
if (form.getForm().isValid()) {
if (this.addnew == true) {
store.add(values);
} else {
record.set(values);
}
store.sync();
win.close();
}
}
The loadRecord(record.getContactType) is a getter to the associated data. I am able to get the associated data but not sure how to make it set the value in the combobox or how to get it to act as one record and detect changes automatically.
My Contacts Model
Ext.define('SimplyFundraising.model.Contact', {
extend : 'Wakanda.model',
requires:[
'SimplyFundraising.model.ContactType'
],
fields: ['firstName', 'middleName','lastName','ContactType.name'],
associations: [
{
type: 'hasOne',
model: 'SimplyFundraising.model.ContactType',
name: 'ContactTypes',
getterName: 'getContactType',
associationKey: 'ContactType'
}
]
});
ContactType model
Ext.define('SimplyFundraising.model.ContactType', {
extend : 'Wakanda.model',
fields: ['__KEY','name',]
});
Is this the proper way to set a value for a combobox in a form with nested data?
Should I not use associations and just put all fields in my Contact Model ie add all ContactType fields to Contact model, then data should be in the same record and change tracking would work. But this seems counter to the MVC pattern and counter to the reason for associations.
How do you guys handle this scenario, any examples would be great!
Thanks,
Dan
if your form is loading the values correctly, then all you need to do is this:
Extjs4, How to set displayField in combo editor?

Resources