I wanted to add a default value (All) in the dropdown list of typeahead apart from the suggested value that comes up in the dropdown list when the user types some text in the typeahead textfield.
Any help on this is greatly appreciated.
Thanks
If you're using the latest version of typeahead.js for Bootstrap 3, then you can add another dataset that always returns the default value you want:
$('input').typeahead(null,
//real dataset
{
name: 'real-data',
source: backend.ttAdapter() //Your current suggestions
},
//default dataset - will always be shown in dropdown
{
name: 'default-data',
source: function(query, callback) {
callback([{value: 'All'}]);
}
}
);
See this section of the docs for more information.
Related
I've got Prettier configured to format on save.
I'm using a Vue component I got from npm to display data from an API.
<ExampleComponent
:aDynamicProp="foo"
dataset="bar"
/>
The prop dataset is required by the component.
The issue is Prettier wants to change dataset to data-set every time I save. I imagine because it thinks i'm trying to create a HTML data attribute.
As per Prettier docs i've tried adding <!-- prettier-ignore-attribute --> above the component but this doesn't seem to work (perhaps because I'm triggering formatting on save, or because it's a Vue template and not HTML?).
Can anyone shed light as to how I can force Prettier to ignore the prop?
Many thanks!
Add colon : to :dataset and that should do the trick, if it's just static string that's doing inside dataset then do :dataset="`my string`" with backtick (`). If you are getting data from data(){}, computed or from methods as mentioned below then just do :dataset="yourData":
export default {
data() {
return {
yourData: 'Your String'
}
},
// or
computed: {
yourData() {
return 'Your String'
},
},
// or
methods: {
yourData() {
return 'Your String'
},
},
};
I am new to Ionic2, and I am trying to build dynamic tabs based on current menu selection. I am just wondering how can I get current page using navigation controller.
...
export class TabsPage {
constructor(navParams: NavParams,navCtrl:NavController) {
//here I want to get current page
}
}
...
From api documentation I feel getActiveChildNav() or getActive() will give me the current page, but I have no knowledge on ViewController/Nav.
Any help will be appreciated. Thanks in advance.
Full example:
import { NavController } from 'ionic-angular';
export class Page {
constructor(public navCtrl:NavController) {
}
(...)
getActivePage(): string {
return this.navCtrl.getActive().name;
}
}
Method to get current page name:
this.navCtrl.getActive().name
More details here
OMG! This Really Helped mate, Tons of Thanks! #Deivide
I have been stuck for 1 Month, Your answer saved me. :)
Thanks!
if(navCtrl.getActive().component === DashboardPage){
this.showAlert();
}
else
{
this.navCtrl.pop();
}
My team had to build a separate custom shared menu bar, that would be shared and displayed with most pages. From inside of this menu component.ts calling this.navCtrl.getActive().name returns the previous page name. We were able to get the current page name in this case using:
ngAfterViewInit() {
let currentPage = this.app.getActiveNav().getViews()[0].name;
console.log('current page is: ', currentPage);
}
this.navCtrl.getActive().name != TheComponent.name
or
this.navCtrl.getActive().component !== TheComponent
is also possible
navCtrl.getActive() seems to be buggy in certain circumstances, because it returns the wrong ViewController if .setRoot was just used or if .pop was just used, whereas navCtrl.getActive() seems to return the correct ViewController if .push was used.
Use the viewController emitted by the viewDidEnter Observable instead of using navCtrl.getActive() to get the correct active ViewController, like so:
navCtrl.viewDidEnter.subscribe(item=> {
const viewController = item as ViewController;
const n = viewController.name;
console.log('active page: ' + n);
});
I have tested this inside the viewDidEnter subscription, don't know about other lifecycle events ..
Old post. But this is how I get current page name both in dev and prod
this.appCtrl.getActiveNav().getActive().id
Instead of
...
...
//In debug mode alert value is 'HomePage'
//In production/ signed apk alert value is 'n'
alert(activeView.component.name);
if (activeView.component.name === 'HomePage') {
...
...
Use this
...
...
//In debug mode alert value is 'HomePage'
//In production/ signed apk alert value is 'HomePage'
alert(activeView.id);
if (activeView.id === 'HomePage') {
...
...
Source Link
You can use getActive to get active ViewController. The ViewController has component and its the instance of current view. The issue is the comparsion method. I've came up to solution with settings some field like id:string for all my Page components and then compare them. Unfortunately simple checking function name so getActive().component.name will break after minification.
Today i am facing one issue which has following requirement.
Date should be Editable.
Date should be in particular format.
My Code is like below which is not working.
foreach(var item in Model)
{
<div>#Editable(item, x => x.Start_Date.ToString("MMMM dd,yyyy"))</div>
}
I have tried following approach but throwing "DateParameters" namespace error.
#Editable(item, x=> x.Start_Date, new DateParameters { Format = "MMMM dd,yyyy"})
Also i have learner following thing but how can i achieve this ?
To make a field editable takes two parameters, this has been used to make the Date field editable. The first parameter instructs Glass.Mapper which field to make editable, the second parameter then specifies what the output should be when the page is not in page editing mode. This allows you to control the output of the field when in the two different modes.
Can anybody help me ?
For Experience editor mode, this works for me in razor view:
#Editable(model => model.SomeDateField, new { Format = "dd-MM-yyyy" })
Sitecore 8.2 though, with Glass 4.4.
What you want to do is to provide the default format but keep things the same for the main glass stuff. Like so:
foreach(var item in Model)
{
<div>#Editable(item, x => x.Start_Date, x=>x.Start_Date.ToString("MMMM dd,yyyy"))</div>
}
This will make the date a normal date when editing, but allow you to format it for the final page.
Usually in this case i use different code for "Normal View" and "Experience Editor", so for normal view you need only to display the date with format without making it editable, and on experience editor you need only to edit the date field the author will not care about the date format with experience editor, so your code will be like this :
foreach(var item in Model)
{
{
#if (Sitecore.Context.PageMode.IsExperienceEditorEditing)
{
<div>#Editable(item, x => x.Start_Date)</div>
}
else
{
<div>#item.Start_Date.ToString("MMMM dd,yyyy")</div>
}
}
}
I have tried that as well but it is throwing an error like below
**Value cannot be null. Parameter name: objectToSwitchTo
at Sitecore.Diagnostics.Assert.ArgumentNotNull(Object argument, String argumentName)
at Sitecore.Common.Switcher2.Enter(TValue objectToSwitchTo)
at Glass.Mapper.Sc.GlassHtml.MakeEditable[T](Expression1 field, Expression1 standardOutput, T model, Object parameters, Context context, Database database, TextWriter writer)**
Any help on this ?
I am using bootstrap datetimepicker. If I choose any date means, its automatically taking current time(Hours and minutes). How to set the default time in bootstrap datetimepicker. Here, I want to set the default time inside of the "changeDate" function. I am using the following code,
$('#datetimepicker'+rowIndx).datetimepicker({
format : "dd/MM/yyyy hh:mm",
pickSeconds:false,
}).on("show",function(e) {
$('#datetimepicker'+rowIndx).datetimepicker("setDate", "");
}).on('changeDate', function(e) {
});
Please explain me, how to set default "time" in "changeDate" function.
It could be done by the next code:
$('#datetimepicker'+rowIndx).data("DateTimePicker").setDate(new Date());
Check the working fiddle
I'm sure I'm missing something but I can't understand why a list that perfectly works in debug mode doesn't show in production.
Some details:
- the list is inside an Ext.navigation.View
- the list must show a filtered store by the itemtap event from another list
- the store reads from a remote json
- the build is for a web-app
this is the code I use to update the list:
listUpdate: function() {
console.log("sections_list update " + this.section);
section = this.section;
this.setStore(Ext.getStore('sections_remote'));
this.getStore().setFilters([function(item) {
return item.get('section')==section
}]);
this.getStore().load({
callback: function(records, operation, success) {
console.log("sections_list loaded "+records.length);
this.refresh();
},
scope: this
});
}
after loading, the records.length is always the total length and not the number of the filtered records but in debug version the list shows only the filtered records while in production shows nothing.
any ideas?
thanks in advance,
Daniele
I've just put all the semicolons and now it works.
Thank-you