load content inside iframe using ajax - c#

I have iframe that works at the server side :
<iframe frameborder="0" runat="server" style="width: 100%; height: 700px; background-color: #bacad3;" id="I1" name="I1" src="Page.aspx"></iframe>
and I change the content dynamically with this code :
protected void Button1_Click(object sender, EventArgs e)
{
I1.Attributes["src"] = "Page.aspx";
}
I want to implement it with ajax in the following way:
when user click out side of iframe dont postback page and change the src of iframe
I want to show the progress inside the progressupdatepanel
I mention it I dont want to run any postback just loading page inside the iframe with ajax by calling outside of iframe for example there is a button in the page and it is handled by update panel and it loads the content of other page inside the iframe.
Could anybody help me ?

With onClientClick and mmke sure you return false to cancel the postback.
window.frames["frameName"].src = "http://example.com";
//or
document.getElementById("iframeId").src = "http://example.com";
If you are using runat=server you may need to use the client id
document.getElementById("<%= iframeId.ClientID %>").src = "http://example.com";

I found out it is not possible using this method you can not remove postback it needs proxing method like google mail (gmail) when you click inbox it apears in the right without postback but we can not implement with this method.

Related

Hide URL when mouse hover over asp:HyperLink

I have seen javascript:void(0) method used on <a> tags in HTML to hide the target URL of the hyperlinked object. Now I want to do the same on a <asp:HyperLink>, what should I do?
I am doing ASP.NET and here's the markup:
<asp:HyperLink runat="server" ID="hl1">Blah blah blah</asp:HyperLink>
In the codebehind I specified the NavigateUrl for hl1 using HttpUtility.UrlDecode method.
I tried hl1.Attributes[href]="javascript:void(0)"; in coebehind, does not work. Cannot open the NavigateUrl anymore.
You need to store the url you are wanting to navigate to in a hidden field and just set NavigateUrl = "#" in the markup as shown below. This way when user's cursor hovers over the link, the actual navigate URL will never be displayed at bottom of browser.
Then attach a click event handler on client-side for the hyperlink which you do by just setting onclick attribute of the hyperlink to a JavaScript function called navigate. The actual redirection to a new page is done by this navigate function.
In this situation, you will only see the URL of current page suffixed with #. For example, if your current page URL is http://localhost/mysite/view.aspx then it will show http://localhost/mysite/view.aspx# at bottom of browser.
Markup needed
<asp:HyperLink runat="server" ID="hl" NavigateUrl="#"
onclick="navigate();">Some Text</asp:HyperLink>
<asp:HiddenField ID="hdnURL" runat="server" Value="http://www.microsoft.com" />
JavaScript needed
<script type="text/javascript">
function navigate() {
window.location.href = document.getElementById("<%=hdnURL.ClientID%>").value;
}
</script>
Another approach that you can use if you must set the NavigateURL for the hyperlink in code-behind is as below. In this approach, you need to remove the NavigateURL before the content renders and store it in a global variable called linkUrl. The event that fires before the content renders is pageLoad and we will use that event to do this hack.
Global variable in JavaScript must always be declared outside all methods.
Then on clicking the hyperlink, we can obtain the value from the global variable of linkUrl and redirect user to that location.
Note: Keep the markup of the hyperlink the same as in first approach. But remove the hidden field from that markup.
<script type="text/javascript">
function navigate(event) {
window.location.href = linkURL;
}
var linkUrl = null;
function pageLoad() {
var link = document.getElementById("<%=hl.ClientID%>");
linkURL = link.getAttribute("href");
link.setAttribute("href","#");
}
</script>

Page_Load firing when following link to another page asp.net

I'm fairly new to ASP.NET, I've been reading a few questions related to this but I'm still unable to figure out what's wrong with my code, I have a default.aspx page with a menu on top created using a list (ul and li items) and putting the <a href=""> tag to create the links to other pages but after following a link to another page, the Page_Load event fires before leaving the page, I understand this would be the expected behavior with Response.Redirect, but I don't know how to avoid this using tags (if possible), this is the markup I'm using for the Default.aspx page:
<ul id="lista">
<li><strong>Inicio</strong></li>
<li><strong>Item</strong></li>
<li><strong>IK</strong></li>
<li><strong>Acerca de</strong></li>
</ul>
And this is the code behind I have for Page_Load:
protected void Page_Load(object sender, System.EventArgs e)
{
if (!IsPostBack)
{
ExcelUtility excel = new ExcelUtility();
dtDefault = excel.LeerExcel();
gridResults.DataSource = dtDefault;
gridResults.DataBind();
gridResults.VirtualItemCount = dtDefault.Rows.Count;
}
}
Basically, what I want to do is to follow the link to some other page without loading the default page before leaving, hope I make myself clear!
Edit: The root cause of this was having the default <form runat="server"> tag at the beginning of the body section, this was causing the Page_Load event firing again in the same page once the links were being clicked, placing the hyperlinks outside of the form tag did the trick.
Your HTML code should be inside some HTML tag or custom ASP control which contains the attribute runat="server". This is supposed to fire a PostBack request to the server.

