How can I use a localization files and overwrite 1 localization function - localization

I am trying to build a localized bootstrap-table.
<table class="table table-condensed table-bordered table-hover"
data-cache="false"
data-show-footer="false"
data-show-refresh="false"
data-show-toggle="false"
data-toggle="table"
/>
$('#table').bootstrapTable({
locale :"nl-NL"
});
Everything works when I include the locale-file bootstrap-table-nl-NL.js
I want to overwrite the footer text showing the pagination text. In the documentation it says I need to define a function for formatShowingRows
There seems to be a problem using both locale and formatShowingRows
$('#table').bootstrapTable({
locale :"nl-NL"
formatShowingRows: function (pageFrom, pageTo, totalRows) {
return 'Showing ' + pageFrom + ' to ' + pageTo + ' of ' + totalRows + ' rows';
}
});
When I execute the above script. The pagination text is not replaced with the text I want.
If I remove the locale. It does.
So it looks like locale and formatShowingRows are not compatible.
Any ideas ??

You can use updateFormatText to change the messages BootstrapTable uses even (or especially) with localization. See https://live.bootstrap-table.com/code/wenzhixin/1640 for an example.

Related

Make <p> appear and dissapear in Thymeleaf according to variable

Hello I am building an application in Spring Boot and Thymeleaf and I have a paragraph that I want to make it appear only if it has a value. If it does not I do not want it to appear.
Here is the code that I have tried:
<h2 th:text="'Raspuns: ' + ${raspuns}" th:disabled="${raspuns}==null"></h2>
But when I enter the page it says: Raspuns: null I want to make that dissapear.
try this:
<h2 th:if="${raspuns} != null" th:text="'Raspuns: ' + ${raspuns}"></h2>
see more about conditions in the documentation:
Thymeleaf Conditional Evaluation

Thymeleaf String Concatenation

Thymeleaf String concatenation not work
data-th-text=${employee.empFirstName} +' '+ ${employee.empLastName}
could anyone explain reason for this.
Thanks
You have two options (span is just a example-element):
1.)
<span th:text="${employee.empFirstName + ' ' + employee.empLastName}"></span>
2.) using "|...|"
<span th:text="|${employee.empFirstName} ${employee.empLastName}|"></span>
You are using data-th-text (writting html5 custom attributes). You can use the same syntax here. Have a look at the single- and double-quotes, vertical lines and ${...} blocks.

DataTables row details in Ruby on Rails - how to separate HTML from Javascript

I am using DataTables jQuery plugin in a Ruby on Rails project (directly, not through a datatables-rails gem) and I need to display row details as explained here:
https://datatables.net/examples/server_side/row_details.html
In my case, after calling $("#table_id").DataTable(), I use this format() function in .js file to pass data for display to the row.child:
/* Formatting function for row details */
function format(d) {
// `d` is the original data object for the row
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' +
'<tr>' +
'<td>' + label_variable1 + ':</td>' +
'<td>' + d.office.name + '</td>' +
'</tr>' +
'<tr>' +
'<td>' + label_variable2 + ':</td>' +
'<td>' + d.office.location + '</td>' +
'</tr>' +
// Several more rows...
'</table>';
}
This works fine, however it looks messy with all this HTML in the .js asset file. I want to understand if there is a way to extract the HTML (possibly in a partial).
Sure you can. Use form_for or simple_form_for to create the form in a template (make it a partial if you wish). And then in js code you just need to call $("#table_id").DataTable() (of course table_id is the id of your table here, and you can pass in options at the same time).

How to add the language selector in the ckeditor tool

I've integrated the ckeditor gem for rails in the activeadmin gem. So far it is working good but I want to include the language selector which I've seen in the demo of the ckeditor. But I've not found any related article except this. The demo of that selector isthis. Thanks in advance.
Download CKEditor and check the following sample: samples\uilanguages.html
Basically, CKEditor demo just shows a custom select element, with the list of languages taken from samples/assets/uilanguages/languages.js
The most relevant lines from this sample are:
<script src="assets/uilanguages/languages.js"></script>
<script>
document.write( '<select disabled="disabled" id="languages" onchange="createEditor( this.value );">' );
// Get the language list from the _languages.js file.
for ( var i = 0 ; i < window.CKEDITOR_LANGS.length ; i++ ) {
document.write(
'<option value="' + window.CKEDITOR_LANGS[i].code + '">' +
window.CKEDITOR_LANGS[i].name +
'</option>' );
}
document.write( '</select>' );
</script>
Keep in mind that by default CKEditor auto detects the browser language and loads the correct translation. So, providing a select combo to a user may so that he could select the language may not have a lot of sense.

Kendo UI Conditional Button in ClientTemplate

I'm trying to get a conditional client template to work in a Kendo Grid that will call into my controller with a simple userName string as a parameter but I cannot figure out the syntax to get this working correctly.
My template is in my view like this:
columns.Bound(user => user.IsLockedOut).ClientTemplate(
"# if (IsLockedOut == true) { #" +
"<input type='button' value='Unlock Acc' onclick='location.href=" + #Url.Action("UnlockAccount", "Administration", new { userName = "#= UserName #" + }) + "/>" +
"# } else { #" +
"Unlocked" +
"# } #"
);
And the action method of the controller looks like:
public void UnlockAccount(string userName)
{
}
At the moment the error generated is:
CS1525: Invalid expression term '}'
I've been looking at this for a couple of hours now and I cannot see the wood for the trees now.
You have some '+' plus symbol that you do not actually need. Also you do not need the 'at' sign # in front of the helper.
new { userName = "#= UserName #" + }) //<- that last plus
This method worked for me.
const string ShowUpdateButton = "#if (IsNetReversal == false) {#<a class='k-button k-button-icontext k-grid-edit' href='\\#'><span class='k-icon k-edit'></span>Update</a>#}#";
const string ShowReverseButton = "#if (IsNetReversal == false) {#<a class='k-button k-button-icontext k-grid-reverse' href='/JournalDetail/Reverse/#: ID #' ><span class='k-icon k-reverse'></span>Reverse</a>#}#";
const string ShowDeleteButton = "#if (IsAdjustment == true) {#<a class='k-button k-button-icontext k-grid-delete' href='\\#'><span class='k-icon k-delete'></span>Delete</a>#}#";
You can do the template inline but I find it easier (particularly for multiple buttons) if you declare constants and then use string.format to concatenate them.
col.Template(o => o).ClientTemplate(string.Format("{0}{1}{2}", ShowUpdateButton, ShowDeleteButton, ShowReverseButton));
The upside is it will work with popup editor whereas jquery hacks will ignore the conditional status when a user cancels out of edit. A cancel from the popup editor will restore the grid row from the viewmodel or wherever Kendo stores it which results in button states from before any jquery/javascript hack. The method above will also auto-wire the standard commands since I copied their HTML output for the client template.
The downside is that if Kendo changes their pattern for command buttons the client template may fail. I tired several other methods besides this one and the downside to this method seems better than the other methods.
Note on Kendo Forums: As of the date of this post, they do not appear to allow people who do not pay for support to post to the forums so I would suggest posting questions here instead. They monitor Stack Overflow and in my experience they seem to answer questions more quickly here.
I've gotta a bit further but only by manually writing the URL like this:
"<input type='button' value='Unlock Acc' onclick='location.href=/Administration/TryUnlockAccount?userName=#= UserName #'/>"
Still doesn't call my controller method though but it does have the right parameter value ...

Resources