I need to know how to check a ui-slider is disabled or not.
I have tried with
$('#slider_price').is(":disabled")
But i always get "false" even if the slider is disabled or enabled.
Please help me and thanks in adavance
u can try like this
$( "#slider_price" ).slider( "enable" );
or
var isDisabled = $( "#slider_price" ).slider( "option", "disabled" );
Related
I am having a problem with my fancybox 3 and jquery ui datepicker.
if I place the datepicker outside the fancybox.. the dropdown for months and years are working.. but when I place it inside fancybox. the dropdown is not being triggered. any idea what is happening?
$("#Date_To").datepicker({changeMonth: true,changeYear: true});
image
Try disabling focusing, something like this:
$('[data-fancybox]').fancybox({
autoFocus : false,
trapFocus : false,
touch : false,
beforeClose : function() {
$( ".selector" ).datepicker( "hide" );
}
});
Demo - https://codepen.io/fancyapps/pen/QqLXaz
I tried using modal and found a solution. is there any way I can covert this code for fancybox?
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;
$.fn.modal.Constructor.prototype.enforceFocus = function() {};
$confModal.on('hidden', function() {
$.fn.modal.Constructor.prototype.enfor
I am using ember liquid-teather - http://pzuraq.github.io/liquid-tether/#/examples?a=animation-with-context
The code I have used is from the example under 'Animation With Context'.
The modal works, but there is no nice transitions as am getting an error in the console re the transitions.js file.
See my transitions code below:
export default function(){
this.transition(
target('modal-dialog'),
this.toValue(({ index: newIndex }, { index: oldIndex }) => newIndex > oldIndex),
this.use('tether', ['to-left', options]),
this.reverse('tether', ['to-right', options])
);
this.transition(
target('modal-dialog'),
this.toValue(({ index }) => index === 1),
this.use('tether', 'fade', 'fade')
);
this.transition(
target('modal-dialog'),
this.toValue(({ index }) => !index),
this.use('tether', 'fade', 'fade')
);
}
The error is: target not defined.
How do I define target?
Thank you in advance! :-)
You can check here what values are allowed for options.
http://tether.io/
Search under options :).
scratch that! I have solved my own question. I just needed to declare this at the top of the transitions.js file.
import { target } from 'liquid-tether';
But now the issue I am getting is 'options not define'. ...Any ideas anyone?
options not defined refers to the options you are passing to your animation. It is not very clear from the docs but it is expecting an options hash here. For example:
this.use('tether', ['to-left', {duration: 500}]),
Check the liquid fire site for all the options available for animations
I know I am new to the .net world, so there are limitations to what I know and understand. I am using Sitecore, and Sitecore generates the .aspx pages behind the scenes, so I have no access to the source, what I do have access to is the .ascx which is the sublayout ... so i tried to put some javascript onto the layout ... and I read that I am allowed to this with tags, but when I run the program now, it is not firing. Anything I am missing, please advise. Thank you for your assistance.
<!-- Custom Feedback Code -->
<script type="text/javascript">
function showModal() {
var url = document.URL;
var popUp = 'http://local.meau.com/components/supportcenter/feedback.aspx?value=';
var site = popUp + url;
var runpopUp = 50;
if (runpopUp >= Math.random() * 100) {
$(document).ready(function () {
$.fancybox({
'width': 500,
'height': '55%',
'autoScale': false,
'transitionIn': 'none',
'transitionOut': 'none',
'type': 'iframe',
'href': site,
'showCloseButton': false,
'title': 'We Request your Feedback'
});
});
}
}
</script>
<!-- End of Custom Feedback Code -->
I would suggest to start by removing (commenting out) the randomization logic - to make sure that your code is working deterministically first. Next, what is done in your code - the anonymous function is added as $(document).ready event handler inside showModal function. Unless you call showModal before $(document).ready fires, your handler will never be executed. Therefore, #Maras's suggestion should work, assuming, of course, that jquery javascript is loaded into the page.
I am facing one problem that Datepicker is not working properly first time, i.e. first time when i open the page and click on "from"/"to" input field, the datepicker opens but I cannot select a date as I get an error on console: "Uncaught Missing instance data for this datepicker". But when I refresh page, it perfectly works!
Why does this happens?
This is my code:
$('.datepicker').live('focus',function(){
$(this).datepicker({
defaultDate : "+1w",
changeMonth : true,
numberOfMonth : 1,
dateFormat: 'dd-mm-yy'
});
});
can you tell is it right to use '.live' method here?
i guess you are doing this
$("#datepicker").click(function(){
$(this).datepicker({ dateFormat: 'yy-mm-dd' }).val();
});
May be only this will work as it did for me
$(function() {
$("#datepicker").datepicker({ dateFormat: 'yy-mm-dd' }).val();
});
If its for multiple inputs just make use of class name instead of id.
$('.datepicker').on('focus',function(){
$(this).datepicker({
defaultDate : "+1w",
changeMonth : true,
numberOfMonth : 1,
dateFormat: 'dd-mm-yy'
});
});
Try this
for it to show first time you can do this inside on click:
$("#datepicker").datepicker().datepicker( "show" )
You can try this
$('body').on('focus',".datepicker", function(){
$(this).datepicker();
});
I'm a newbie to all the Sencha Touch stuff, but until now I'm very enthousiastic about it's capabilities. There is one problem, i somehow can't solve.
I would like to use a Tpl (XTemplate) for a calender view. The idea is to create a div element for every appointment, which i can place within containers to layout them. Somehow i can't get the dataview to work.
I've stripped down my code to the bare minimum: a panel containing a DataView. When i use the itemTpl, everything works fine. But when I use the tpl (with or without the XTemplate) i don't see anything. I checked if it was just a display malfunction (searched for the XXX from the template), but that's not the case.
This is my code:
Ext.define('InfoApp.view.CalendarDay', {
extend: 'Ext.Panel',
xtype: 'calendarday',
requires: [ 'InfoApp.store.sAppointments'],
config: {
title: 'Dag',
layout: 'fit',
items: [
{
xtype: 'dataview',
store: 'appointmentStore',
//itemTpl: [ 'XXX {day} {course}' ] --> Works
tpl: new Ext.XTemplate('<tpl for=".">XXX {day} {course}</tpl>')--> Doesn't Work...
}
]
}
});
Thanks in advance for any suggestions or improvements!
Assuming ST2 and not ST1
From http://docs.sencha.com/touch/2-0/#!/api/Ext.Component-cfg-tpl and the comments on the tpl: config in the docs, it appears there's a bug when using a remote store. Even if your store has data it. tpl: apparently only works right now if your data is hardcoded in data:[]
you can use itemTpl: new XTemplate(), or itemTpl: XTemplate.from('someid') or you can defer specifying until afterwards, grab your dataview and go dv.setItemTpl(new XTemplate()), etc.
Tanks #brink for your answer.
It took me a couple of days, but this worked for me:
// Load the store
var store = Ext.getStore('appointmentStore');
// Get the current range of the store
var data = store.getRange();
// Create a custom template
var tpl = new Ext.XTemplate(<tpl for=".">{day} {course}</tpl>);
// Loop through the data array
var showData = array();
for(var i=0;i<data.length;i++){
showData.push(data[i].data);
}
// Get the panel by ID and push the html template
var panel = Ext.getCmp('appointmentspanel');
panel.updateHtml(tpl.applyTemplate(showData));