wickedpicker
wickedpicker copied to clipboard
ericjgagnon
Title option not working with multiple time pickers
Example of issue here: http://codepen.io/wrburgess/pen/QEVPzk
Problem: Two wickedpickers are on a page. Options for timepicker1 has a custom title. Options for timepicker2 has a custom title.
The custom title for timepicker1 is rendering on both timepickers.
Expected behavior: Custom titles for timepicker1 and timepicker2 should be rendering their custom titles via respective options.
Am I setting this up wrong or is this a bug?
cheap and dirty fix, unknown side effects:
showPicker: function (element) {
$('.wickedpicker__title').contents().first().replaceWith(this.options.title);
...
}
Yeah the issue is that the timepicker itself is shared across inputs that initialize a wickedpicker. I didn't want a ton of pickers on the page if there were many instances. I'll definitely look into a solution for this, but thanks for dropping a quick workaround.
I completely agree with your approach for that very reason. Having the configuration attach a custom title to the "multiple" pickers isn't that hard with my little patch, but I'm not sure if it's the approach you'd want to take.
Hello, after looking around at different timepickers, I found that I liked the simplicity of yours and how easy it plugged into my page, once I put all of the pieces in the right places - something your readme should make clearer. However, I quickly discovered the issue where multiple timepickers all showed the same title, and almost had to abandon your plug-in. Fortunately, I found this thread and, while using wrburgess' suggested fix didn't work for me, I did find an alternate work around, which I've shown below.
<body>
...
<input type="text" id="timepicker-1" class="timepicker" tabindex="1" />
<input type="text" id="timepicker-2" class="timepicker" tabindex="2" />
<input type="text" id="timepicker-3" class="timepicker" tabindex="3" />
...
<script>
$( '#timepicker-1' ).wickedpicker( { now : "13:00", title : 'Timepicker-1', show : showPicker } );
$( '#timepicker-2' ).wickedpicker( { now : "14:00", title : 'Timepicker-2', show : showPicker } );
$( '#timepicker-3' ).wickedpicker( { now : "15:00", title : 'Timepicker-3', show : showPicker } );
function showPicker( element ) {
$( '.wickedpicker__title' ).contents().first().replaceWith( ( ( this.options !== undefined )
? this.options.title
: this.title ) );
}
</script>
...
</body>
I suspect that the reason that wrburgress' solution didn't work for me might have to do with the way that I'm initializing the options, but in my case I got errors when I tried to create the options as a separate variable object, but nesting the unnamed options object right in the wickedpicker definition worked and implicitly keeps the three timepickers distinct.
Thanks for sticking with my plugin! I haven't released 1.0.0 because I know there are a few issues with it. I appreciate that you put your solution here and I will try to get this issue resolved over the weekend.
Thank you for the reply. I look forward to future developments with your Wickedpicker.Howard Brown-----Original Message-----
From: Eric Gagnon Sent: Aug 26, 2016 3:44 PM To: ericjgagnon/wickedpicker Cc: howardb3115 , Comment Subject: Re: [ericjgagnon/wickedpicker] Title option not working with multiple time pickers (#21)
Thanks for sticking with my plugin! I haven't released 1.0.0 because I know there are a few issues with it. I appreciate that you put your solution here and I will try to get this issue resolved over the weekend.
—You are receiving this because you commented.Reply to this email directly, view it on GitHub, or mute the thread.
{"api_version":"1.0","publisher":{"api_key":"05dde50f1d1a384dd78767c55493e4bb","name":"GitHub"},"entity":{"external_key":"github/ericjgagnon/wickedpicker","title":"ericjgagnon/wickedpicker","subtitle":"GitHub repository","main_image_url":"https://cloud.githubusercontent.com/assets/143418/17495839/a5054eac-5d88-11e6-95fc-7290892c7bb5.png","avatar_image_url":"https://cloud.githubusercontent.com/assets/143418/15842166/7c72db34-2c0b-11e6-9aed-b52498112777.png","action":{"name":"Open in GitHub","url":"https://github.com/ericjgagnon/wickedpicker"}},"updates":{"snippets":[{"icon":"PERSON","message":"@ericjgagnon in #21: Thanks for sticking with my plugin! I haven't released 1.0.0 because I know there are a few issues with it. I appreciate that you put your solution here and I will try to get this issue resolved over the weekend."}],"action":{"name":"View Issue","url":"https://github.com/ericjgagnon/wickedpicker/issues/21#issuecomment-242869400"}}}Work Phone: 858-304-8100Home Phone: 858-487-3115Cell Phone: 858-472-3115Hungry Genius URL: www.hungrygenius.comWork Email: [email protected] (coming soon!)Home Email: [email protected]
There is no reason to specify any {option} block and pass it to the wickedpicker element if the initial option list is being considered global. it should be default unless specific option is not passed privately.
