accessing checkbox from asp.net formview in javascript - c#

I have a checkbox in my formview which I want to access in JS to do some enable/disable for textboxes.
This is what I have:
<script type="text/javascript">
$(document).ready(function () {
$('#<%=FormView1.FindControl("chkMap").ClientID%>').change(function () {
if ($(this).is(":checked")) {
}
$('#textbox1').val($(this).is(':checked'));
});
});
With this code, nothing happens and no error is shown in firebug console. Am I doing something wrong? Thanks, Laziale

I have a few guesses. The first one is probably wrong but I had to point it out. The code you posted does not have an end script (</script>) tag. You should check that first.
Second guess is, for some reason <%=FormView1.FindControl("chkMap").ClientID%> this might not be outputting the ID of that control. Have you tried to 'view source' of that page and made sure that the ID is as it should be? Maybe you've changed the ID of that checkbox or something.
Third guess is the way you reference the textbox (#textbox). This is an ASP.NET WebForms page. Your checkbox is a server control (<asp:CheckBox ... />). Are you sure you haven't created the textbox like <asp:TextBox runat="server" ID="textbox1" />? If you have, you would need to write the code like:
$('#<%=FormView1.FindControl("textbox1").ClientID%>').val($(this).is(':checked'));
to reference that textbox control via JavaScript.
I'm suggesting all these because the JS code works fine. I've created a JSFiddle and tested it.
Here's the fiddle. link

Related

ASP.NET C#: OnCheckedChanged event processing inside of UpdatePanel

While creating my login-form, I need a checkbox option, allowing user to show <asp:TextBox TextMode="Password"> input, or hide it back again, but it seems my <asp:CheckBox ID="chkShowPass"> does not process chkShowPass_CheckedChange event. I found an article on this topic (ASP.NET Checkbox.Checked is not working), where chkShowPass.AutoPostBack property set to true settles the problem.
When I have plain ASP.NET example to put <asp:CheckBox ID="chkShowPass"> in, I'm able to do that with no problem, but the key thing, I have now added <asp:UpdatePanel> element to prevent my website pages from auto-scrolling on button-clicks, and to make my good-basket UI (which lies in
Site.Master) update properly from those clicks.
What shall I do, to make my <asp:CheckBox ID="chkShowPass"> react to chkShowPass_CheckedChange event, but, still, keeping my Site.Master's content in <asp:UpdatePanel>? I will also appreciate, if you know any way to prevent page from upscrolling on click, without <asp:UpdatePanel>.
You can do it using jQuery. give id to Password Textbox and a checkbox
<script type='text/javascript'>
$(document).ready(function(){
$('#checkbox').click(function(){
if($(this).is(':checked'))
{
$('#password_id').attr('type', 'text');
}
else
{
$('#password_id').attr('type', 'password');
}
});
});
</script>
Remember to add jquery script in a page.
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

Change of code in browser

I'm using a drop down list for selecting customer, from that i need to remove the setTimeout which i shown in the image, i don't know from where to remove it..can any one suggest me from where it loads..my browser alone show the <select .. >, i need to know from where it loads..
<td><asp:DropDownList Width="180px" CssClass="select_quo_one" ID="ReceiverDropDown"
runat="server" AutoPostBack="true"
OnSelectedIndexChanged="ReceiverDropDown_SelectedIndexChanged">
</asp:DropDownList>
</td>
My Browser Code:
Seems to me you have a few choices -
1) Remove the AutoPostBack - this will stop the SelectedIndexChanged event firing but as you only seem to be popping up an alert you could probably recreate this client side.
2) Put the DropDownList in an UpdatePanel as explained to you in your other question, you may need to do a bit of debugging to get this working but should do what you want.
3) Accept the page reload - accept this is the trade-off when using Web Forms and leave as is.
4) Move to something like MVC which does not have the Postback model.
Sounds like you probably need to do some reading into Web Forms and look at the Pros and Cons and make an informed decision as at the moment you are trying to fight the framework rather than work with it.
The setTimeout is automatically generated by the DropDownList control because AutoPostBack is set to true.
From http://msdn.microsoft.com/en-us/library/system.web.ui.postbackoptions.autopostback(v=vs.110).aspx
The JavaScript setTimeout method is used with the _doPostBack method to ensure that the user action completes before the postback occurs.
Edit:
"flickering occurs in my page so i have to remove the setTimeout value.. – user3595072 17 mins ago"
The setTimeout itself is not (directly) causing the page flickering. The flickering is because the DropDownList is doing a postback every time it is changed bc AutoPostBack is set to true and this causes the page to refresh. If you are not doing anything server side immediately after a customer is selected (like loading other customer info on the page), then you can just set AutoPostBack to false. Otherwise you can look into using an UpdatePanel on your page, or use something like AJAX calls to do your processing without a full postback.
Edit 2:
Since you are only adding javascript within your AutoPostBack event, you can add a jQuery reference (if you do not have one already) by adding the following to your ASPX page:
<script src="//code.jquery.com/jquery-1.11.0.min.js" type="text/javascript"></script>
Then set AutoPostBack="false" on your DropDownList and add this javascript to accomplish the same thing that your AutoPostBack was doing:
<script type="text/javascript">
$(function () {
$('#<%=ReceiverDropDown.ClientID %>').on('change', function (e) {
var benId = $(this).val();
if (benId != '' && benId != '0') {
AddDetails(benId);
}
});
});
</script>

