I am using preloader in my aspx page but my preloader blocks asp.net buttons,
how do I solve this?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
document.write('<script src="/dizin/dosyalar/bs/js/vendor/jquery.min.js"><\/script>')</script>
<script src="/dizin/dosyalar/bs/js/bootstrap.min.js"></script>
<script>
$(window).load(function(){$('#status').fadeOut();$('#preloader').delay(350).fadeOut('slow');$('body').delay(350).css({'overflow':'visible'});})
</script>
<div class="gnl-loading" id="preloader"></div>
<asp:ImageButton ID="ebulten" runat="server" OnClick="ebulten_OnClick" CssClass="btn btn-default footerbtn" ImageUrl="/dizin/site/img/index/btn.png" />
Javascript codes solved by getting inside the page
I got this error from jquery version
Check your old jquery codes and rewrite. Its will be work
Related
am trying to show a loading div on button click, but it is not working at the moment.
Javascript :
<script type="text/javascript">
$(document).ready(function (e) {
$('#BtnSend').click(function () {
$('#<%= loading.ClientID %>').toggle("slow");
});
});
</script>
Div:
<div id="loading" class="Loading" runat="server" visible="false">
<div class="loadingImg">
<img src="../Images/loading.gif" alt="loading" />
</div>
</div>
Button:
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onclick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
the div is set to runat server so that I can change its visibility also through code.
Use the onClientClick for the asp button. Then make the jquery function that you ahve called BtnSend_Click
If you want to do it via Client side:
jQuery
function BtnSend_Click () {
$('#<%= loading.ClientID %>').toggle("slow");
}
ASP Button
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onClientClick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
If you want to do it via the server:
C#
protected void BtnSend_Click(object sender, EventArgs e){
loading.Visibility = 'visible' //not sure on syntax to show it in code behind off the top my head
}
ASP Button
<asp:Button ID="BtnSend" runat="server" Text="SEND"
onClick="BtnSend_Click" CssClass="pressbutton2" Height="36px" ClientIDMode="Static" />
The ASP.Net AJAX library has an UpdateProgress control that sounds like it would fit your needs.
I've tried adding in a prevent default, as the code as described below would postback before the loading div was shown otherwise.
<script type="text/javascript">
$(document).ready(function (e) {
$('#<%= BtnSend.ClientID %>').click(function (e) {
e.preventDefault();
$('#<%= loading.ClientID %>').toggle("slow");
});
});
</script>
Another thing I've noticed is you have set Visible="false":
<div id="loading" class="Loading" runat="server" visible="false">
This means the div doesn't exist as its not output from the server side. Look in the view source when the page loads, it wont be there and hidden, its just not there. Remove the visible="false" and use CSS to hide it to start off with.
i am using bootstrap in my c# asp.net project and i want to show to show the modal popup from code behind.
in my page header i have a javascript function as follows:
function LoginFail() {
$('#windowTitleDialog').modal('show');
}
and on the click of my button i am calling the javascript as follows
ScriptManager.RegisterClientScriptBlock(this, typeof(System.Web.UI.Page), "LoginFail", "LoginFail();", true);
this does not show the modal popup. however, if i use something like alert('login failed'), it works fine.
can anybody please help with this?
By default Bootstrap javascript files are included just before the closing body tag
<script src="vendors/jquery-1.9.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/easypiechart/jquery.easy-pie-chart.js"></script>
<script src="assets/scripts.js"></script>
</body>
I took these javascript files into the head section right before the body tag and I wrote a small function to call the modal popup:
<script src="vendors/jquery-1.9.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/easypiechart/jquery.easy-pie-chart.js"></script>
<script src="assets/scripts.js"></script>
<script type="text/javascript">
function openModal() {
$('#myModal').modal('show');
}
</script>
</head>
<body>
then I could call the modal popup from code-behind with the following:
protected void lbEdit_Click(object sender, EventArgs e) {
ScriptManager.RegisterStartupScript(this,this.GetType(),"Pop", "openModal();", true);
}
This is how I solved:
The Script function
<script type="text/javascript">
function LoginFail() {
$('#windowTitleDialog').modal();
}
</script>
The Button declaration
<asp:Button ID="LaunchModal" runat="server" Text="Launch Modal" CssClass="btn" onclick="LaunchModal_Click"/>
Notice that the attribute data-togle="modal" is not set.
The Server-side code in the LaunchModal_Click event is:
ScriptManager.RegisterStartupScript(this, this.GetType(), "LaunchServerSide", "$(function() { LoginFail(); });", true);
I hope this help you.
I assume, you are using one of jQuery modal plugins. In that case, I suspect, plugin code isn't initialized at the time it is called (which would be immediately after it is rendered into page). You have to postpone call to the function after plugin code is executed. Implementation for your case might look like this:
ScriptManager.RegisterClientScriptBlock(this, typeof(System.Web.UI.Page), "LoginFail", "$(function() { LoginFail(); });", true);
I have the same problem, tried to find online solution but i was unable to do so. I am able to call other javascript funcionts as you said from the code behind but when i add the modal js function the modal does not show up.
My guess is that the modal.('show') function is not being call because when i insepct in crhome the modal element the class is modal hide fade and not modal hide fade IN and other attributes stay the same.
A possible solution is to change those attributes from the code behind, i mean you can do what the js does from the code behind, possible not the best solution but i did not what else to do. By doing this i got the modal to show up with the background grey but could not make the effect to work.
I do this in the aspx page:
<asp:Panel ID="MessagePanel" runat="server" CssClass="hide" EnableViewState="false">
<div class="modal-header">
<asp:Button type="button" ID="btnClose" runat="server" data-dismiss="modal" Text="x" />
</div>
<div class="modal-body">
<h4>What's new in this version</h4>
... rest of bootstrap modal stuff....
</div>
</asp:Panel>
Then in code-behind to show the modal popup on any event such as page.load or a button click I just change the CssClass of the Panel:
MessagePanel.CssClass = "modal fade in"
No need for js or ScriptManager.
I'm not able to access the variable in my .js file
the code i have at the top of the page is:
<script type="text/javascript">
privilage = '<%=Session["privilage"]%>';
</script>
then i want to access privilage in my .js file.
i just want to alert this at the moment. would i be able to do this?
thanks
You have to store session Value in HiddenField.
After that You can Access the HiddneFieldValue in your JS
<script type="text/javascript">
document.getElementById('hdnField').value = '<%=Session["privilage"]%>';
</script>
Just use:
var privilage = '<%=Session["privilage"]%>';
or try:
alert(privilage);
It will display your Session value
I use it this way.
<asp:TextBox ID="txtValue" runat="server" CssClass="txtValue" style="display: none;" />
Then I use jQuery to access the value.
<script>
var txtValue = $(".txtValue").val();
</script>
Or even on a control.
<asp:LinkButton ID="lnkPrint" runat="server" CausesValidation="true"
CommandName="Print" CommandArgument='<%# Bind("PrintData") %>'
Text="<img src='/images/print_on.png' onmouseover='cursor: pointer;'
class='PrintButton' />" ToolTip="Print" OnClientClick="if ($('.txtValue').val()
!= '1') { $('.txtValue').val('1'); alert('Warning: Please enable pop-ups for
this site!'); }" />
This method survives ajax and postbacks.
Cheers
use
<script type="text/javascript">
var privilage = '<%=Session["privilage"]%>';
</script>
I have a web application, and the requirements need to show jquery lightbox as a confirmation message including some information.
After some research I found fancybox FancyBox Jquery Light box
I followed this step by step till I could show the required confirmation message in a fancy box, which is triggered by Open
I need to trigger or show the fancy box from code behind of an asp:button
I've searched a lot and all results that I got when applied did not work.
Can any one please show me a sample about triggering fancybox from code behind of asp button in c# and attach it here?
that is a sample of my code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery /1.7/jquery.min.js"></script>
<link rel="stylesheet" href="/source/jquery.fancybox.css?v=2.1.0" type="text/css" media="screen" />
<script type="text/javascript" src="/source/jquery.fancybox.pack.js?v=2.1.0"></script>
<script type="text/javascript">
$(".fancybox").fancybox({
openEffect: 'none',
closeEffect: 'none',
afterLoad: function () {
this.content = this.content.html();
}
});
</script>
<body>
<form id="form1" runat="server">
Open
<div id="test" style="display:none;width:300px;">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<input id="Hello" type="text" />
</td>
</tr>
<tr>
<td>
<input id="Button1" type="button" value="Press Here" />
</td>
</tr>
</table>
</div>
</form>
</body>
This code is work correctly and show the fancybox after click on open link
all my need is to show the fancybox after click on asp:button
Thanks in advance
To call javascript from Code Behind, you can do something like this in your button click event handler:
ClientScript.RegisterStartupScript(this.GetType(), "fancyBoxScript", "[JAVASCRIPT TO INVOKE FANCYBOX]", true);
This javascript will be sent to the page and executed after the post-back is finished.
Edit: You can find more information here about invoking FancyBox through javascript. It basically requires you to simulate a click on a hidden button: http://thingsilearned.com/2010/01/27/dynamically-calling-fancybox-from-javascript/
Make sure that you have a script tag for JQuery in your < head > like this:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
Also in the head, reference the script file themselves, along with the stylesheet like this (assuming you've copied the files to therootofyourwebsite/fancybox/source):
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.0" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.0"></script>
Then, at the bottom of your < body > (but still inside body) make sure you wire up fancybox, something like this:
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
If I understood correctly, you want to launch fancybox from a html button like :
<button id="newOpen" type="button">open fancybox from button</button>
....what it matters here is the rendered html button, via asp or any other programming language. Also notice that this button is not part of the form (opened in fancybox)
If the above is correct, since you already have the code to launch fancybox from the open link, then just add this piece of jQuery code :
$("#newOpen").bind("click", function(){
$(".fancybox").trigger("click");
});
Hai frnds , i want to show the message on button click....please help advance thanks
use javascript, set an click event and change the text of the button....
You mean like the javascript client-side handler?
onclick="alert('Hi there!')"
Try this code
<head>
<script type="text/javascript" language="javascript">
function message() {
alert("THIS IS A MESSAGE!!!");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<button onclick="message()">MESSAGE</button>
</div>
</form>
</body>
</html>
And you can try JQUERY DIALOG: http://jqueryui.com/demos/dialog/
You can use OnClientClick attribute to specify javascript that will runs before postback request
if you want change text on button:
<asp:Button Text="Click me!" runat="server" ID="TestButton" OnClick="TestButton_Click" OnClientClick="(this).value = 'new message'" />
if you want show message box :
<asp:Button Text="Click me!" runat="server" ID="TestButton" OnClick="TestButton_Click" OnClientClick="alert('message')" />
"display message in button click during postback" means i assume OP wants to show message based on condition at server side during click event of button in postback.
this can be achieved using method
Page.ClientScript.RegisterStartupScript(
Type type,
string key,
string script,
bool addScriptTags)
see complete code sample at http://msdn.microsoft.com/en-us/library/z9h4dk8y.aspx