Checkbox problems inside jQuery dialog and Repeater - c#

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.

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>

ASP.NET WebForms Confirm

I'm new to web programming with .NET.
I am developing a web page with webforms, and I want at a certain moment to programmatically show a modal window, for the user to accept or cancel, according to a question. Exactly what does the "confirm" function of JavaScript.
I tried to get it calling a JavaScript function:
Page.ClientScript.RegisterStartupScript (this.GetType (), "CallMyFunction", "MyFunction()", true);
But I need to do it without reloading the page, and I also need to control if the user has accepted or canceled and I do not know how to do it.
I've also tried getting it using the ModExPopupExtender control from DevExpress.
Can someone tell me a simple way to get what I want?
I can not understand how something so usual in web programming, and that PHP + javascript would not pose any problem can be so complicated.
All start in a one-button event on the code behind:
protected void btn1_Click(object sender, EventArgs e)
{
//I make a series of checks
//If certain conditions I want to show the confirm
//According to the user has chosen ok or cancel will perform a certain action
}
Onclientclick does not help me because before launching the "confirm" I have to do some checks on the server side.
Thank you very much.
You can use OnClientClick which is a property on most web controls.
I like to just bring up a simple confirm() dialog which executes the server code if the user clicks OK and does nothing if the user cancels the action:
<asp:Button runat="server" ID="btnSave" Click="btnSave_Click" Text="Save"
OnClientClick="return confirm('Are you sure you want to do this thing?');" />
You can do other things with it as well, but the key thing to remember is that anything you do in OnClientClick will happen before the page gets posted back to the server.
This is also perfectly valid:
<asp:Button runat="server" ID="btnSave"
OnClientClick="showModalConfirm('some message goes here');" ... />
<script>
function showModalConfirm(msg)
{
$(".modal .message").innerHtml(msg);
$(".modal").Show();
}
</script>
You can set the action that OnClientClick should perform in your codebehind in exactly the same way:
protected void Page_Load(object sender, EventArgs e)
{
btnSave.OnClientClick = "return confirm('Are you sure you want to do this thing?');";
}
You can use below code in c# to call javascript function. Below code will execute afterpostback() javascript function:
ClientScript.RegisterStartupScript(GetType(), Javascript, "javascript:afterpostback();", true);
And you can write code in javascript function to display any div or popup:
<script language="javascript" type="text/javascript">
function afterpostback() {
//Here you can write javascript to display div/modal
}
</script>
One way I've handled this previously was to have 2 buttons on the page. The first would be initially visible and labeled "Submit". The second would be initially hidden and labeled "Confirm". The "Submit" button would postback upon click and perform your server side checks/validation. If those checks failed, an appropriate error message would be displayed. If those checks passed, an appropriate "Please confirm your submission"-type message would be displayed, the "Submit" button would become hidden, and the second "Confirm" button would become visible. When that Confirm button was clicked, it would postback again and fully submit.
EDIT: I forgot to mention, there's a bit more to this that occurred to me after I initially posted. You'll have to protect the fields from being edited in the event the server-side verification is successful as you obviously don't want the user changing values and then clicking the Confirm button. That means disabling all the input controls - which could be a pain if you have a lot. You also have to give them a way to (intentionally) Edit in case the server side verification passes, you display the Confirmation, and they change their minds - so basically you'd need a third "Cancel/Edit"-type button that would put the form back in edit mode and show your initial Submit button.

accessing checkbox from asp.net formview in javascript

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

jQuery UI class dissapears on button even though .button() is set in codebehind?

Im starting to pull my hair over this.
Im trying to append jQuery UI's button appearance on my regular button, however it doesn't get appended. Doesnt even get a class..
<asp:UpdatePanel ID="CartUpdPanel" UpdateMode="Conditional" ChildrenAsTriggers="true" runat="server">
<button runat="server" ID="CheckoutCartButton" CausesValidation="False" EnableViewState="False">Checkout</button>
<Triggers>
<asp:PostBackTrigger ControlID="CheckoutCartButton" />
</Triggers>
</asp:UpdatePanel>
I want the button to have a secondary icon. I usually know how to make this happen. But I'm running into problems..
This is the checkout button for my cart (I had the disabling working fine before I wanted to make it look fancy), and in the code behind it checks if you have enough credit to checkout or not, enabling/disabling the button.
I cant create the button in a in the ascx file because it will over-write the disabling of the button, making it enabled:
ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), "disable button", "console.log('disabled'); $('#" + CheckoutCartButton.ClientID + "').button({ icons: { secondary: 'ui-icon-circle-arrow-e' }, disabled: true });", true);
I've tried using the updatepanel's id as control, but to no further success. And while writing this I thought it was a page-life cycle problem, since the cart credit is being checked OnInit. But even though I changed it to PageLoad, no difference.
Any wise people out there see my problem?
You're just attaching to the wrong method.
Instead of ScriptManager.RegisterClientScriptBlock, use ScriptManager.RegisterStartupScript.
Also, enclose your script with $(function () { }) so it will be executed when the page is fully loaded.
Should solve your problem.

Want to show a message box using javascript

Hi everyone I have a web form in which I am having a button on clicking which data back up is being taken, I used the following javascript :
<script language="javascript" type="text/javascript">
function showPleaseWait() {
document.getElementById('PleaseWait').style.display = 'block';
}
</script>
<asp:Button ID="btnTakebackup" runat="server" Text="Take Backup" Enabled="true"
onMouseDown="showPleaseWait()" CausesValidation="false" />
<div id="PleaseWait" style="display: none;">"Please Wait Backup in Progress.."</div>
Hi I am using a button to take a back up.
Now I want to show a message in btnTakebackup_Click() event, whether Back up was successful or not.
I used Response.Write("<script>alert('abcd');</script>"); in btnTakebackup_Click() event.
But the problem is that I want to show the page also, which is not showing instead white background is showing.
Thanks in advance...
To show a message box alert should be able to write out a new script to the response stream:
var script =
"<script type=\"javascript\">" +
"alert(\"Backup in progress, don't go!\");" +
"</script>"
Response.Write(script);
However much this is distasteful, I suppose it is sometimes "necessary".
You can add client side event handlers to ASP controls:
How to: Add Client Script Events to ASP.NET Web Server Controls
Cheers.
Do you really want it to be an alert? (You should know that they lock up the whole browser not just the tab your page is on), do your users really need to acknowledge the backup success by clicking ok or just be informed of it?...
I suggest you have a div on the page that says "Backup successful". The visibility of which can be set by a boolean property BackUpSuccess which you can set to true in the code behind you mention.
<div id="backUpSuccess" <%=BackUpSuccess ? "" : "style='display:none;'"%>>
Backup was successfull
</div>
...you can style the div as you like in your .css file to get attention.
If you really do want an alert you could run some JavaScript on page load to check the content of a hidden input that you set server side in similar fashion...but running javascript on page load is tricky...unless your using jQuery and then you will know it's very easy.
From your question, I understood that after clicking on the button, the data back up is happening, but the alert is not displaying as soon as you clicked the button.This is because you are calling the JavaScript in the button click event which will be fired only after all the code in the button click is executed.I suggest you to add a JavaScript function in the .aspx source page it self and call the JavaScript function as shown below:
<script ...>
function xyz()
{
alert('Please Wait');
}
</script>
and in button declaration
<asp:button id='btn_submit' runat="server" OnClientClick="return xyz();" />

Categories