so i have a lightbox in which pops up an aspx page with textboxes and two buttons (submit - disabled and cancel - enabled). I wanted to enable my submit button ontextchange. it works fine when opened separately (not as a lightbox) but when i let it run normally with the lightbox function everytime ontextchange gets triggered the whole page refreshes disabling the lightbox.
<asp:TextBox ID="textBox1" runat="server" OnTextChanged="OnTextChanged_AttributesEdited" autopostback="true">
protected void OnTextChanged_AttributesEdited(object sender, EventArgs e)
{
btnSubmit.Enabled = true;
}
now if i take out the "autopostback=true" it then will not trigger the the ontextchanged. was wondering if is it better if javascript will be the way to go for enabling the button or is there a way where i can prevent the postback when ontextchanged is triggered?
thanks a lot!
I think this would be a prime use for some jQuery in your application. Without posting back to the server for enabling / disabling a button, this would look a lot smoother, load faster and keep your current page state intact. An example might be as follows:
<script type="text/javascript">
$(document).ready(function() {
$("#textBox1").change(function() {
$("#btnSubmit").removeAttr("disabled");
});
});
</script>
Just put the above script tag in your HTML, just before closing the body tag.
An even better solution, however, would be to assign a specific CSS class to all the textboxes that should inherit that behaviour. Assuming that you assign a CSS class called "someCssClass" to all those textboxes, your script would then look something like this:
<script type="text/javascript">
$(document).ready(function() {
$("input.someCssClass").change(function() {
$("#btnSubmit").removeAttr("disabled");
});
});
</script>
I'd use jQuery as mentioned by #FarligOpptrenden, but if you don't have it and just want plain javascript, this should work.
Input within your lightbox:
<input type="text" id="textbox" onKeyUp="enableSubmitButton()" />
<input type="button" id="submitButton" value="Submit" />
<input type="button" id="cancelButton" value="Cancel" />
Javascript:
<script type="text/javascript">
function enableSubmitButton()
{
document.getElementById('submitButton').disabled = false;
document.getElementById('cancelButton').disabled = true;
}
</script>
You could also do your enabling/disabling buttons on load in javascript:
<script type="text/javascript">
window.onload = function () {
document.getElementById('submitButton').disabled = true;
document.getElementById('cancelButton').disabled = false;
}
</script>
Related
I'm creating an online application form.
In front page, There are First Name, Last Name, Email etc... form inputs. What I want is that
if user fills the form and click on the submit, I want to show him the print preview page with values which user filled... Is it possible? I'm using ASP.Net C#
If you can use jquery this code is good
$(document).ready(function () {
window.print();
});
and you can see these
http://www.designplace.org/tutorials.php?page=1&c_id=27
http://www.alistapart.com/articles/goingtoprint/
https://web.archive.org/web/20211029043752/https://www.4guysfromrolla.com/webtech/061103-1.shtml
If you can use javascript, then try this
<script type="text/javascript">
function CallPrint(strid) {
var prtContent = document.getElementById(strid);
var WinPrint = window.open('', '', 'letf=0,top=0,width=850,height=800,toolbar=0,scrollbars=1,status=0');
WinPrint.document.write('<html><head><title>Popup</title>')
WinPrint.document.write('</head><body>');
WinPrint.document.write('</body></html>');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
}
</script>
Take a print button on the page
<input id="btnPrint" type="button" value="Print" runat="server"
onclick="javascript:CallPrint('divPrint')"/>
and Place your Controls which are to be printed within a div
<div id="divPrint">
//Your controls
</div>
I'm trying to access some page HTML to use for an email in a Button_Click event.
I cannot set this content easily anywhere else at runtime (Such as in a TAG).
So I'm wondering if I can use JQuery to set a variable to .innerHtml(), and pass that in the button click. How would I go about doing this?
Something like this...
<div id="myDiv">
some content...
</div>
<asp:HiddenField ID="hdnHtml" ClientIDMode="Static" runat="server" />
<script type="text/javascript">
$(function () {
$('#hdnHtml').val($('#myDiv').html());
});
</script>
To add a hidden field to a form: fill its value using javascript/jQuery and submit the form via a Button_Click event.
I would like to have a nice pop up warning that says "Are you sure you want to overwrite this file? Yes No. Is there any way to do this with telerik or Ajax Tool Kit?. I want to be able to control it on the server side too with c#
Thank you
one way could be
1) create a div like a popup
2) display the popup when some events occurs (like button click)
3) if users click ok then doing somethings on server side
4) if users click no then hide the div
Here some code, sorry if there is some error but i don't have the environment on my hands.
<head>
<script type="text/javascript">
function showConfirm()
{
var popup = document.getElementbyId('popup');
popup.style.display = '';
}
function hide()
{
var popup = document.getElementbyId('popup');
popup.style.display = 'none';
}
</script>
</head>
<body>
<form runat="server" id="form1">
<div id="popup" style="display:none">
<p>bla bla bla</p>
<asp:button id="btn_ok" runat="server" OnClick="ServerRountine_Click"/>
<asp:button id="btn_ko" runat="server" onclientclick="hide();"/>
</div>
<asp:button id="btn_overwrite" runat="server" onclientclick="showConfirm();"/>
</form>
</body>
You can try:
jConfirm(message, [title, callback])
http://abeautifulsite.net/blog/2008/12/jquery-alert-dialogs/
You can put an OnClick (or OnClientClick if it's a serverside control) event on your submit button like the following:
<input type="button" value="Submit new file" onclick="if(confirm('Are you sure you want to overwrite this file?')) return false;" />
I'd prolly use asp modalpopup for this ;p
... but yeah you want to do it with ajax etc.
I think you'd love jq-ui then.
It is almost the same as above , but it will style the popup at the same time;p
$("#modEdit").dialog({//modEdit is your Div with any controls.
autoOpen: false,//Properties
width: 600,
show: "fade",
hide: "fade",
modal: true,
buttons: {//Buttons
"Save Changes": function () {
ModSaveChanges();
$(this).dialog("close");
},
Cancel: function () {
$(this).dialog("close");
}
}
});
Syntax looks in short like this $(control).dialog({properties,buttons:{btn1,btn2}}); etc
really easy, I really recomend it ^^ :D
I have used it for my Mobile Apps;p
Oh and you might also then take a look into Sencha Ext ;p
I am trying to use ReCaptcha from Microsoft.Web.Helpers. If I load the entire page it renders correctly, but if I load the page with an ajax request it disappears.
Example (/home/index)
<div id="bla">
#Ajax.ActionLink("reload with ajax", "index", new AjaxOptions() { UpdateTargetId = "bla" })
#ReCaptcha.GetHtml(publicKey: "xxx")
</div>
If I enter /home/index the captcha appears. If I click the button reload with ajax the ReCaptcha disappears...
The page is loaded for the first time
reload with ajax was clicked, the contents of the page change to /home/index, in other words, the entire page reloaded asynchronous and the captcha is gone
Is there a way to fix this or a decent captcha helper for MVC 3?
I've replaced the helper with javascript. ReCaptcha script
<div id="captcha"></div>
<input type="submit" value="Send" />
<script type="text/javascript">
Recaptcha.destroy();
Recaptcha.create("publicKey", "captcha", {});
</script>
And the Controller is still the same
if (ReCaptcha.Validate("privateKey"))
{
}
So when it loads the view partially it executes this scripts and render correctly every time.
Thanks for the help #Bala R
I faced the same issue and the quickest solution i found is using what it is proposed above and add to it this part of code in the top of your page within the handler "EndRequestHandler" proposed by the .net javascript api ( http://msdn.microsoft.com/en-us/library/bb311028(v=vs.100)).
With this solution the backend validation always works.
Here is the code I've used :
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
if (Recaptcha != null) {
Recaptcha.destroy();
Recaptcha.create("public_key", "captcha", {});
}
}
</script>
I hope this could help someone...
I have the following ASP.NET markup:
<div id="myForm" title="My Form" style="display: none">
<span>You can see me!</span>
<div style="display: none">
<asp:Button ID="btnSave" runat="server" Text="Button"
OnClick="btnSave_Click" />
</div>
</div>
<!-- called by an element click event elsewhere -->
<script type="text/javascript" language="javascript">
$("#myForm").dialog({
modal: true,
width: 500,
height: 200,
resizable: false,
buttons: {
"Cancel": function () {
$(this).dialog("close");
},
"Save": function () {
$(this).dialog("close");
// I want to call btnSave_Click (by DOM-clicking the button?)
}
}
});
$("#myForm").parent().appendTo("form:first");
</script>
I'm trying to get the jQuery.dialog generated buttons to perform the postback in place of the ASP.NET button. What should I do to make the button do a submit and call the btnSave_Click method?
EDIT
"Save": function () {
$(this).dialog("close");
document.getElementById("<%=btnSave.ClientID %>").click();
}
... works but is this the best solution?
$("#<%=btnSave.ClientID %>").click();
You can use the btnSave.ClientId property to emit to the javascript the ID of the control you are looking for, then you can do something like this. This is if you want the btnSave control to register as a postback control, triggering the "Click" event in the code behind.
var myControl = document.getElementById('theclientidgoeshere')
myControl.click();
That will do it!
If you want to do a simple postback you can do
this.document.form.submit();
but that will NOT register any events for the button.
Is This Best?
For .NET 3.5 and earlier it is the only "truly" safe ways to get the client ID. With jQuery you could do a partial id match on _btnSave, but I find that that is too risky for future modifications.
.NET 4.0 does introduce an option that might help.
.NET 4.0 ClientIDMode Property
In .NET 4.0 you have an optional ClientIDMode Property that will allow you to choose how the client id is created. You can use Predictable or Static options to allow you to hard-code the id of the button into your JavaScript.