This div is in a radRotator control and generate a clickable link that, on click, opens the url in a new page of the browser.
<div class="link">
<span>Link</span>
</div>
I am looking for a method to capture the link value in a string when it is clicked and avoid to open the browser.
My final target is to pass such string to a method that will open the url in a window where I can filter out all the parts I do not like to show to avoid the user to leave the website and visit the one linked. I am a bit lost on this. Any hint?
Add an "onclick" event to your link, capture the href attribute and cancel the default click action by returning false.
E.g. (for simplicity I am using inline declaration)
Link
To expand on your example, you can do something like this:
ASPX
<a href="<%#XPath("link").ToString()%>" target="_blank" onclick="return getLink(this);">
JavaScript
function getLink(anch) {
var sLink = anch.href; // you can use this variable, it will hold the link now
// rest of your code
return false;
}
Related
Background
Here's what I want to happen:
A user is on one page1.html (jsFiddle).
When they click on one of the <a href...> links, I want to navigate to page2.html (jsFiddle) and simulate the user entering the number into the textbox and clicking on the button.
Example: On page1.html, user clicks on display 2. Then we will navigate to page2.html and get an alert of 2 (as if user had entered 2 and clicked the button).
Question
How do I do this?
Is there a way to make a C# method with a specific URL to navigate to, such as page2.html/searchfor/2?
Or is there some way in JavaScript to manually go about doing other things after navigating to <a href="page2.html">?
Things I've tried
Using a <span> with an onclick function, but then it's not a true link like <a href> where I can middle click to open in new tab and right click to follow link
Wrapping my first attempt in <a href> tags, like <span>Display 2</span>. This still doesn't solve the problem of performing extra actions after navigation.
Note
I am building this webpage using Entity Framework, ASP.NET MVC, and C#.
I have simplified the problem for discussion purposes, but the concept is the same.
Try using the page2.html document's onload() function. You can pass parameters through the URL, then take that data and perform "other actions" as soon as the document is loaded.
I have a page where If you click a link, e.g. 'search' it will open a search page and you can then select an item from the gridview to use in the previous (parent) page.
I was wondering how I would go about sending back the information to the parent page and then refresh the parent page to fill in the other data?
I am guessing it will be some kind of javascript dynamically created in the code behind?
window.opener is the window that opened the current window.
So, if you popup a temporary window from some page, you can use window.opener from the popup window to reference the previous page objects or global variables in that page to put data back into the parent window.
Most web apps these days avoid popups because of the various popup restrictions in browsers. Instead, folks tend to use overlays in the same window which don't run afoul of popup blockers.
For example, from the popup window, you could do something like this:
window.opener.document.getElementById("result") = myHTML;
or:
window.opener.searchData.choice = "foo";
or:
window.opener.myFunc(data);
Use popup div showed when u change the value of the input , the necessary 2 steps : sending ajax data and receiving the data in the same page
The best way that I see is calling parent function from opener
I don't know which html has your popup page but maybe something like this:
//child
...
<table>
<tr>
<td>item 100</td> <td><input type="button" id="searchResult100" onclick="updateParent(100)"></td>
</tr>
</table>
...
function updateParent(id){
if(window.opener){
window.opener.updateData(id);
window.close();
}
}
I don't know how you want to use ID that is selected on the popup, you can hide all results that have different ID or put id inside some hiddenfield and do a postback to use the ID on the code behind. Need more information about the purpose.
//parent
...
function updateData(searchId){
// use searchId to update
}
I have an HTML page with this script:
<Script>
function Run()
{
alert("The Content Here");
return true;
}
</script>
<button onclick="Run();">I Want It Now</button>
Lets say that I opened this page with firefox or Chrome. And lets say that I clicked on the button "I Want It Now" and the page shows me the alert:
The Content Here
How can I insert the alert content into a string in my VB.NET project? I know that I can use the alert window handle to get the label handle and then extract (grab) the text of the alert, but I don't think that this is the best way to do it. Is there another way to pass (or get) information from the page (not from webbrowser control or by using webClient.DownloadString) into my VB.NET (or C#) project?
i don't this it will easy to use js without the webbrowser control by the way if you changed your mind and want to use a web browser control , you can do it like this :)
WebBrowser1.Document.GetElementById("NAME").InvokeMember("click");
We want to reduce the number of steps it takes for a user to upload a file on our website; so we're using jQuery to open and postback files using the below markup (simplified):
<a onclick="$('#uplRegistrationImage').click();">
Change profile picture
</a>
<!-- Hidden to keep the UI clean -->
<asp:FileUpload ID="uplRegistrationImage"
runat="server"
ClientIDMode="static"
Style="display:none"
onchange="$('#btnSubmitImage').click();" />
<asp:Button runat="server"
ID="btnSubmitImage"
ClientIDMode="static"
Style="display:none"
OnClick="btnSubmitImage_OnClick"
UseSubmitBehavior="False" />
This works absolutely fine in Firefox and Chrome; opening the file dialog when the link is clicked and firing the postback when a file is selected.
However in IE9 after the file upload has loaded and a user has selected a file; insteaed of the OnChange working I get a "SCRIPT5 Access is denied" error. I've tried setting an arbitrary timeout, setting intervals to check if a file is given to no avail.
There are a number of other questions relating to this; however none appear to have a decent answer (One said set the file dialog to be transparent and hover behind a button!)
Has anyone else resolved this? Or is it absolutely necessary that I provide a button for IE users?
For security reasons, what you are trying to do is not possible. It seems to be the IE9 will not let you submit a form in this way unless it was an actual mouse click on the File Upload control that triggers it.
For arguments sake, I was able to use your code to do the submit in the change handler, but it worked only when I clicked the Browse button myself. I even set up polling in the $(document).ready method for a variable set by the change handler that indicates a submission should be triggered - this didn't work either.
The solutions to this problem appear to be:
Styling the control in such a way that it sits behind a button. You mentioned this in your question, but the answer provided by Romas here In JavaScript can I make a "click" event fire programmatically for a file input element? does in fact work (I tried in IE9, Chrome v23 and FF v15).
Using a Flash-based approach (GMail does this). I tried out the Uploadify demo and it seems to work quite nicely.
Styling a File Upload:
http://www.quirksmode.org/dom/inputfile.html
http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
References:
jQuery : simulating a click on a <input type="file" /> doesn't work in Firefox?
IE9 file input triggering using Javascript
getting access is denied error on IE8
Hey this solution works.
for download we should be using MSBLOB
$scope.getSingleInvoicePDF = function(invoiceNumberEntity) {
var fileName = invoiceNumberEntity + ".pdf";
var pdfDownload = document.createElement("a");
document.body.appendChild(pdfDownload);
AngularWebService.getFileWithSuffix("ezbillpdfget",invoiceNumberEntity,"pdf" ).then(function(returnedJSON) {
var fileBlob = new Blob([returnedJSON.data], {type: 'application/pdf'});
if (navigator.appVersion.toString().indexOf('.NET') > 0) { // for IE browser
window.navigator.msSaveBlob(fileBlob, fileName);
} else { // for other browsers
var fileURL = window.URL.createObjectURL(fileBlob);
pdfDownload.href = fileURL;
pdfDownload.download = fileName;
pdfDownload.click();
}
});
};
This solution looks like it might work. You'll have to wrap it in a <form> and get it to post in the jquery change handler, and probably handle it in form_load using the __eventtarget or and iframe or whatever it is that web forms uses, but it allows you to select a file, and by submitting the form, it should send it. I can't test it however, since I don't have an environment set up at home.
http://jsfiddle.net/axpLc/1/
<a onclick="$('#inputFile').click();">
Change profile picture
</a>
<div id='divHide'>
<input id='inputFile' type='file' />
</div>
$('#inputFile').change(function() { alert('ran'); });
#divHide { display:none; }
Well, like SLC stated you should utilize the <Form> tag.
First you should indicate the amount of files; which should be determined by your input fields. The second step will be to stack them into an array.
<input type="file" class="upload" name="fileX[]"/>
Then create a loop; by looping it will automatically be determined based on the input field it's currently on.
$("input[#type=file]:nth(" + n +")")
Then you'll notice that each file chosen; will replace the input name to the file-name. That should be a very, very basic way to submit multiple files through jQuery.
If you'd like a single item:
$("input[#type=file]").change(function(){
doIt(this, fileMax);
});
That should create a Div where the maximum file found; and attaches to the onEvent. The correlating code above would need these also:
var fileMax = 3;
<input type="file" class="upload" name="fileX[]" />
This should navigate the DOM parent tree; then create the fields respectively. That is one way; the other way is the one you see above with SLC. There are quite a few ways to do it; it's just how much of jQuery do you want manipulating it?
Hopefully that helps; sorry if I misunderstood your question.
I am trying to display a page into an IFrame.
The IFrame is displayed into a fancyBox overlay popup.
I have a list with the http links (gets compiled at runtime and it constantly changes).
Using a global variable I can access the list with the links.
But the http link in the list must match the link I have clicked.
If I can even get the link which I have clicked it will also be enough (the link brings up a fancyBox popup so it doesn't actually bring up a new page so to speak)
How to do that?
You have to write some tricky code to achieve this, main goal is to edit the dynamically added page content by adding wrapper tag (with onclick event) around all the links, writing javascript to be called using that wrapper to findout which link has been clicked,
You can try this by doing following steps
1) Get the content of IFrame , using the following JQuery code you can get the content of IFrame
var $currentIFrame = $('#myIFrame');
var content = $currentIFrame.contents();
2) Now manupulate these content by finding all the links inside that page and wrapping them with a tag that should have onclick event e.g. span , you have to write some javascript function to fire on a link if user clicks it.
see the following link for how to manipulate content
Get all links inside iframe and add blank target attribute