I have ASP.NET application where we use AngularJS. The issue is when we click "edit" the new view is openinig in the same window (tab). How to open it in new window (tab)? Here's the code:
List.html:
<td><a ng-click="editUser(u.ID)">edit</a></td>
AngularJS:
AdminUsersApp.controller("ListController", function ($scope, $location, $http, ErrorUI, Users, Cashdesks) {
...
$scope.editUser = function (id) {
$location.path("/edit/" + id);
};
$location.path just returns the path of current page. instead you need the url which actually points to a different location, so when you call window s open function it should have window.open('example.com/admin/Admin_Users.aspx#/edit/id'). If you want to build the url dynamically use $location.host(), $location.protocol() etc to build a url and then append /edit/id at the end
this work for me
$window.open(url);
Related
I replicated all of the code used in the AspNetZero solution for the "profile picture" functionality. I'm referring to the function that allows the user to upload their own photo.
I have copied the existing modal, JS file and controller methods into my employee controller and employee folders respectively, as I wanted the same functionality.
The upload of the image and saving into the binary objects table is all working just fine.
The issue comes up when I try to display the thumbnail of the uploaded photo in my employee index view datatable column. I copied this functionality from the user index view in the solution.
When my employee index view is rendered the thumbnail does not appear. When I click on the image thumbnail it opens the new tab and throws a 404 error for my copied controller method.
Here is the JS code that displays the thumbnail image in the users index view:
targets: 1,
data: "userName",
render: function (userName, type, row, meta) {
var $container = $("<span/>");
if (row.profilePictureId) {
var profilePictureUrl = "/Profile/GetProfilePicture?t=" + row.profilePictureId;
var $link = $("<a/>").attr("href", profilePictureUrl).attr("target", "_blank");
var $img = $("<img/>")
.addClass("img-circle")
.attr("src", profilePictureUrl);
$link.append($img);
$container.append($link);
}
$container.append(userName);
return $container[0].outerHTML;
}
Here is the same code in my employee index view:
targets: 4,
orderable: true,
autoWidth: true,
data: "fullName",
render: function(fullName, type, row, meta) {
var $container = $("<span/>");
if (row.employeePictureId) {
var profilePictureUrl = "/Employee/GetProfilePictureById?id=" + row.employeePictureId;
var $link = $("<a/>").attr("href", profilePictureUrl).attr("target", "_blank");
var $img = $("<img/>").addClass("img-circle").attr("src", profilePictureUrl);
$link.append($img);
$container.append($link);
}
$container.append(fullName);
return $container[0].outerHTML;
}
The line of code that does not work is the ProfilePictureUrl line.
var profilePictureUrl = "/Employee/GetProfilePictureById?id=" + row.employeePictureId;
If I replace the above line with the line from the user index.js and call the profile controller method, it works just fine. But when I try to call my employee controller method it keeps throwing the 404 error.
My employee controller is at the same level in my solution as the profile controller. Both controller are part of the same area in my MVC app.
I just solved my issue. There is another profile controller which sits outside of the area folder. So the URL used in the users index.js does not need to mention the full path.
The users photo function is hitting the profile controller at the root level of the app and not the one inside of the area.
In my case I had to treat the URL just like I do with all the modals and scripts that are in my area.
Here is the solution that worked.
var empPhotoUrl = abp.appPath + 'AreaName/Employee/GetProfilePictureById?id=';
I am currently using this script to warn the user they are leaving the current webiste when clicking on an external link on a WordPress website:
<script>
jQuery(function() {
function leave_now(event) {
var choice = window.confirm( 'Leave page?' );
return choice;
}
var select_external = 'a[href*="//"]:not([href*="yourdomain.com"])';
jQuery(document).on( 'click', select_external, leave_now )
});
</script>
It works great, but I actually need to modify this so it takes them to a warning PAGE instead of having a popup window appear. After the warning page is loaded, it waits 5 seconds, then loads the URL that was clicked on.
Any suggestions would be appreciated.
Set the location.href which will navigate you to the url you specify
location.href='http://www.your-url.com'
So, on click, you could have that function run and set that location instead of do a warning
anyone using framework7 to create mobile website? I found it was great and tried to learn it by myself, now I meet this problem, after I create my App, I want to do something on the starter page initialization, here, my starter page is index.html, and I set data-page="index", now I write this below:
$$(document).on('pageInit', function (e) {
var page = e.detail.page;
// in my browser console, no "index page" logged
if (page.name === 'index') {
console.log("index page");
});
// but I changed to any other page other than index, it works
// my browser logged "another page"
if(page.name === 'login') {
console.log('another page');
}
});
Anyone can help? Thank you so much.
I have also encountered with the same problem before.
PageInit event doesn't work for initial page, only for pages that you navigate to, it will only work for index page if you navigate to some other page and then go back to index page.
So I see two options here:
Just not use pageInit event for index page - make its initialization just once (just make sure you put this javascript after all its html is ready, or e.g. use jquery's on document ready event)
Leave index page empty initially and load it dynamically via Framework7's mainView.loadContent method, then pageInit event would work for it (that was a good option for me as I had different index page each time, and I already loaded all other pages dynamically from underscore templates)
I am facing same issue and tried all solutions in various forums.. nothing actually worked. But after lot of RnD i stumbled upon following solution ...
var $$ = Dom7;
$$(document).on('page:init', function (e) {
if(e.detail.page.name === "index"){
//do whatever.. remember "page" is now e.detail.page..
$$(e.detail.page.container).find('#latest').html("my html here..");
}
});
var me = new Framework7({material: true});
var mainview = me.addView('.view-main', {});
.... and whatever else JS here..
this works perfectly..
surprisingly you can use "me" before initializing it..
for using for first page u better use document ready event. and for reloading page event you better use Reinit event.
if jquery has used.
$(document).on('ready', function (e) {
// ... mainView.activePage.name = "index"
});
$(document).on('pageReinit', function (e) {
//... this event occur on reloading anypage.
});
I have a partial page that shows a list of files on the server. I want to allow the user to choose a file and display it in a lightbox dialog using AngularUI. I can't figure out how to get the filename that should be displayed into the dialog template correctly. Here's my file list html:
<tr ng-repeat="file in files | orderBy:orderProp">
<td>{{file.name}}</td>
</tr>
And here's the applicable part of that view's controller:
function FileListCtrl($scope, $http, $dialog)
{
.
.
.
$scope.openInLightbox = function(item){
var d = $dialog.dialog({
modalFade: false,
resolve: {item: function(){ return angular.copy(item); } }});
d.open('dialogs/lightboxTemplate.html', 'LightboxController');
}
}
and here's the lightboxController:
app.controller('LightboxController', ['$scope', 'dialog', 'item', function($scope, dialog, item){
$scope.item = item;
console.log("item:" + item);
$scope.submit = function(){
dialog.close('ok');
};
}]);
and here's my dialog template:
<img src={{item}} />
I have two things I don't understand:
1) I get a lightbox on the first image I choose correctly, but the console gives a 404 error getting "(URL path to image)/{{item}}". So I get an error, but the image still appears.
2) When I click outside the lightbox, it disappears and I can't reload a new image. I think this is due to having no close button?
Am I properly binding the "item" scope property into the dialog template? If not, what is the correct way?
Try using ng-src for example:
<img ng-src="{{item}}>
It will likely overcome the weirdness as /> is still valid html (just not html 5)
I have an ASP.NET app (it uses DevExpress v 10.2). There is a button called PRINT on a page. When the button is clicked the application should:
1. extract a file from its DB. The file is either PDF or JPEG (the application knows its type in runtime only)
2. TO PRINT OUT the file. Some ‘preview’ should be shown to user during this
The question is – how to implement this (the item ‘2’)? There is a well-known method to print out an image using JavaScript like the following:
function DisplayPrintPopup(html) {
var win = window.open('', 'popup', 'toolbar=no,menubar=no,width=500,height=500,scrollbars=yes');
self.focus();
win.document.open();
win.document.write('<head><style></style></head><body>' + html + '<style></style></head><body>');
win.document.close();
win.print();
win.close();
}
This could be Ok for me. But what to do when a file is PDF?
This just print an element from you page where strid=id of the element you want to print,
before the print is possible to view a preview:
function CallPrint(strid) {
var prtContent = document.getElementById(strid);
var WinPrint = window.open('', '', 'letf=0,top=0,width=800,height=600,toolbar=0,scrollbars=0,status=0');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();
}
http://forums.asp.net/t/1034884.aspx/1