Copy to the Clipboard in Lightning Component - salesforce

I'm creating Lightning Component that displays Classic version of the Current URL record page with a button that onclick copy to the clipboard that URL.
Just a simple functionality that saves time for Lightning Users, when they need to send a URL of the record to non-Lightning users.
Cmp:
<lightning:button class="slds-align_right slds-button slds-button_neutral" iconName="utility:copy_to_clipboard" variant="border-filled" label="Copy" onclick="{! c.copyClassic }"/>
<textarea readonly="true" id="urlClassic">https://name.my.salesforce.com/{!v.recordId}</textarea>
Controller:
({
copyClassic : function(cmp, event){
var urlClassic = document.getElementById('urlClassic');
urlClassic.select();
document.queryCommandSupported('copy');
document.execCommand('copy');
var source = event.getSource();
source.set('v.label', 'COPIED!');
setTimeout(function(){
source.set('v.label', 'Copy');
}, 2000);
} })
It is working on first copied page, but if I open in the same window new record, Textarea displays new URL (with the new record page) and button changed to 'COPIED!' but it's not selecting and copying new URL.
Does anyone has similar issue or idea to solve this problem?

Related

saveurl on createrecordevent or navigationlocation in lightning component

I have a similar code as below.
createRecord : function (component) {
var createRecordEvent = $A.get("e.force:createRecord");
createRecordEvent.setParams({
"entityApiName": "Case",
"panelOnDestroyCallback": function(event) {
$A.get("e.force:navigateToSObject").setParams({
recordId: component.get("v.recordId"),
slideDevName: "detail"
}).fire();
}
});
createRecordEvent.fire();
}
It does not redirect to the record id i have provided and this code is not even calling the function inside "panelOnDestroyCallback".
I have also tried "navigationLocation": "LOOKUP" and I do know RELATED_LIST opens the same page i have called the createrecordevent.
I have also tried url redirect too inside that "panelOnDestroyCallback".
panelOnDestroyCallback is not even getting called in the code.
My intention is to send the page to account record detail page after it saved the case record which was opened from createrecordevent??
e.force:createRecord will automatically redirect you to the new record after creation. No need to define a custom callback for that.
<aura:component implements="flexipage:availableForAllPageTypes">
<lightning:button label="Create Case" variant="brand" onclick="{!c.createRecord}"/>
</aura:component>
({
createRecord : function (component, event, helper) {
var createRecordEvent = $A.get("e.force:createRecord");
createRecordEvent.setParams({
"entityApiName": "Case"
});
createRecordEvent.fire();
}
})

get all dialogs in page in AEM

Is there any direct way to get dialog object of all components which are dragged on page.
For ex: when we load page and if there is any component like text, image are on page, I can get dialog. Please suggest?
Yes, it is possible. Attach a listener which listens to the editablesready event fired by WCM. Get all the editables on the page using the #getEditables() method of CQ.WCM and then get the dialog of each editable if it is present.
Sample code below.
CQ.WCM.on('editablesready', function() {
var editables = CQ.WCM.getEditables();
for(var path in editables) {
var editable = editables[path];
try {
console.log(editable.getEditDialog());
//Do stuff
} catch(e) { }
}
});

On click opens a new tab I need to interact with, however I just stay on the same window