Javascript function to hide HTML textbox on PageLoad

So I have a search textbox at the top of my website in the Master Page that I wish to disappear when the user is transferred to my search page. My textbox is written like so:
<div class = "SearchBox">
<form action="javascript:searchSite()">
<input type="text" id="searchIn" />
</form>
</div>
The best way I could think to do this was to have some JavaScript run on the PageLoad event of my search page, like so:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
this.ClientScript.RegisterStartupScript(this.GetType(), "show", "<script>document.getElementById('searchIn').style.display = 'none'</script>");
}
}
I am fairly certain that the javascript works, because sometimes the textbox will disappear for a second or two. Regardless, it immediately comes back and won't remain hidden. I have a asp:Textbox that I can easily hide using:
Site1 m = Master as Site1;
m.OtherTextBox.Visible = false;
I don't understand why hiding the HTML textbox is so difficult. Any suggestions or thoughts on how to remedy this would be much appreciated!
Page_Load is a server-side event, but you have to also wait for the element to be loaded on the client side. You can wrap you js code in a window.onload handler:
this.ClientScript.RegisterStartupScript(this.GetType(), "show", "<script>window.onload = function() { document.getElementById('searchIn').style.display = 'none'; }</script>");
Also, use display: none as explained by SLaks.
display: hidden is not a valid CSS value.
You want display: none.

PageLoad Event Is Not Fired When An Aspx Is Opened Through Jquery Of ascx anchor tag

I have a anchor tag like this
<a href="" class="search gl">
<img src="_gfx/cmn/goButton.png" class="searchbutton" name="btn"></img>
</a>
Button from jquery I am setting this href based on different conditions to different page.
$(".search gl").attr("href", "test.aspx");
But when I click on that anchor its loading the test.aspx page but not hitting the page_load event.I have to add some more conditions in that page load. Please help me.
Thanks
if the page is loaded but the event is not hit probably you have missed to specify the handler for the page load.
if in your page you got AutoEventWireup="true"
remove the handler
swithc to design
double click anywhere on the page
it will add the handler in the Page.aspx.Designer
otherwise you have to do it manually
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
this.Load += page_load;
}
You cannot have spaces in your class name:
Try:
<a href="" class="search_gl">
Then:
$(".search_gl").something(...);
Wrap that code inside $(document).ready() or $() and change the selector to .search.gl.
$(function(){
$(".search.gl").attr("href", "test.aspx");
});
If you want to use this link to post back to the same page then why do you are you setting href?

Javascript for running code-behind code when a button is clicked

i have a popup that is getting displayed when Save button is clicked. The popup has 2 buttons. Yes and No. No should cancel the popup
and yes should take you to function in the code-behind say, btnSave_Click(object sender, Eventargs e). How is it possible. Could someone help me, i am new to Javascript.
Below is the code where i am showin the popup.
var mdlPopup = $find('<%= ModalPopupExtendersavechanges.ClientID %>');
if(mdlPopup)
{
mdlPopup.show();
}
To do this you will need to set your server side function as a web method like this:
Add to the top of your code behind:
using System.Web.Services;
using System.Web.Script.Services;
Then decorate your method with these attributes:
[WebMethod(), ScriptMethod()]
public static void btnSave_Click(Object sender)
{
//Stuff
}
To call this from the client side (Javascript) do this:
PageMethods.btnSave_Click(this,btnSave_Click_Finished);
You can place that in a client click event. The first argument is the sender parameter, the second is the javascript function to call when the server side method has completed.
You can't call server side code from JavaScript directly. Make a postback or fire a XHR (AJAX) request in the background.
I think it is possible for you to acess the serverside script by using javascript.
__doPostBackis a function which is behind the asp postback and this function is called when a button is clicked or dropdown value is changed.
For more details pls refer to [this.][1]
All you need is to place a <asp:Button ID="btnSave" runat="server" onClick="btnSave_Click" /> in the form and in the javascript (ie button click function) just call the __doPostBack('<%= btnSave.UniqueID %>', '');
So it will calls the serverside function.(btnSave_Click)
Notice that you need to give '<%= btnSave.UniqueID %>' as the firstargument.
The above will works as similar to a server button click
The another way is to make a post or ajax using jquery.post or jquery.ajax it is possible to send request asynchronously to the server.Here you want to pass some query string and call the appropriate function in the page_Load
This will do without any postback
One another method is to use PageMethods from clientside by defining a static WebMethod
[1]: http://msdn.microsoft.com/en-us/library/aa720099%28vs.71%29.aspx/"Call serverside function from clientside"
I hope any one of these will solve your problem
the Yes button should be an asp.net control with a server-side handler
markup
<asp:button id="yesButton" runat="server" onclick="yes_click" />
codebehind
void yes_click(object sender, EventArgs e) {
// TODO your thing here.
}
the other buttons can be standard html inputs with javascript event handlers. if you are using javascript to alter element style, the changes won't persist across a postback- when the yes button submits and the page reloads, the popup won't be visible.

Categories

Resources