Need a postback handle from a clicked dynamic hyperlink control in ajax - asp.net

The scenario...I have a list of dynamic hyperlink controls on an ajax panel that link directly to a WORD doc located on a share. Clicking any link opens WORD client side (I set the file association to do that so the IE browser doesn't try to open it instead).
LinkButtons won't work because it doesn't do a direct link to the doc from the browser and I don't want server automation or activex, since I want each client to open the doc using their own box as if they had simply clicked on the document itself.
But I need to change an image in an image control once they've clicked on the hyperlink. In other words, I need the link to sit on top of a control that does cause a postback so I can get at the posting controls ID and do my thing. I'm also trying to avoid client side scripting though I'm sure there may be a convoluted way to do that.
Here is the code in the loop that creates the dynamic link. I started with just the hyperlink control, then this code is messing with adding a hyperlink to a label, that's why it's showing as it is:
Label lblWordLink = new Label();
HyperLink hrefLetter = new HyperLink();
hrefLetter.Text = items.letterName;
hrefLetter.NavigateUrl = folderForPackageLetters + items.letterName + wordDocExtension;
hrefLetter.ID = "standardLettersHref_" + items.letterName;
lblWordLink.Text = "<a href='" + hrefLetter.NavigateUrl.ToString() + "'>" + items.letterName + "</a>" ;
tRow.Cells[1].Controls.Add(lblWordLink);
I'm looking for a way to let the link open the doc and at the same time postback. Is there a way to layer the link control on top of another control such that the link just links and the control beneath causes a postback?
32U
Fixed: the answer gave the clue. On the server, during dynamic control creation I did:
HyperLink hrefLetter = new HyperLink();
hrefLetter.ID = "standardLettersHref_" + items.letterName;
hrefLetter.Text = items.letterName;
hrefLetter.NavigateUrl = folderForPackageLetters + items.letterName + wordDocExtension;
hrefLetter.Attributes.Add("OnClick", "letterHrefClick('" + items.letterName + wordDocExtension + "')");
tRow.Cells[1].Controls.Add(hrefLetter);
then client side I pushed a value into a hidden control inside the ajax panel when the hyperlink control was clicked and forced submit:
function letterHrefClick(link) {
//alert(link);
form1.hdnLetterClick.value = link;
form1.submit();
}
After the submit, back on server side, I got the value in the Page_Load event:
string x = hdnLetterClick.Value;
nice!
update...
An even better way to do this... in the javascript postback use:
__doPostBack("hdnLetterClick", "somevalue");
then in the codebehind in the Page_Init you can do (not for button or imgbutton):
string postbackControlID = Request.Params.Get("__EVENTTARGET");
string postbackArgument = Request.Params.Get"__EVENTARGUMENT");
to get at what you need. This is better if dealing with dynamic controls so you can control state during control recreation.

If you give your link an onclick attribute, those javascript actions should also be executed when the link is selected.

Related

Create Temporary Page

