I have this JS function that loads whenever the page loads:
<script type="text/javascript">
window.onload = function () {
<asp:Literal ID="LiteralGraph01" runat="server"></asp:Literal>
<asp:Literal ID="LiteralGraph_ft01" runat="server"></asp:Literal>
</script>
How can I invoke this function from a asp:LinkButton click? The link button is called filtroCombinado:
<asp:LinkButton ID="filtroCombinado" runat="server"></asp:LinkButton>
Thanks for your help!
<asp:LinkButton... is rendered as an anchor (<a href=...). If you want to run some JS onload and onclick do something like this.
<script type="text/javascript">
window.onload = function myFunc () {//nobody blames you when you name the function
<asp:Literal ID="LiteralGraph01" runat="server">some data I fill in from server (and replace this text)</asp:Literal>
<asp:Literal ID="LiteralGraph_ft01" runat="server"></asp:Literal>
return false; //avoid sending request to the server
}//close the function
</script>
...
//do something before sending request to the server
<asp:LinkButton ID="filtroCombinado" runat="server" OnClientClick="return myFunc();"></asp:LinkButton>
Try this:
<script type="text/javascript">
var onLoadFunction = function () {
<asp:Literal ID="LiteralGraph01" runat="server"></asp:Literal>
<asp:Literal ID="LiteralGraph_ft01" runat="server"></asp:Literal>
</script>
<asp:LinkButton ID="filtroCombinado" runat="server" onClientClick="onLoadFunction()"></asp:LinkButton>
Related
My problem is after I click a button in update panel and close the window, "beforeunload" event not fire, while when I click another button this event fires properly.
Here is my code:
function dontlogout() //for postback refreshes
{
postback = true;
alert(postback);
}
$(window).bind('beforeunload',function() {
if(postback==false)
{
//my logout code here;
}
else
{
postback = false;
}
});
<asp:Button runat="server" ID="cmdOut" OnClientClick="dontlogout();" Text="next" OnClick="cmdOut_Click"></asp:Button>
<asp:UpdatePanel runat="server" ID="updQuestion" >
<ContentTemplate>
<asp:Button runat="server" ID="cmdNext" OnClientClick="dontlogout();" Text="next" OnClick="cmdNext_Click"></asp:Button>
</ContentTemplate></asp:UpdatePanel>
when i click cmdOut button no problem and when close browser my log out code executed, but when i click cmdNext in update panel and then close the browser my log out code not executed.
How can I solve this problem?
You have to return in the function callback of onbeforeunload
$(window).bind('beforeunload',function() {
if(postback==false)
{
//my logout code here;
// 👈🏼 Ok you can leave because you dont return
}
else
{
postback = false;
return "You cannot leave"; //👈🏼 You cannot leave
}
});
Add the 'Triggers' tag just before the end tag of the update panel
<asp:UpdatePanel runat="server" ID="updQuestion" >
<ContentTemplate>
<asp:Button runat="server" ID="cmdNext" OnClientClick="dontlogout();" Text="next" OnClick="cmdNext_Click"></asp:Button>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="cmdNext" />
</Triggers>
</asp:UpdatePanel>
I call the following javascript function in an update panel which refresh my page although it is in an update panel!!
<script type="text/javascript" language="javascript">
function get_emp_num(source, eventArgs) {
var txt_emp_num = "<%= txt_RequestEmpNum.ClientID %>";
document.getElementById(txt_emp_num).value = eventArgs.get_value();
__doPostBack("<%=txt_RequestEmpNum.ClientID %>");
}
function get_person_num(source, eventArgs) {
var txt_person_num = "<%= txt_RequestPersonNum.ClientID %>";
document.getElementById(txt_person_num).value = eventArgs.get_value();
__doPostBack("<%=txt_RequestPersonNum.ClientID %>");
}
</script>
I don't want this script to change the partial post back behavior of my update panel .how to do that ?
What is your postback control and is it setup as an async trigger on the update panel? Based on the code you posted, I suspect that txt_RequestEmpNum and txt_RequestPersonNum are text boxes. Those controls don't natively support postbacks. What you need is a hidden button on the page that your javascript will "click" to send the postback. Something like this:
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" />
</Triggers>
<ContentTemplate>
<asp:TextBox ID="txt_RequestEmpNum" runat="server" />
<asp:TextBox ID="txt_RequestPersonNum" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
<div style="display: none;">
<asp:Button id="Button1" runat="server" OnClick="Button1_Click" />
</div>
<script>
function get_emp_num(source, eventArgs) {
// I am unsure what your intent was with the code here so I removed it
__doPostBack("<%=Button1.UniqueID %>", "");
}
function get_person_num(source, eventArgs) {
// I am unsure what your intent was with the code here so I removed it
__doPostBack("<%=Button1.UniqueID %>", "");
}
function refresh_using_jquery() {
__doPostBack($('#<%=Button1.ClientID %>').attr('name'), '');
}
</script>
If you're looking to not do a full page postback then you'll want to implement a solution that uses AJAX. I would go with using jQuery because it makes using AJAX somewhat easier (in my opinion, anyway).
I want a dialog div to appear and rest page to be greyed out. I should not be able to click anything else on page.
Following is the code I am using. Somehow the code is not working. Page just refreshes on click of hyperlink.
Can anyone help ?
<script>
$(document).ready(function () {
$("#DownloadButton").click(function (e) {
ShowDialog(true);
e.preventDefault();
});
$("#btnClose").click(function (e) {
HideDialog();
e.preventDefault();
});
$("#btnDownload").click(function (e) {
HideDialog();
e.preventDefault();
});
});
function ShowDialog(modal) {
$("#overlay").show();
$("#dialog").fadeIn(310);
if (modal) {
$("#overlay").unbind("click");
}
else {
$("#overlay").click(function (e) {
HideDialog();
});
}
}
function HideDialog() {
$("#overlay").hide();
$("#dialog").fadeOut(300);
}
</script>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div id="overlay" class="web_dialog_overlay">
</div>
<div id="dialog" class="web_dialog">
<table>
<tr>
<td>
<asp:Button ID="btnDownload" runat="server" Text="Download" />
</td>
<td>
<asp:Button ID="btnClose" runat="server" Text="Close" />
</td>
</tr>
</table>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:PostBackTrigger ControlID="DownloadButton" />
</Triggers>
<ContentTemplate>
<div class="BaseClass">
<asp:LinkButton ID="DownloadButton" runat="server">Download</asp:LinkButton>
</div>
<asp:GridView>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
If DownloadButton, btnClose & btnDownload are IDs of server control, then for getting client ID you have to use:
$("#<%=DownloadButton.ClientID%>")
instead of
$("#DownloadButton")
in you jQuery Code.
Or
If you are using ASP.Net 4.0
Use ClientIDMode="static" with your server side controls.
For Closing the Dialog:
Use link to close the model popup:
Eg.
and in you Javascript use:
$("#btnClose").click(function (e) {
HideDialog();
});
why don't you use simply anchor tag? it won't cause a postback at least, no need to use update panel.
<a id="DownloadButton" href="#">Download</a>
$("#DownloadButton").click(function (e) {
ShowDialog(true);
e.preventDefault();
});
Otherwise Kapil Khandelwal answer is correct if you want to use server side control.
$("#<%=DownloadButton.ClientID%>")
In document ready:
jQuery("#overlay").dialog(
{
bgiframe: true,
autoOpen: false,
modal: true,
width: 800
}
);
in the click event:
$('#overlay').dialog('open');
You'll have to specify more options in the dialog declaration, I'm sure, but this approach is working fine for me.
I've designed a web page in asp.net. And in that page i placed html control too like <a> & <div>. I have written one java script function which is hiding the <div> when i'm clicking on the <a> tag. Its working fine. But when i'm clicking on the asp.net button then page refresh occur again. And it is loading my previous design of the page. I set the display:none of the <div> at the design time. so it is hiding my <div> again when occuring any other server side event. And i don't want let it happen.
Javascript function-
<script language="javascript" type="text/javascript">
function toggle5(showHideDiv, switchTag) {
try {
'<%Session["temp"] = "'+more+'"; %>';
var ele = document.getElementById(showHideDiv);
var imageEle = document.getElementById(switchTag);
if (ele.style.display == "block") {
ele.style.display = "none";
imageEle.innerHTML = 'More';
}
else {
ele.style.display = "block";
imageEle.innerHTML = 'Less';
}
}
catch (err) {
alert("Error");
}
}
</script>
html code is-
<div id="divSearch" style="float:left;height:100%;width:100%;">
<span style="float:right;height:27px;"><a id="displayText" href="#" onclick="javascript:toggle5('toggleText', 'displayText');">More</a></span>
</div>
<div id="toggleText" style="display:none;height:100%;width:100%;">
<div id="divCalls" style="width:24%;float:left;height:30%;">
<span style="float:left;width:100%;color:#3b5998;">
<asp:CheckBox ID="chkNoCall" runat="server" Text="No call made in "
AutoPostBack="True" oncheckedchanged="chkNoCall_CheckedChanged"/>
<asp:TextBox ID="txtNoCall" runat="server" Width="12%" Enabled="False"></asp:TextBox><span> days</span></span>
</div>
</div>
C#.net code of the Checkbox-
protected void chkNoCall_CheckedChanged(object sender, EventArgs e)
{
if (chkNoCall.Checked == true)
{
txtNoCall.Enabled = true;
}
else
{
txtNoCall.Enabled = false;
txtNoCall.Text = "";
}
}
How to solve this problem?
thanks
put this data inside the updatepanel like this
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<span style="float:left;width:100%;color:#3b5998;">
<asp:CheckBox ID="chkNoCall" runat="server" Text="No call made in "
AutoPostBack="True" oncheckedchanged="chkNoCall_CheckedChanged"/>
<asp:TextBox ID="txtNoCall" runat="server" Width="12%" Enabled="False"></asp:TextBox><span> days</span></span>
</ContentTemplate>
</asp:UpdatePanel>
hope this help
In your button click event, return false. this will prevent postback.
Use ajax to get the server side data instead of submitting the page.
Try one of the following:
remove runat=server from the component (a component with runat=Server always submits a form.
use standard html controls
use javascript for html controls
it it's a component with autopostback feature; make autopostback=false
In my web page I've a Linkbutton with OnClientClick event as show below.
<asp:LinkButton ID="lnkbtn" Text="Click" runat="server" OnClientClick="dosomething(this.Text)" />
and I've defined the function as shown below in the head section of the web "page
<script type="text/javascript">
function dosomething(ObjCntxt)
{
alert(ObjCntxt.toLocaleString());
var textval = ObjCntxt;
alert(textval.value);
}
</script>
When i run the page and click on the LinkButton i'm getting the message undefined.
I request you all kindly solve my problem.
Thanks & Regards.
This works for me:
<script type="text/javascript" language="javascript">
function doSomething(ObjCntxt) {
alert(ObjCntxt); // Text
alert(ObjCntxt.toLocaleString()); // Text
alert(ObjCntxt.toString()); // Text
alert(ObjCntxt.value); // undefiend
}
</script>
<asp:LinkButton ID="lnkbtn" Text="Click" runat="server" OnClientClick="doSomething(this.text);">Text</asp:LinkButton>
Remember, that the content of doSomething is JavaScript, not .NET, so you should use JavaScript members, such as this.text not this.Text
What do you expect from ObjCntxt.value?? Christmas gift?
Try this One
<script type="text/javascript" language="javascript">
function doSomething(ObjValue) {
alert(ObjValue); // Text
}
</script>
<asp:LinkButton ID="lnkbtn" Text="Click" runat="server" OnClientClick="doSomething(this.value);">Text</asp:LinkButton>