ConfirmButtonExtender doesn't cancel

I inserted this confirm button extender into my webpage. I have 2 option that is ok and cancel. When i clicked okay, it updates my database. But when i clicked cancel and also updates my database.
<asp:ConfirmButtonExtender ID="btnClear_ConfirmButtonExtender" runat="server" TargetControlID="btnClear"
ConfirmText="Are you sure you would like to update the following police report? The page will automatically refreshes if the report has been updated successfully"
OnClientCancel="CancelClick" />
I didnt enter any codes in my back-end side. So i guess the problem lies with the source code.
Source Link : ConfirmButtonExtender
Try to remove the OnClientCancel="CancelClick" and add Enabled="true".
It should work.
I believe OnClientCancel specifies a javascript function to call not server side method. Instead of the code you have for CancelClick, use this as a test in your HTML markup to see it in action:
<script type="text/javascript">
function CancelClick()
{
alert('called by javascript');
}
</script>
Now check that cancel button is still Updating or will show you the called by javascript message on alert.
Hope it clear and works for you.

Checkbox problems inside jQuery dialog and Repeater

So I've been basically beating my head against the wall on this for a while now. Excuse me if I throw up too much code here, don't know a better way to explain it. I've got a Repeater with an ItemTemplate of:
<ItemTemplate>
<div id='FileFrame<%#Eval("Id")%>' class="view">
<userControl:ConfigFiles ID=<%#Eval("Id")%> runat="server" />
</div>
</ItemTemplate>
Some jQuery that sets up the dialog box for the div.
$(document).ready(function() {
$(".view").dialog({
autoOpen: false,
title: "Configuration Files",
buttons: {},
height: 600,
width: 800,
open: function (type, data) { $(this).parent().appendTo("form"); }
});
});
and some more jQuery that opens the dialog.
$("#FileFrame"+ConfigId).dialog('open');
Now the User Control has a bunch of checkboxes inside of it inside other repeaters along with a "Download Checked Boxes" button. The problem is that when I go through debugging and click the button, none of the checkboxes are ever read as checked unless I initially set the Checked="true" on the aspx page.
Here's the a snippet from the code behind where it's failing to do what I thought it should do.
foreach (RepeaterItem item in FilesRepeater.Items)
{
CheckBox box = item.FindControl("DownloadFileCheckBox") as CheckBox;
if (box.Checked) //<-- always false unless I set it to true in aspx,
// then it's always true
{/*do work here*/}
}
Any suggestions?
I had similar problem ( postback doesn't populate control values) sometime back. The problem was generated dialog was outside the form tag.
Use
$("#FileFrame"+ConfigId).parent().appendTo($("form:first"));
or similar code to move the dialog code inside of form
Hope this will help.
Ok, I'm not 100% sure what exactly happened (which is scary) but the code now works. My intuition says that something, somewhere, was wrong with a piece of JavaScript and causing the browser to just abandon the following JS. Bottom-line is that the solution that I posted in the question does work.
I think the main problem was that there was a JS function that I was calling that wasn't being loaded or wasn't within the scope of where the call was being made. If I find out more I'll be sure to post it here.

hyper link to set drop downlist to visible

Wondering if there is a way upon clicking on a hyper link to set drop downlist to visible in code behind or asp?
<asp:HyperLink ID="HyperLink2" runat="server">View More Workout Programs »</asp:HyperLink>
If you have to do it in code-behind, then use a LinkButton instead of a HyperLink. Then it will have a click event just like any button and in that click event you can set the other element to .Visible=true.
However, does this need to be done in code-behind? Keep in mind the difference in "visibility" between server-side and client-side code:
If set to .Visible=false on the server-side, the content is not delivered to the client at all.
If set to display:none on the client-side, the content is present and can be viewed in the page source, it's just not displayed by the browser.
In some cases, the former is needed for security purposes. But if it's just a matter of user experience then I would recommend showing/hiding the content entirely on the client-side so as to avoid post-backs that do nothing more than change element display properties.
For example (assuming jQuery):
<a id="toggler" href="#">Show the content</a>
<div id="hidden" style="display:none;">Content</div>
<script>
$(document).ready(function(){
$("#toggler").click(function(){
$("#hidden").show();
});
});
</script>
Use an asp:LinkButton instead of a hyperlink and handle the OnClick event. In the OnClick event, toggle myDropDownList.Visible depending on whether you want to show it or not.
You should implement that kind of feature in the client (javascript code) to improve user experience.
Anyway, you can use a Panel with Visibility=false and put Visibility=true in code behind when link is clicked. You would need to adjust the position of that panel with css to look like a dropdown.
You can try with JQuery : http://www.jquery.com
It will be something like
<script type="text/javascript">
$(document).ready(function(){
$("#<% =HyperLink2.ClientID %>").click(function() {
$("#<% =DropDownList1.ClientID %>").toggle();
});
});
</script>
If you need to send form back to the server, use asp:LinkButton instead and handle OnClick event on the server side. If you need to show drop down list on the client side, use javascript function with onclick client event to show or hide any section you want.

Categories