how to call jquery function call in asp.net c#? - c#

I want to show division for 5 seconds while i do every postback in c#.I am using below function to do that but it doesn't work.
I used this code on page load in c#.
Page.ClientScript.RegisterStartupScript(Page.GetType(), "PostbackClick", "setTimeout(function() { $('#correct').fadeOut(1500); }, 5000)", true);
in aspx page
<script type='text/javascript' src='Scripts/scripts/jquery.min.js'></script>
<script type="text/javascript">
$(document).ready(function () {
$('#correct').hide();
});
</script>
<img alt="" id="correct" src="Que-img/correct.png" />

use
RegisterClientScriptBlock(Page.GetType(), "PostbackClick", "$(document).ready(function(){
setTimeout(function() { $('#correct').fadeIn(1500); }, 5000)});", true)
Because you have to wait for JQuery.ready before using jquery selectors. RegisterStartupScript actually happens before jquery ready.
in my answer your setTimer will executed on jquery ready

You already hiding the image in document.ready function
<script>
$(document).ready(function () {
//$('#correct').hide(); // remove this line or comment
// because fadeOut will work on visible elements
function hideImage() {
setTimeout(function() { $('#correct').fadeOut(1500); }, 5000);
};
});
</script>
In C#
Page.ClientScript.RegisterStartupScript(Page.GetType(),"PostbackClick", "script",
"hideImage();" true);
How to Call Jquery from C# will help you

I guess i got your issue ...Modify your code as below
$(document).ready(function () {
$('#correct').hide();
$('#btnId').click(function(){
$('#correct').show();
setTimeout(function() { $('#correct').fadeOut(1500); }, 5000);
});
});
and remove
Page.ClientScript.RegisterStartupScript(Page.GetType(), "PostbackClick", "setTimeout(function() { $('#correct').fadeOut(1500); }, 5000)", true);
Here is the demo

Related

How To Use ViewBag Data In jQuery

Here I have ViewBag in a controller which contains text i.e ViewBag.Msg = "No Sprint".
And I am trying to use ViewBag.Msg in Jquery to display modal.
Now, the problem is that the script is script never gets executed.
Below is my jQuery.
<script>
$(document).ready(function () {
debugger;
if (#ViewBag.Msg != null)
{
$("#myModal").modal();
}
});
</script>
Any help will be highly appreciated. Thank You.
You need to use quotation marks for the view bag, as it will appear as a literal string.
If your debugger is not hitting at all, then you have another issue, post your full code. (your .cshtml file and layout)
<script>
$(document).ready(function () {
debugger;
if ('#ViewBag.Msg' != null)
{
$("#myModal").modal();
}
});
</script>
Please use the below code.
<script>
$(document).ready(function () {
debugger;
var msg='#ViewBag.Msg';
if (msg !== '')
{
$("#myModal").modal();
}
});
</script>

jQuery function not getting called from C# code behind with RegisterStartupScript

I have a jQuery function:
<script src="Scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
alert("1");
function hideInfo() {
alert("2");
$("#h3memberInfo").fadeOut("slow");
};
});
</script>
I am trying to call above function from c# as below.
ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "alert", "hideInfo();", true);
On page load I get alert("1") but alert("2") is never triggered.
What wrong am I doing?
As your function hideInfo() is wrapped inside the $(document).ready block, its not available in the global scope as you try from the code behind.
You can modify your code as below,
<script src="Scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
function hideInfo() {
$(document).ready(function () {
alert("1");
$("#h3memberInfo").fadeOut("slow");
});
}
</script>

Function call from code behind

How to i calling jQuery function from code behind after button click...
<script>
$(document).ready(function () {
$(".chkOther").change(function () {
//console.log($(this).find("input[type=checkbox]").is(":checked"));
if (!$(this).find("input[type=checkbox]").is(":checked")) {
$(this).closest(".frome_group").find(".cleartxt").val("");
//$(this).closest(".frome_group").find(".cleartxt").attr('readonly',true);
}
else {
//$(this).closest(".frome_group").find(".cleartxt").removeAttr('readonly');
$(this).closest(".frome_group").find(".cleartxt").focus();
}
});
function successMessage() {
$("#successModal").modal('show');
}
function errorMessage() {
$("#errorModal").modal('show');
}
});
</script>
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "successMessage", "successMessage();", true);
The Problem with your question
You are asking, how to call a javascript action after button click. But additionally, you want to call it from code behind? Why do you not call it after clicking your button?
Please be sure to understand the HTTP client-server architecture before asking such questions.
Maybe you mean this?
Since you didn't specify the result you are aiming for, I have to assume that you want to call successMessage() or errorMessage() after finishing a Server request. You would do something like this using AJAX:
$.ajax({
url: "/API/Controller/Method",
success: function () {
successMessage();
},
error: function () {
errorMessage();
}
});

JQuery get value from .resx file

When I change my dropdown list, I want change a label (lblCustomer).
I don't know how to get value from resource file.Any ideas!?
.text('"<%$ Resources:lblCustomer%>"'); this not work. 10x
$(function () {
$('#<%= ddlCustomer.ClientID %>').change(function ()
{
$('#<%= lblCustomer.ClientID %>').text('"<%$ Resources:lblCustomer%>"');
})
}
);
I had similar problem to this. What I end up doing is registering a startup script that reads the values from the .resx file into a variable in javascript. Then I just reference the javascript variables as I need to.
C# Code:
StringBuilder colModel = new StringBuilder();
colModel.AppendFormat("var uiStrings = {{ captureStart: \"{7}\", captureOK: \"{0}\", captureRegister: \"{1}\", captureBad: \"{2}\", captureRegisterBad: \"{8}\", gridTitle: \"{3}\", gridIsCap: \"{4}\", gridNoCap: \"{5}\", gridDelete: \"{6}\", captureDiffUser: \"{9}\" }};",
this.GetLocalResourceObject("capOK").ToString(), this.GetLocalResourceObject("capRegisterOK").ToString(), this.GetLocalResourceObject("capBad").ToString(),
this.GetLocalResourceObject("gvCaption").ToString(), this.GetLocalResourceObject("gvIsCaptured").ToString(), this.GetLocalResourceObject("gvIsNotCaptured").ToString(),
this.GetLocalResourceObject("gvDelete").ToString(), this.GetLocalResourceObject("capStart").ToString(), this.GetLocalResourceObject("capRegisterBad").ToString(),
this.GetLocalResourceObject("capDiffUser").ToString());
ClientScript.RegisterStartupScript(this.GetType(), "initData", colModel.ToString(), true);
JavaScript:
$("#status").html(uiStrings.captureDiffUser);
Hope this helps!
You can use the GetGolabalRessourceObject Function.
$(function () {
$('#<%= ddlCustomer.ClientID %>').change(function ()
{
$('#<%=lblCustomer.ClientID%>').text('<%=GetGlobalResourceObject("lblCustomer")%>');
})
}
);

how to add javascript to an Asp.net MVC app

I am building an Asp.net MVC app and would like to add a datepicker.
I have this code in my form in the view
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
and I would like to add this javascript to it to enable to datapicker:
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
however when the application is run it shows the above code as text on the page.
How do I get it to recognize it as javascript?
Use script tag
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
wrap your code with script tags
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>

Categories