I am trying to use the Wijimo Auto Complete Directive inside a ng-repeat and though I can bind successfully to a data source I cannot set the scope for a specific instance - the value selected in 1 directive is set for all instances in the scope.
Its the classic ng-repeat issue when using using repeated input controls.
I am not sure if its the way the wj-auto-complete directive sets which property on the scope.
So this works fine for 1 instance and multiple instances within an ng-repeat (but sets the same value).
<wj-auto-complete
text="selectedHotel"
items-source="limo.hotelData"
placeholder="Hotel"
display-member-path="address"
max-items="50"/>
</div>
<p>{{selectedHotel || json}}</p>
I have tried the following
<div ng-repeat="flight in flights">
<wj-auto-complete
text="flight.from"
items-source="limo.hotelData"
placeholder="Hotel"
display-member-path="address"
max-items="50"/>
</div>
but no joy.
It looks like the text property is what is set with the selected value? Though the property value is a little odd.
Both the ComboBox and AutoComplete control have a "text" property that gets or sets the text currently shown by the control, and also a "selectedValue" property that gets or sets the value that is currently selected. These two often match, except while the user is typing and the incomplete text doesn't match any items in the list of valid choices.
This fiddle shows how using the "selectedValue" property works OK for both the ComboBox and AutoComplete. I hope it's useful:
http://jsfiddle.net/Wijmo5/8p94jo6q/
<table class="table table-condensed">
<thead>
<th>ID</th>
<th>Country</th>
<th>AutoComplete</th>
<th>ComboBox</th>
</thead>
<tbody>
<tr ng-repeat="item in data">
<td>
{{item.id}}
</td>
<td>
{{item.country}}
</td>
<td>
<wj-auto-complete
items-source="countries"
selected-value="item.country"
placeHolder="country"
required="false">
</wj-auto-complete>
</td>
<td>
<wj-combo-box
items-source="countries"
selected-value="item.country"
placeHolder="country"
required="false">
</wj-combo-box>
</td>
</tr>
</tbody>
</table>
Related
I'm trying to achieve the following result: I have a set of values that are coming from an array which I iterate over in order to populate an HTML table. As well I have an icon that user can hoover-over and can see data in there coming from the array and a translation key coming from translation files.
I want to bind a second argument to the TCustomAttribute in order to display to the user another data that was edited by them.
How do I achieve this in Aurelia?
<template>
<table>
<thead>
<th><span>Id</span></th>
<th><span>Name</span></th>
<th><span>Description</span></th>
<th><span>Date</span></th>
</thead>
<tbody>
<tr repeat.for="item of data">
<td><span>${item.Id}</span></td>
<td><span>${item.Name}
<a data-toggle="popover" t="[data-content]pending_name ${data.Name}" data-trigger="hover">
<i class="fa fa-info-circle"></i>
</a>
</span></td>
<td><span>${item.Description}</span></td>
<td><span>${item.Date}</span></td>
</tr>
</tbody>
</table>
</template>
Take a look at the t-params attribute which allows you to pass in additional parameters. More about that in the official guide http://aurelia.io/docs/plugins/i18n#using-the-plugin
I need to modify the format of a form in a model-driven app to make it more readable/intuitive. Currently, the form looks like this:
I tried to use a web resource to create a simple HTML table with <script> and Xrm.Page.getAttribute() to pull in the relevant fields under the planned and actual columns, but that isn't working. I set the dependencies and assigned it to the proper form element, but no luck. The code that I used is this:
<div>
<table>
<tr>
<td><u>Tasks</u></td>
<td><u>Planned</u></td>
<td><u>Actual</u></td>
</tr>
<tr>
<td>Task 1</td>
<td><script>Xrm.Page.getAttribute("[plannedField_1]")</script></td>
<td><script>Xrm.Page.getAttribute("[actualField_1]")</script></td>
</tr>
<tr>
<td>Task 2</td>
<td><script>Xrm.Page.getAttribute("[plannedField_2]")</script></td>
<td><script>Xrm.Page.getAttribute("[actualField_2]")</script></td>
</tr>
<tr>
<td>Task 3</td>
<td><script>Xrm.Page.getAttribute("[plannedField_3]")</script></td>
<td><script>Xrm.Page.getAttribute("[actualField_3]")</script></td>
</tr>
</table>
</div>
Is this a valid way to modify form output, or is there another/better way to do this that doesn't involve creating an elaborate solution with dynamically scripted HTML?
Uncheck the Display label on the form for one of the controls.
I have a tablesorter table where a column uses the filter-select and filter-onlyAvail classes.
What I'm trying to do is pre-filter that column on one of the values in the drop-down select.
I have tried setting it in the data-placeholder attribute but that doesn't do the trick.
I've also tried the following:
$(document).ready(function(){
$.tablesorter.setFilters($("#table"),['','','','','','','','T'],true);
});
It correctly sets the filter in the select menu but doesn't actually RUN the filter.
Any ideas?
To initially set the filters, add the filter to a header "data-value" attribute (set by the filter_defaultAttrib widget option):
<table id="table">
<thead>
<tr>
<th>...</th>
...
<th data-value="T">...</th>
</thead>
<tbody>
...
</tbody>
</table>
You can see an example here in the Age column where <30 is initially set.
I have allowedcontent=true which is working and allowing me to have attributes in my opening tags; however, CKEdtior is still removing the closing tag attributes. I am using the editor to allow modification of simple Handlebars templates that use {{each}} and {{/each}}. The issue comes when using this with a table and wanting to repeat my rows.
For example, I have the following HTML entered into source:
<table>
<tr data-each={{each Person}}">
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr data-each="{{/each}}">
</table>
When I click out of source, it removes the attribute on my closing tr tag.
Is there anyway to force CKEditor to not remove this attribute? If not, does anyone know of a way to allows me to use something like this:
<table>
{{each Person}}
<tr>
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr>
{{/each}}
</table>
When I try the above example, it is reformatted to be:
<section>{{each Person}} {{/each}}
<table>
<tr>
<td class="col-student-id">{{Identifier}}</td>
<td class="col-name">{{Name}}</td>
</tr>
</table>
Your input source code is invalid - closing tags cannot have attributes in HTML, so CKEditor ignores them. Read more in CKEditor HTML Autocorrection Issue.
I want to create an xpath for clicking on "run " (4th column) based on the first column value (xyz). the below xpath doesnt work. Can you suggest a better way of writing the xpath.
//table/tbody/tr/td[text()='xyz fix']/parent::tr/td[4]
<div id="main">
<table class="FixedLayout" width="1000px">
<tbody>
<tr></tr>
<tr>
<td class="RowHeight">
xyz
</td>
<td>xyz fix</td>
<td>1125</td>
<td>
Run
</td>
</tr>
<tr>
<td class="RowHeight">
abc
</td>
<td>abc fix</td>
<td>1125</td>
<td>
Run
</td>
</tr>
</tbody>
</table>
</div>
I don't see why your one didn't work. Please clarify what it means "doesn't work". NoSuchElementException? ElementNotVisibleException? Wrong XPath? Not clicking the link or what?
Meanwhile, try the following XPaths (but the issue could be your Selenium code instead of XPath):
Here I assume you want to the <a> link instead of <td>, because you mentioned you want to click it.
Use XPath predicate:
//*[#id='main']//table/tobdy/tr[td[text()='xyz']]/td[4]/a
Use XPath predicate with attribute selector to avoid using index.
//*[#id='main']//table/tobdy/tr[td[text()='xyz']]//a[contains(#href, 'Instance/Create')]
Use .. to get the parent
//*[#id='main']//table/tobdy/tr/td[text()='xyz']/../td[4]/a