I using bootstrap and i want to use that; http://getbootstrap.com/javascript/#buttons-stateful
<asp:Button ID="Button1" runat="server" Text="Send It" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off" />
<script>
$('#Button1').on('click', function () {
var $btn = $(this).button('loading')
$btn.button('reset')
})
</script>
But it doesn't work. what can i do to work this?
When an ASP.NET control is rendered, it's assigned a new ID. If you do an inspect element on your button, you'll notice it's ID is actually not Button1. Because of this, your $('#Button1') selector is not finding anything.
If you're using a version of ASP.NET that supports it, you can put clientIDMode="static" on your button to keep the ID from changing.
If not, you can get the client ID by replacing $('#Button1') with $('#<%=Button1.ClientID%>')
Make sure jquery is loaded
Make sure boostrap css is loaded
Make sure bootstrap javascript is loaded
It looks like when your button is loaded it is immediately reset. Trying have the button load in the before step in an ajax request. Then put the rest in the complete step of the ajax step. This way you can see it working.
Related
I have a problem. I'm running a postback event onchange in web form control using postback.
<asp:DropDownList OnSelectedIndexChanged="UpdateCollection" AutoPostBack="true" ID="BookCategorySelection"/>
The asp generates something like
<select id="..." onchange="javascript(__DoPostBack(...)); ">
and I would like to add something after the postback
<select id="..." onchange="javascript(__DoPostBack(...)); MyFunction();">
I need to add a call in javascript to refresh some calculations that are done in js after this postback is done. Anyone has any idea? I tried adding it in backend in OnPrerender method of control, but still it's added before the javascript generated callback. I tried also in jQuery but no help.
The solution may be to use pageLoad
function pageLoad(){ }
it will be called on each postback
I'm really stuck and I've tried all the other examples but nothing works. I'm fairly new to ASP.NET but learning fast!
I want to use the jQuery datepicker and I am inserting this script
<script>
$(document).ready(function () {
$(function () {
$("#" + '<%=txtDOB.ClientID%>').datepicker();
});
});
</script>
and my control on the aspx page is
<asp:TextBox ID="txtDOB" CssClass="form-control" runat="server"></asp:TextBox>
As soon as I close the the server tag %> the red line appears under the txtDOB control and says:
txtDOB is not declared. It may be inaccessible due to its protection level.
I've made the class public in the code behind but doesn't make any difference. I've also moved the script to the bottom of the page. If I change the asp textbox to a HTML input it works fine.
It will work fine with an ASP.NET TextBox as you have used. Therefore it must be to do with where your control is located. For example, if it's inside a Repeater or Grid, you will not be able to use its ID directly like that, since the framework will generate unique ids for each row at runtime.
Create a simple webform with no other controls on the page, and you will find it works just as you have it.
Try using static ID mode instead:
<script>
$(document).ready(function () {
$("#txtDOB").datepicker();
});
</script>
It makes the client script easier (especially when you move it to an external .js file to take advantage of caching), and is an easy change to the ASP control:
<asp:TextBox ID="txtDOB" CssClass="form-control" runat="server" ClientIDMode="Static"/>
You could use a different type of jQuery selector to select for that ID as follows:
<script>
$(document).ready(function () {
$("input[id$=_txtDOB]").datepicker();
});
</script>
That selector will account for the text that is being appended to the beginning of your ID due to the use of your CreateUserWizard control. It is cleaner than the way you are currently doing it, and you can use your original HTML.
<asp:TextBox ID="txtDOB" CssClass="form-control" runat="server"></asp:TextBox>
I was trying to call a function when the checkbox status changes, it calls without a masterpage. I have tried the following code:
<script type="text/javascript">
$(function () {
$('#cbOption1').on('change', PublishToPreferredZerker);
});
function PublishToPreferredZerker() {}
</script>
[...]
<asp:CheckBox ID="cbOption1" runat="server" style="text-align: left"
Text="Publish the job to particular Zerker or a group of the Zerkers." /><br />
The function is not called when using MasterPage.
Note cbOption1 is not the client ID, but the ID for the server side.
You need to do something like (Use Control.ClientID Property to get the id for HTML element):
$('#<%=cbOption1.ClientID%>').on('change', PublishToPreferredZerker);
The code
$('#cbOption1').on('change', PublishToPreferredZerker);
finds the control with id cbOption1 and then acts on that control
But when using this code on a master page, the control id does not remain cbOption1.
It is prefixed by master page content Id.
something like ct$001cbOption1
To make it work when using master pages use code like this to find the clientId for the control :
$(#"<%= cbOption1.ClientID %>").on( .... )
I got success while I added below code on Page load function.
cbOption1.Attributes.Add("onChange", "javascript:PublishToPreferredZerker()");
Javascript function
function PublishToPreferredZerker() {}
Also I have tried above answers but not get required output.
Thanks,
I am facing a problem with buttons.
I want a client side validation to occur(say selecting a maximum of only 4 checkboxes in a datalist).
I used a INPUT TYPE="BUTTON" RUNAT="SERVER" style of tag. and put Onserverclick="someservermethod" which works fine.
I wrote a Validate() and added onclick="return validate();" to the above HTML markup and was thinking if it returns false then my server side code someservermethod() would not execute and it works great as expected
But when I return true I thought it would fire my someservermethod(), but it is not working. Any thoughts on why it is not working?
HTML MARKUP BELOW FOR THE BUTTON
button onclick="return ValidateSelection();" type="button" id="btnSubmit"
runat="server" onserverclick="btnSubmit_Click"
JAVASCRIPT CODE
function ValidateSelection()
{
if(good)
{
// I expect that my server side code btn_Submit would have got called. But
// it doesn't get called.
return true;
}
else
{
//This works great. Not calling the server side method for the button
alert('something happened');
return false;
}
}
I think I am messing up with the formatting. Pardon me.
The control you are using right now it HtmlButton which is not "fit" for what you are trying to do, as your onclick overwrites the required client side code for the post back.
What you need is the Button control which does support overwriting the client side onclick and still perform the post back as usual.
Change the markup to this and it should work:
<asp:button OnClientClick="return ValidateSelection();" id="btnSubmit" runat="server" OnClick="btnSubmit_Click" Text="Submit"></asp:Button>
I am reading an xml file using javascript and then I need to submit my form so that it calls a particular method in my JSF handler. Usually this can be done on a jsp when user clicks a button by having an actionlistener like so:
<h:commandLink styleClass="button" action="#{myHandler.outcome}" actionListener="#{myHandler.doNext}">
<span><h:outputText value="#{text.button_submit}" /></span> </h:commandLink>
I am not sure how to call a method like 'doNext' above in the handler from javascript. I cannot do a simple:
document.form.submit();
as it then repeats the processing i have already done. I want to read values from an xml file and then call a particular method in handler. Any ideas much appreciated.
I found a solution to this. I added a hidden button to my jsp like:
<p id="hiddenButton" style="display:none;" >
<h:commandLink id="hiddenRegButton" styleClass="button" action="#{myHandler.doNext}" />
</p>
and in my javascript I used jQuery to execute the click which leads t the "doNext" method in my Handler to get executed.
jQuery('#hiddenRegButton').click();
this was easier than I thought.