can someone point me to the right direction
I need a code to dynamically create a temporary Web Pop-up Page which I'll declare the HTML Content in ASP.NET Using VB
reason for this function is that I am trying to make Application Form printer and I need to print the current page with the
<script>window.print();</script>
You could generate the entire HTML as string and then use as below:
window.open("data:text/html;charset=utf-8,<head></head><body><h3>Test Document</h3></body><script>window.print();</script>");
Basically,
window.open("data:text/html;charset=utf-8," + YOUR_HTML + "<script>window.print();</script>");
Copy paste the below script in a browser to test:
data:text/html;charset=utf-8,<head></head><body><h3>Test Document</h3></body><script>window.print();</script>
== Updates ==
Aspx.vb Code
Dim htmlText As String = "<head></head><bod‌​y><h3>Test Document</h3></body>".Normalize()
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "tempWindow", "<script>openTempWindow('" + htmlText + "')</script>", False)
Aspx Code
<script type="text/javascript">
function openTempWindow(content) {
var win = window.open("");
win.document.write(content);
}
</script>
You can achieve that by manipulating the response. This is one way to dinamically create an HTML document. For example:
HttpContext.Current.Response.Write("<html>
<body>
<h1>Something to print</h1>
</body>
<script>window.print();</script>
</html>")
In order to make it a popup window, in your base page you can implement window.open() function after, lets say, a button click. For example:
window.open("../pageReturningDynamicHTML.aspx?someParam=someValue")
In the provided link you can find more examples on how to open a window as popup with settings as sizes and more.

using JavaScript, find the ClientID of .NET control nested deep within a master page

The short question:
*takes deep breath*
How I can ClientID of TableRow inside Table added to PlaceHolder, which is in a UserControl inside a Web Part added to a SharePoint page using a MasterPage?
The explanation:
I'm building a usercontrol that dynamically shows SPList items, one per Web.UI.Table(). The 2nd row of the Table() will be hidden at first, with an image used to initiate some JavaScript to hide/show the row at the clients browser (rather than use postback or ajax - I have reasons).
The Table() is then added to a PlaceHolder in a UserControl, which is then used by a WebPart, and that WebPart is added to a SharePoint Page, which of course uses a MasterPage. I'm having real trouble working out the JavaScript method to find the ClientID of the TableRow, given that it's nested so deeply.
My .ascx code looks something like this..
<script type="text/javascript">
function showHidden(itemId) {
var controlId = document.getElementById('<%= phDownloadTable.ClientID %>');
//alert(controlId);
document.getElementById(controlId).style.display = (document.getElementById(controlId).style.display == "table-row") ? "none" : "table-row";
}
</script>
<asp:PlaceHolder ID="phTable" runat="server"></asp:PlaceHolder>
and my .cs codebehind is something like this..
Table myTable = new Table();
TableRow hiddenRow = new TableRow();
hiddenRow.ID = "row" + itemId;
hiddenRow.Attributes.Add("style","display: none;");
... create TableCells and add to hiddenRow...
TableRow displayRow = new TableRow();
TableCell toggleCell = new TableCell();
Image toggleImage = new Image();
toggleImage.ImageUrl = "/images/myimage";
toggleImage.Attributes.Add("onclick","javascript:showHidden('" + hiddenRow.ClientID + "');
toggleCell.Controls.Add(toggleImage);
displayRow.Cells.Add(toggleCell);
... create more TableCells and add to displayRow
myTable.Rows.Add(displayRow);
myTable.Rows.Add(hiddenRow);
the result is that the toggleImage "onclick" attribute shows showHidden('row999');, which passes 'row999' to the JavaScript function, but I cannot figure out there how to get the full clientId of the TableRow it refers to.
The source of my page shows the clientId to be ctl00_SPWebPartManager1_g_eda9b9e9_4c7a_48e0_a2aa_fd8cdd65de6c_ctl00_row999, which is longer than I'm used to seeing, and seems to contain two 'ct100_' parts, suggesting multiple levels of controls.
Any ideas would be greatly appreciated. I've tried all the usual avenues (googleing for 'javascript .net control client id' and the like, but so far I've not found anything that helps. Most suggest document.getElementById('<%= myControl.ClientId %>')... which is fine, but I don't know 'myControl' - I need that send from the toggle image.
Fingers crossed!!
Kevin
If you cant set the client id, you should be able to set a class, and that should be respected by .nat.
Them you can select the element by class name.
JavaScript has no wildcard selection options. Try using jQuery, that makes things more flexible.
Then you can use something like:
$("tr[id*='<%= phDownloadTable.ClientID %>']").css("display", your value);
this way you will still find the right element, even when it's moved to another place on the page.
Here is a more detailed explanation on how to use these wildcard selectors:
http://api.jquery.com/attribute-contains-selector/
With plain JavaScript you can do a document.getElementsByTagName('tr') and then loop those to find the right object.
If you are using Framework 4.0 you can set the ClientIdMode of the page like this:
Page.ClientIDMode = System.Web.UI.ClientIDMode.Static;
That way you can have more predictable client ids. For example, you can have id's without all the ctl00_ prefixes.

window.open function in HREF TAG not working

I am trying to open popup using window.open finction but somehow it's not working ... well below is the code
string properties = "left=250px, top=245px, width=700px, height=450px,scrollbars=yes, status=yes, resizable=yes";
TableCell cell = new TableCell();
cell.Text = "" + "View Details";
But his is not working. While clicking the anchor tag getting javascript error "Invalid argument". Please tell where am I going wrong?
Thanks,
Rahul
How about using the target attribute on the anchor tag as in: Link text here
Anchor target attribute
_blank – Opens the linked document in a new window or tab
_parent – Opens the linked document in the parent frame
_self – Opens the linked document in the same frame as it was clicked (this is default)
_top – Opens the linked document in the full body of the window
You're doing it wrong. Never put JavaScript into the href attribute. This is how you should do it:
View Details
I added the second argument for window.open (the window identifier) as well, which is probably what was breaking your thing in the first place.
<a href="?i=1" id ="a" runat = "server">
on Page_load()
if (Request.QueryString["i"] == "1")
{
//call ur code here
AreaFootPrint_Click(null,null);
}

ASP.NET postbacks lose the hash in the URL

On an ASP.NET page with a tabstrip, I'm using the hash code in the URL to keep track of what tab I'm on (using the BBQ jQuery plugin). For example:
http://mysite.com/foo/home#tab=budget
Unfortunately, I've just realized that there are a couple of places on the page where I'm using an old-fashioned ASP.NET postback to do stuff, and when the postback is complete, the hash is gone:
http://mysite.com/foo/home
... so I'm whisked away to a different tab. No good.
This is a webforms site (not MVC) using .NET 4.0. As you can see, though, I am using URL routing.
Is there a way to tell ASP.NET to keep the hash in the URL following a postback?
The problem is that the postback goes to the url of the current page, which is set in the action of the form on the page. By default this url is without #hash in asp.net, and its automatically set by asp.net, you have no control over it.
You could add the #hash to the forms action attribute with javascript:
document.getElementById("aspnetForm").action += location.hash
or, if updating an action with a hash already in it:
var form = document.getElementById("aspnetForm");
form.action = form.action.split('#')[0] + location.hash
just make sure you execute this code on window.load and you target the right ID
I tried to put the code from Willem's answer into a JS function that got called everytime a new tab was activated. This didn't work because it kept appending an additional #hash part to the URL every time I switched tabs.
My URL ended up looking like http://myurl.example.com/home#tab1#tab2#tab3#tab2 (etc.)
I modified the code slightly to remove any existing #hash component from the URL in the <form> element's action attribute, before appending on the new one. It also uses jQuery to find the element.
$('.nav-tabs a').on('shown', function (e) {
// ensure the browser URL properly reflects the active Tab
window.location.hash = e.target.hash;
// ensure ASP.NET postback comes back to correct tab
var aspnetForm = $('#aspnetForm')[0];
if (aspnetForm.action.indexOf('#') >= 0) {
aspnetForm.action = aspnetForm.action.substr(0, aspnetForm.action.indexOf('#'));
}
aspnetForm.action += e.target.hash;
});
Hope this helps someone!
I have another solution, implemented and tested with chrome, IE and safari.
I am using the "localStorage" object and it suppose to work all the browsers which support localStorage.
On the click event of tab, I am storing the currentTab value to local storage.
$(document).ready(function() {
jQuery('.ctabs .ctab-links a').on('click', function(e) {
var currentAttrValue = jQuery(this).attr('href');
localStorage["currentTab"] = currentAttrValue;
// Show/Hide Tabs
jQuery('.ctabs ' + currentAttrValue).show().siblings().hide();
// Change/remove current tab to active
jQuery(this).parent('li').addClass('active').siblings().removeClass('active');
e.preventDefault();
});
if (localStorage["currentTab"]) {
// Show/Hide Tabs
jQuery('.ctabs ' + localStorage["currentTab"]).show().siblings().hide();
// Change/remove current tab to active
jQuery('.ctabs .ctab-links a[href$="' + localStorage["currentTab"] + '"]').parent('li').addClass('active').siblings().removeClass('active');
}
});

Getting JS Error (for - event.srcElement.id) in WebForm

I am building a dynamic user control (ascx) which contains a placeholder. Inside the placeholder, there will be n tables. Inside each table, in one of the cells i have the link button as below.
HyperLink lnkButton = new HyperLink();
lnkButton.ID = "lnkButton_" + ID.ToString();
lnkButton.Text = tstText;
lnkButton.NavigateUrl = "javascript:JS_Click();";
I have to call a JS function on the link button click (no postback).
In the JS function, i have to get the id of the control that invoked that JS function. In this case, it will be link button. I am writing the below code in the JS Function:
var ctrl = event.srcElement.id;
but i am getting 'Object Required' error in javaScript.
Few other things: This user control will be loaded in default.aspx page and the JS Function i am writing in default.aspx.
I am not sure why this is not working. I am using IE6/7, VS 2005. Is there any other function or way available to get the srcElement.id. Please help.
Try passing this along when you invoke the method
lnkButton.NavigateUrl = "javascript:JS_Click(this);";
then you can write this in your JS_Click event
function JS_Click(obj)
{
alert("Now I have my object " + obj.id);
}
Another option would be to use jQuery and wire up to the click event on your link buttons.
Add a CssClass attribute to the LinkButton's you are creating:
HyperLink lnkButton = new HyperLink();
lnkButton.ID = "lnkButton_" + ID.ToString();
lnkButton.Text = tstText;
lnkButton.CssClass = "linkButton";
Then write the follwoing JS/ JQuery in your ASPX page:
$(document).ready(function()
{
$('.linkButton', '#userControlID').click(function(e)
{
alert('You clicked linkbutton with ID ' + e.target.id);
});
});
In the above example each link button has class="linkButton" and they are contained within your usercontrol with ID="userControlID".

Resources