Skip to content

changeText.md

Latest commit

 

History

History
76 lines (48 loc) · 3.69 KB

changeText.md

File metadata and controls

76 lines (48 loc) · 3.69 KB

Change texts

Back to documentation index

There are some texts in selectic. But sometimes it is useful to change them (because you want to translate them or to be more precise for the context usage).

There are 3 ways to changes these texts:

  • Call the static changeTexts() method. It changes texts for all selectic components.
  • Change the texts property. It changes texts only for the component.
  • Call the changeTexts() method on the component. It changes texts only for the component.

Changes made locally take precedence over changes made globally..

Changing texts on the component with property or with changeTexts() are equivalent.

They accept the same argument: an object which contains keys of sentences.

It is possible to replace only some sentences.

Keys

  • noFetchMethod: This is an error message which is displayed if some options are missing and fetchCallback is not defined. Default value is 'Fetch callback is missing: it is not possible to retrieve data.'.

  • searchPlaceholder: This is the message in the input placeholder to search for options. Default value is 'Search'.

  • searching: This is an information message displayed in options when it is not fetched yet.Default value is 'Searching'.

  • cannotSelectAllSearchedItems: This is an error message displayed if the action select all is triggered but all options are not fetched and allowRevert property is not set to true. Default value is 'Cannot select all items: too much items in the search result.'.

  • selectAll: The name of the action to select all options. Default value is 'Select all'.

  • excludeResult: The name of the action to invert the selection. Default value is 'Invert selection'.

  • reverseSelection: The title displayed on icon which means that selection is inverted. Default value is 'The displayed elements are those not selected.'.

  • noData: This is an information message when there are no options. Default value is 'No data'.

  • noResult: This is an information message when there are no options which match the search. Default value is 'No results'.

  • clearSelection: This is a message displayed in title of the icon to remove the selected option from the selection list. Default value is 'Clear current selection'.

  • clearSelections: This is a message displayed in title of the icon to remove all selected options from the selection list. Default value is 'Clear all selections'.

  • wrongFormattedData: This is an error message displayed when result from the fetchCallback is not in correct format. Default value is 'The data fetched is not correctly formatted.'.

  • moreSelectedItem: This is a message displayed in a badge if there are one selected option more than the size of the component. Default value is '+1 other'.

  • moreSelectedItems: This is a message displayed in a badge if there are more selected options than the size of the component. Default value is '+%d others'.

  • wrongQueryResult: This is an error message displayed when result from the fetchCallback don't return all expected values. Default value is 'Query did not return all results.'.

Example

// change texts for all selectic components
Selectic.changeTexts({
    noData: 'There are no options to select.',
    noResult: 'Sorry, your option is in another select.',
});

// change texts only for this instance
this.$refs.selectic.changeTexts({
    noResult: 'Sorry, search again.',
});
<Selectic
    :texts="{
        searchPlaceholder: 'Search for specific options?',
        searching: 'Loading information about this option',
        noData: 'ouch, I forgot to fill this select',
    }"
/>