Bootstrap-Timepicker only - html

I want to make a textbox withg time picker only
How to make that from this http://jsfiddle.net/RR4hw/11/
jQuery("#startDate").on("dp.change",function (e) {
jQuery('#endDate').data("DateTimePicker").setMinDate(e.date);
});
jQuery("#endDate").on("dp.change",function (e) {
jQuery('#startDate').data("DateTimePicker").setMaxDate(e.date);
});

$(".timeField").datetimepicker({
pickDate: false
});

Related

How do I change ok cancel option of bootbox to yes & no?

I want to change ok cancel option of bootbox to yes & no. I have tried my solutions but still show the default one. Here is my button.
<button class="btn btn-primary but-style-left" ng-click="saveForLaterClick(this)">{{ResourceData.Cancel}}</button>
This is my .js file code
$scope.saveForLaterClick = function (e) {
confirmClaimMessage($scope.ResourceData.RenewalProductAreYouSureWantToContinueText, function (e) {
if (e) {
window.open("#/Renewal", "_self");
}
});
}
function confirmClaimMessage(text, callback) {
bootbox.confirm(text, function (e) {
callback(e);
});
I am expecting this
bootbox.confirm({
message: $scope.ResourceData.RenewalProductAreYouSureWantToContinueText,
buttons: {
confirm: {
label: $scope.ResourceData.PoppupYesText
},
cancel: {
label: $scope.ResourceData.PoppupNoText
}
},
callback: function (e) {
if (e) {
window.open("#/Renewal", "_self");
}
}
});
Please help me!

How to add two methods on a #click event using vue.js?

This is my code and i basically want to add CHANGEBUTTONS to the on click event that looks like #click.
<button #click="enviarform2" value="Delete from favorites" style="font-weight: 700;color:#428bca;margin-left:30px;height:30px;border-radius:4px" name="delete" v-else>Delete from favorites</button>
<script>
new Vue({
el:'#app',
data:{
show: true,
paletteid : <?=$palette_id;?>,
action: "add",
action2: "delete",
number: ""
},
methods: {
enviarform: function() {
axios.post('/validarfavorite.php', {
paletteid: this.paletteid,
action: this.action
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
this.number = "Yours plus ";
},
enviarform2: function() {
axios.post('/validarfavorite.php', {
paletteid: this.paletteid,
action2: this.action2
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
this.number = "Minus yours plus ";
},
changebuttons: function() {
this.show = !this.show;
}
}
});
</script>
I have tried with method 1 and method 2 and handler but it didnt work. Hope you know!
You can separate the calls using a ; (or the comma operator):
<button #click="#click="m1(); m2()">my button</button>
<button #click="#click="m1(), m2()">my button</button>
But if your code is used in more than one place, though, the best practice (the "cleanest approach") is to create a third method and use it instead:
<button #click="mOneAndTwo">my button</button>
Demo:
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
methods: {
m1: function() { this.message += "m1"; },
m2: function() { this.message += "m2"; },
mOneAndTwo: function() {
/* call two methods. */
this.m1();
this.m2();
}
}
})
<script src="https://unpkg.com/vue"></script>
<div id="app">
<p>{{ message }}</p>
<button #click="m1(); m2()">call two methods using ;</button><br>
<button #click="m1(), m2()">call two methods using ,</button><br>
<button #click="mOneAndTwo">call two methods using a third method</button><br>
</div>
The easiest way to do it is:
<button v-on:click="method1(); method2();">Continue</button>
Cant you simply call the methods inside the functions?

AngularJs - My ui-sref anchor tag can't be cancelled by event.preventDefault()

I have this tag:
<a ui-sref="MyModule">My Module</a>
When I click on the link, this will be executed:
$scope.$on("$locationChangeStart", function (event) {
if (!confirm('You have unsaved changes, continue?')) {
event.preventDefault();
}
});
But still my view will switch to MyModule interface.
try using this:-
$scope.$on("$stateChangeStart", function (event) {
if (!confirm('You have unsaved changes, continue?')) {
event.preventDefault();
}
});
You are using UI-router. which is state based.

extjs twinText focus when click on trigger

I have a TextFiled component, where add clear trigger. like this one:
this.config.triggers = {
clear: {
cls : (Ext.baseCSSPrefix + 'form-clear-trigger'),
handler : function() {
this.setValue();
}
}
}
...
So, and I handle an event focus
this.text= Ext.create('TwinText', {
width: 400,
emptyText: 'dddd',
listeners: {
scope: this,
focus: this.show,
},
editable : false
});
Now, when I click on trigger clean, the focus event was fired. How can I suspend this?
You can add the click event to your Textfield component instead of using focus.
Ex. in the TwinText definition add:
initEvents: function () {
this.callParent(arguments);
this.mon(this.inputEl, 'click', this.onClick, this);
},
onClick: function (e) {
this.fireEvent('click', this, e);
}
then listen for the "click" event instead of "focus".

Stacking a modal over another modal using angularJS on clicking the backdrop

I am trying to make a modal appear on top of another modal (like a stack of modals) automatically when the user clicks on the backdrop of a modal or presses the escape button (in this case a dialog box to ask whether you want to progress further).
The problem is that I am not able to figure out how I can call the event's preventDefault() function as I feel that it is the solution to my problem. Currently, what happens is that on clicking the backdrop, the current modal vanishes and the second modal takes it's place instead of appearing above the current modal, putting it in the backdrop.
Here is my code snippet :
The beginning -
(function () {
'use strict';
angular
.module('controller.main', [])
.controller('Main', ['$location', '$state', '$uibModal', 'user', 'auth', 'model', function ($location, $state, $uibModal, user, auth, model) {
var vm = this;
The code in question that is supposed to do the expected task -
vm.openConfirmCancelDB = function (size)
{
$uibModal.open({
animation: vm.animationsEnabled,
templateUrl: '/views/confirmCancelProcessModal.html',
controller: 'Cancel',
controllerAs: 'cancel',
size: size,
backdrop: 'static',
resolve: {}
});
};
vm.openLogin = function (size)
{
var OLP = $uibModal.open(
{
animation: vm.animationsEnabled,
templateUrl: '/views/login.html',
controller: 'Modal',
controllerAs: 'modal',
size: size,
//backdrop: 'static',
resolve: {
inUser: function () {
var user = {};
return user;
}
}
});
OLP.result.then(function()
{
//event.preventDefault();
},
function ()
{
vm.openConfirmCancelDB('sm');
});
};
vm.register = function (size)
{
console.log(vm.registerform);
var RP = $uibModal.open(
{
animation: vm.animationsEnabled,
templateUrl: '/views/register.html',
controller: 'Registration',
controllerAs: 'modal',
//backdrop: 'static',
size: size,
resolve: {
inUser: function () {
var user = {
email: vm.email,
password: vm.password
};
return user;
}
}
});
RP.result.then(function()
{
//event.preventDefault();
},
function ()
{
vm.openConfirmCancelDB('sm');
});
};
openConfirmCancelDB() is the function that helps in opening the dialog box. The problem is how I can call preventDefault() function in order to get the current modal to stay in the backdrop while the dialog box appears on top of this modal. How can I go about accessing the event and its preventDefault function? Also, any other method that can help solve my problem is also fine with me.