What is target="_new"? Validator is raising an error..
How do you do this with jquery because Validator is raising an error.
On the same page, I have target="_new" and target="_blank". target="_new" is in that form code which i received from email newsletter company.
I'm using this for target="_blank"
$(function() {
$('a[href^=http]').click( function() {
window.open(this.href);
return false;
});
});
What should i do for target="_new"
Update: 1 min Ago
upon clicking on submit button i want to open a page in new window to pass validation how to do this in jquery as i'm doing for other external link.
update:
this is code
<form method="post" class="form-wrapper" action="http://sitename.com/form.php">
There is no such thing as target="_new". Using this will simply open the link in a new window called "_new". You might notice that clicking on a link with target="_new" will open a new window (or tab) but then a second link will open in the same window (or tab), rather than opening a second one as you'd probably expect.
Personally, I don't think you should be specifying target="_blank" at all - let the user choose.
target="_blank" is invalid in XHTML (actually, the entire target attribute is invalid). If you want a link to open in a new window (usually a bad idea, in my opinion) and validation is important to you, the only way to do it is with javascript (like you did).
This is an attribute for a(anchor) tag, which let you open the page on the same window or in a new window.
Related
I have a cypress test that on clicking a button the system redirects to a new window.
I've tried some solutions (invoke,stub) without success.
I need to do some testing but I need it to always be redirected on the same screen as cypress doesn't support multiple windows.
My button code:
<button id="cmdEnviar" name="cmdEnviar" type="button" onclick="TrPage._autoSubmit('_id5','cmdEnviar',event,1);return false;" class="x7j">Enviar</button>
My code:
it('register new user', function() {
cy.visit('/')
cy.get('#txtLogin').type(Cypress.env('login'))
cy.get('#txtSenha').type(Cypress.env('pass'))
cy.get('#btnEnviar').click()
cy.get('#cmbSistemas').select(11)
cy.get('#cmdEnviar').click() //here is the button
//here is redirected to another window
cy.contains('Colaborador').click()
cy.contains('Cadastro').click()
})
Could anyone help me, if there is any solution?
Unfortunately, without seeing what your onclick event actually does, I can't recommend a strategy for validating the behavior of onclick is functioning as intended.
Instead, we can validate that the button has the correct onclick attribute value.
...
cy.get('#cmdEnviar')
.should('have.attr', 'onclick', "TrPage._autoSubmit('_id5','cmdEnviar',event,1);return false;");
...
I'm working on a web application which is a traditional aspx (asp.net) web forms app but has had some angular 6 apps incorporated into it.
I've been tasked with fixing a bug that causes the browser to refresh when clicking on an anchor element with a href="#".
I'm not sure what's causing the whole page to reload.
Strangely when I open dev tools in Chrome, choose the network tab and select disable cache the page only refreshes the first time I click a link and any other subsequent clicks work fine. This might be to do with the fact that after the first time I click it the browser url now contains the # at the end of it.
I know this seems a bit random but I wondered whether anyone had any theories on what may cause the reload in the first place.
It's hard to tell what could be causing this without seeing any code. The most common solution I've used when I get this behavior is a prevent default. You can do something like
<a href="#" (click)="$event.preventDefault()">
Or if you already have a click event then pass in $event as a parameter to your function then preventDefault in the function you are calling. This would look like:
Html
<a href="#" (click)="someFunc($event)">
and in your ts:
someFunc(event) {
event.preventDefault();
// rest of your code here
}
This answer is related to the question and it's the first one that comes up in Google so I hope this is useful.
I have some external web components that use regular anchor tags with hrefs that point to routes in my angular app. Clicking the href causes a full page reload. This is because I'm not using routerLink - but, in my case, I can't.
So, my work around is:
#HostListener('window:click', ['$event'])
onClick(e: any) {
const path = e.composedPath() as Array<any>;
const firstAnchor = path.find(p => p.tagName.toLowerCase() === 'a');
if (firstAnchor && !firstAnchor.hasAttribute('routerlink')) {
const href = firstAnchor.getAttribute('href');
this.router.navigateByUrl(href);
e.preventDefault();
}
}
Depending on your application, you might need to make some other checks e.g. is the target _blank, is it an external url etc.
change your a tag code as below
A Tag
this will invoke yourClickEvent(); without page reload
check the stackblitz here stackblitz
If you don't want to reload the page use $event.preventDefault()
<a href="#" (click)="$event.preventDefault()">
Try using debug tools to select the element, then click Event Listeners and then the Click event to see what is listening. Perhaps you can track it down that way.
You could also simply paste this into the console to trigger a break, and then click any of the offending elements:
['unload', 'beforeunload'].forEach(function (evName) {
window.addEventListener(evName, function () {
debugger; // Chance to check everything right before the redirect occurs
});
});
source: Break when window.location changes?
As you are using angular routes, try to use this notation:
<a [routerLink]="['./']" fragment="Test">
As explain by this comment: https://stackoverflow.com/a/38159597/4916355
use href="javascript:void(0);"
The reason you’d want to do this with the href of a link is that normally, a javascript: URL will redirect the browser to a plain text version of the result of evaluating that JavaScript. But if the result is undefined, then the browser stays on the same page. void(0) is just a short and simple script that evaluates to undefined.
Use [routerLink] instead of using href = "", and use click event to call your calling method in the typescript file.
ex:
// downloading the file based on file name
<a [routerLink]="'file://' + 'path'" (click)="downloadFile(templateDocument.fileName)">{{downloadDocuments.fileName}}</a>
Since you have mentioned the web app is asp.net webforms, can you please let us know
Whether the link is asp.net hyperlink control. If so,
AutoEventWireUp could cause the link to be automatically submitted:
Please have a look at this link
If you do have asp.net server controls on the page, then you could disable by setting
#Page AutoEventWireup="false"
For the entire project, this can be disabled by setting in web.config:
I have to change my code a little bit to add jquery popup window.
So far I just open new window using:
<a href="?action=_edit&_code=code"><img src...
In new version I simply open popup window using:
<a href="#myDialog" data-toggle="modal" onclick="">...
It works in terms of open dialog box, the only problem remains is how to pass arguments from ?action=_edit&_code=code in this case ?
Thanks for help ;)
You can use more data tags, for example, data-action, and data-code. These can then be obtained in your on click handler.
This link here might give you a better idea: http://www.slideshare.net/lensco/html5-data-attributes
I am facing an issue where a link on my website opens in a new window if you simply click on it. However, if you right click and say open in new window or new tab, it opens the same window (URL) again from where the link is clicked.
Self Service Option is a link and the JSP calls a function getSelfServSite() when the link is clicked. This is how the code flows in my case
function getSelfServSite()
{
getToTheLink("${myConfigInfo.selfServiceURL}");
// this is because the URL is configurable
}
function getToTheLink(url)
{
window.open (url, "currentWindow", "");
}
What am I doing wrong. I want it to go to the right link no matter how the user click it.
Please advise. Thanks
I would suggest doing something like this.
Setup an event handler to capture when a user right clicks. When they do, run you function to get the selfServSite url, and set the links href attribute to be the new Url.
here is some info on capturing the right click event.
How can I capture the right-click event in JavaScript?
EDIT: Based on our discussion in the comments, here is a revised solution.
When the page is opened in a new window from a right-click, it has "#id-card" appended to it, so what you need to do is check for that value when the page first loads, and if it's there, run the same javascript function that gets run when the user left-clicks on the link.
You can check for this value using the location objects hash property.
http://www.w3schools.com/jsref/obj_location.asp
I have a link which when clicked I open a window with window.open like below.
window.open("edit.jsp?clientId=" + clientId + "&eventId=" + eventId , 'height=600,width=800,scrollbars=1,location:no,menubar:no,resizable=1,status:no,toolbar:no');
I dont want the parameter to pass here instead I want to something like post so people cant copy url .
You cannot trigger a javascript popup and then force a post request.
Three options:
Trigger a POST form with target="_blank" using javascript (but this doesn't allow you to disable interface elements such as the menu bar).
Open a popup locally, but don't specify a url. Use the result of window.open to alter the document to generate a form, which you'd then post.
var myWindow = window.open("", "", "height=600,width=800,scrollbars=1,location=no,menubar=no,resizable=1,status=no,toolbar=no");
myWindow.document.write("Write a form here and then later on trigger it");
You really shouldn't do any of this. If it's bad for users to copy urls, there's a flaw in your application design.
Added after edit: Use the 'empty window' approach, but instead of writing a form and triggering it, do a an XMLHTTPRequest (with POST) in the parent. The result of this request can be used to populate the child-window.
Beside AJAX (jquery.load()), which I would use myself - how about the following approach:
<form method="post" action="edit.jsp" target="_blank">
<input type="hidden" name="clientId" value="88"/>
<input type="hidden" name="eventId" value="2"/>
</form>
target = _blank will actually open a new window /tab the posted data will be processed in.
Unfortunatelly you can hardly control the new windows appearance.
How about implementing a model popup window using a div? You can make an http post call to load the content of that div/model popup. You can use jQuery load() method to load the content of the div as well.
http://api.jquery.com/load/
Some other model popup plugins are here
http://jquery.com/demo/thickbox/
http://colorpowered.com/colorbox/
http://fancybox.net/