I am new to protractor and AngularJS just starting to get the hang of it. I have a login page that on click opens a new browser tab. The new browser tab is where I want to continue my test however I do not know how to do switch to the new browser tab.
I've tried the below code that was suggested here however it didn't do anything just stayed on the page.
element(by.css('span.icon.icon-add')).click();.then(function() {
browser.getAllWindowHandles().then(function(handles) {
newWindowHandle = handles[1]; // this is your new window
browser.switchTo().window(newWindowHandle).then(function() {
element.all(by.css("input[type$='text']")).first().clear().sendKeys('anemailaddy#newmarketinc.com');
});
});
});
Any help would be fantastic! Thank you
changed code to look like this:
this.clicksAddUser = function() {
element(by.css('span.booking-icon.icon-gear')).click();
element.all(by.css('li:nth-of-type(4) > a')).click().then(function() {
browser.getAllWindowHandles().then(function(handles) {
newWindowHandle = handles[1]; // this is your new window
browser.switchTo().window(newWindowHandle).then(function() {
element(by.css('span.icon.icon-add')).click()
element.all(by.css("input[type$='text']")).first().clear().sendKeys('anemailaddy#newmarketinc.com');
});
});
});
Because I was clicking a drop down menu in a separate this statement the drop down menu was closing before there was a chance to click on the login button. combined the code fixed the problem.

angular-ui/ui-calendar change event source after render in Angular JS

I am trying to use angular-ui/ui-calendar( FullCalendar ) in my Angular Js app.
I have select box which lists some items, based on the selcted item, my event source url need to be updated. So in controller, I do update it, but the calendar is still not using the updated URL and also I need the calendar to refresh/Render, once the source is changed.
As per this link need to some remove and add event source.
I am new to both Jquery and Angular so I would appreciate if any one can explain how I can do it in angular js.
some bits of my controller where i set the url source , but I think it is not the right way to do , and it is also not working.
$scope.locationId = 0
$scope.url = "./api/ev/event/calendarByLocationId?locationId=" + $scope.locationId;
$scope.eventSource = {
url : $scope.url
};
$scope.setURL = function(locationId) {
$scope.locationId = locationId
$scope.url = "./api/ev/event/calendarByLocationId?locationId=" + $scope.locationId;
$scope.eventSource = {
url : $scope.url
};
$scope.eventSources = [ $scope.eventSource ];
}
Without using refetchEvents, below code works for me. Once the new event source is added, Calendar automatically fetching the new data from new source.
// This function is called to change the event source. When
// ever user selects some source in the UI
$scope.setEventSource = function(locationId) {
// remove the event source.
uiCalendarConfig.calendars['myCalendar'].fullCalendar('removeEventSource', $scope.eventSource);
// Create the new event source url
$scope.eventSource = {url : "./api/ev/event/calendarByLocationId?locationId=" + locationId};
// add the new event source.
uiCalendarConfig.calendars['myCalendar'].fullCalendar('addEventSource', $scope.eventSource);
}
I am figuring out on adding and removing events sources as well. There seems to be a problem.
But as temporarily, what I had was a REST url. Once updated, the data is updated. By then I made the program to refresh the event on the same url by triggerring this. This enables the url to be refreshed and grabbed from database again.
$scope.myCalendar.fullCalendar( 'refetchEvents' );
Which your HTML code should look like this:
<div class="calendar" ng-model="eventSources" calendar="myCalendar" config="uiConfig.calendar" ui-calendar="uiConfig.calendar"></div>
Hope this helps.

EXTJS Mouse click not working after load a page for multi time

I have a grid on my panel, named gridView, and gridView is in panel named panelMain, by dbclick listener on grid row, I load a from by doing something like this:
listeners:{
itemdblclick: function(dataview, index, item, e) {
/* I did not create new studentForm every time.*/
var editStudent = Ext.getCmp('editStudent');
if(editStudent == undefined)
editStudent = Ext.create('H.view.EditStudent');
editStudent.getForm().load({
url: 'studentDetails.php',
params: {studentId: studentId},
method:'GET',
success: function (form, action) {
var panelMain = Ext.getCmp('panelMain');
panelMain.items.clear();
panelMain.add(editStudent);
panelMain.update();
panelMain.doLayout();
},
failure: function (form, action) {
/// do nothing
}
});
}
After I edited the student I should come back to grid page, so I do something like this:
var panelMain = Ext.getCmp('panelMain');
var gridView = Ext.getCmp('gridView');
panelMain.items.clear();
panelMain.add(gridView);
panelMain.update();
panelMain.doLayout();
The problem is when I come back to the grid, it does not fire any itemdbclick event any more (it's like the grid is just an image in page, no event fires).
And sometimes when I go to edit studentForm and come back grid work, but when I go to student form again, the student page does not fire any event, when I click edit button, I do not get any answer, I cant see even on mouse hover (that causes changes on button color).
What is the problem here?
I use Extjs 4 and Extjs MVC.
I have one Controller for grid and edit student page.
I think your misunderstand the success config on form.
Try:
listeners:{
itemdblclick: function ( gridView, record, item, index, e, eOpts ) {
var editStudent = Ext.getCmp('editStudent');
if(editStudent == undefined)
editStudent = Ext.create('H.view.EditStudent');
/* Load record in the form.
Form must have on formfields property: 'name' equals to 'dataIndex' */
editStudent.getForm().loadRecord(record);
var panelMain = Ext.getCmp('panelMain');
panelMain.items.clear();
panelMain.add(editStudent);
}
success and failure are the callbacks functions for the submit function.
a) You are not using MVC pattern here. With what Sencha calls MVC, you would have all this code in a Controller instead of event listener.
b) I strongly suspect that this code causes deadlocks somewhere, with events firing so rapidly in succession that browser just freezes. You need to use debugger to see what exactly happens.

Resources