Develop Reference

Why does not the CommandArgument of a button inside a ModalPopupExtender with AsyncFileUpload work?

I've been trying for a while to find out the reason why the CommandName of a button does not work, in truth I always throw it empty when entering the onCommand event and even onClick of the same button despite putting the property with a value, the strange of the case is that I can not modify the property and putting the property CommandName works without problem the first time, however it is impossible for me to modify its value.
To start I have a ModalPopupExtender together with a Panel which has a series of TextBox and an AsyncFileUpload with a series of buttons, it is necessary to bear in mind that I am working on an ASPX form, son of a MasterPage:
<cc1:ModalPopupExtender ID="mpEditUser" runat="server" PopupControlID="pnEditUser" TargetControlID="lbShowEditUser"
CancelControlID="lbCloseEditUser" BackgroundCssClass="modalBackground">
<Animations>
<OnShown>
<FadeIn Duration="0.40" Fps="30" />
</OnShown>
<OnHiding>
<FadeOut Duration="0.40" Fps="30" />
</OnHiding>
</Animations>
</cc1:ModalPopupExtender>
<asp:Label ID="lbShowEditUser" runat="server" Text="" style="display:none;"></asp:Label>
<asp:Label ID="lbCloseEditUser" runat="server" Text="" style="display:none;"></asp:Label>
<asp:Panel ID="pnEditUser" runat="server" ClientIDMode="Static" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">
Modify User
</h4>
</div>
<div class="modal-body">
<asp:UpdatePanel ID="upEditUser" runat="server">
<ContentTemplate>
<p>Message</p>
<div class="form-group">
<label for="txtEditUser">Code</label>
<asp:TextBox ID="txtEditUser" runat="server" CssClass="form-control" ClientIDMode="Static" Enabled="false"></asp:TextBox>
</div>
<div class="form-group">
<label for="txtEditNameUser">Name</label>
<asp:TextBox ID="txtEditNameUser" runat="server" CssClass="form-control" ClientIDMode="Static" Enabled="false"></asp:TextBox>
</div>
<div class="form-group">
<asp:UpdatePanel ID="upX" runat="server">
<ContentTemplate>
<label class="">CV User</label>
<div class="input-group">
<label class="input-group-btn">
<span class="btn btn-primary">
Upload<cc1:AsyncFileUpload ID="fuCVUser" runat="server" class="form-control" style="display:none;" ClientIDMode="Static" OnUploadedComplete="fuCVUser_UploadedComplete" />
</span>
</label>
<input type="text" class="form-control" readonly disabled>
</div>
<span class="help-block">
<div class="form-inline">
<div class="form-group">
<asp:Button ID="btnDownloadCVUser" runat="server" CssClass="btn btn-default" ClientIDMode="Static" CommandArgument="Test" OnCommand="btnDownloadCVUser_Command" Text="Download" />
</div>
</div>
</span>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="modal-footer">
<asp:UpdatePanel ID="upControlsEditUser" runat="server">
<ContentTemplate>
<asp:Button ID="btnCloseEditUser" runat="server" AutoPostBack="true" CausesValidation="true" Text="Close" class="btn btn-default" data-dismiss="modal" OnClick="btnCloseEditUser_Click" aria-hidden="true" />
<asp:Button ID="btnEditParticipant" runat="server" AutoPostBack="true" CausesValidation="true" Text="Update User" class="btn btn-primary" data-dismiss="modal" OnClick="btnEditUser_Click" aria-hidden="true" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
</asp:Panel>
Event onCommand:
protected void btnDownloadCVUser_Command(object sender, CommandEventArgs e)
{
string x = e.CommandArgument; <- (this value is always "")
}
To get out of doubt, I decided to put the "btnDownloadCVUser" control out of the Panel
............
</asp:UpdatePanel>
</div>
</div>
</div>
</asp:Panel>
<asp:Button ID="btnDownloadCVUser" runat="server" CssClass="btn btn-default" ClientIDMode="Static" CommandArgument="Test" OnCommand="btnDownloadCVUser_Command" Text="Download" />
This worked successfully on the CommandArgument, that is, I could see its assigned value on the label and manage to modify its value.
I tried to put UpdatePanel together with the AsyncFileUpload in such a way that it encloses the "from-group" with the triggers but I keep presenting the same problem. It's very strange because I have a button that does exactly the same thing but it's NOT in a MomalPopupExtender
Why does this happen?
Does ModalPopupExtender or AsyncFileUpload have something to do with the problem?
Does the level of the "form-group" have anything to do with it?
So far the only lifeguard I have is to use ViewState, but I'm still intrigued by the reason that causes my problem :(
Update 01:
I have noticed that the reason seems to be the method with which I load the files (AsyncFileUpload), apparently if I try to change a variable for this it turns out that it is as if I did not, but it allows me to upload the files without problem. Is there any solution?
private int a = 0;
protected void fuCVUser_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
a = 10; < - The value changes to '10' but if I enter the event of another button of the ModalPopupExtender the value is still '0'
}

After seeing this question:
Persisting variable after AsyncFileUpload call to OnUploadedComplete
I have come to the conclusion that it is enough to use a static global variable or Session :)
Apparently the AsyncFileUpload method works with static variables which could justify the problem with CommandArgument

Calling a function on a HTML check box change without submission using C#

I am using Visual Studio 2015 to create a ASP.NET web site. I have a DIV that is hidden by default and I am trying to display it if the user checks a check box. I am wondering if there is a way using C# to immediately display the DIV as soon as the user checks the box. I can't seem to find a way to recognize the change in state without the form being first submitted. I can easily achieve this using JavaScript however this is for a uni assignment and requires functionality to be implemented in C#.
This is the HTML for the checkBox:
<form id="form1" runat="server">
Limit Stations To My Location<asp:CheckBox ID="limitOptions" runat="server" onClick="toggleOptions()" />
<br /><br />
<div id="locationOptions" runat="server" hidden="hidden">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
<asp:Button ID="updateList" runat="server" Text="Button" OnClick="updateList_Click"/>
</div>
Any help would be greatly appreciated.

You can do this with C# in code behind. Add a OnCheckedChanged event to the CheckBox and set the AutoPostBack to true and handle the change. Note that a Panel becomes a div in HTML.
<asp:CheckBox ID="limitOptions" runat="server" OnCheckedChanged="limitOptions_CheckedChanged" AutoPostBack="true" />
<asp:Panel ID="locationOptions" runat="server" Visible="false">
Radius (KM) <asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</asp:Panel>
However this causes a PostBack, so just using JavaScript could be a better option.
<asp:CheckBox ID="limitOptions" runat="server" onclick="toggleOptions()" />
<div id="locationOptions" runat="server" style="display: none">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</div>
<script type="text/javascript">
function toggleOptions() {
var id = '#<% =locationOptions.ClientID %>';
if ($(id).css('display') == 'none') {
$(id).slideDown('fast', function () { });
} else {
$(id).slideUp('fast', function () { });
}
}
</script>

Change label text on bootstrap modal before click

I have a bootstrap modal with a label control in it. It is launched by clicking a button and I want to change the text of the label before it launches. The text that appears will come from the C# end of it... but that never triggers. I guess the postback never occurs (I am guessing showing the modal is blocking it?) so the text isn't set.
What I am trying to achieve is: Click button, set label text (the text has to come from the back end), show modal. Here is what I have so far:
<asp:Button ID="btnEasy" runat="server" CssClass="btn btn-success" Text="Easy" Width="200px" Height="50px" data-toggle="modal" data-target="#modalQuestion" data-backdrop="static" data-keyboard="false" OnClick="btnEasy_Click"/>
<div class="modal fade" id="modalQuestion" tabindex="-1" role="dialog" aria-labelledby="questionHeader">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="questionHeader">Easy Question</h4>
</div>
<div class="modal-body">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lblQuestion" runat="server" Text="Question"></asp:Label>
<br />
<br />
<asp:Label ID="lblAnswer" runat="server" Text="Answer"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnEasy" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnShowAnswer" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
<div class="modal-footer">
<asp:Button ID="btnShowAnswer" runat="server" CssClass="btn btn-primary" Text="Show Answer" UseSubmitBehavior="false" OnClick="btnShowAnswer_Click"/>
<asp:Button runat="server" CssClass="btn btn-default" data-dismiss="modal" Text="Close" />
</div>
</div>
</div>
</div>
C#:
protected void btnEasy_Click(object sender, EventArgs e)
{
lblQuestion.Text = "Easy clicked";
}

In the btnEasy_Click function, after setting the text value, emit the javascript code which will be executed.
eg.
protected void btnEasy_Click(object sender, EventArgs e)
{
lblQuestion.Text = "Easy clicked";
if(!ClientScript.IsStartupScriptRegistered("JSScript"))
{
ClientScript.RegisterStartupScript(this.GetType(),"JSScript",
"ShowModalPopUp()");
}
}
Write your js function:
<script>
function ShowModalPopUp(){
$('#modalQuestion').modal('show');
}
</script>

You can easily do this by using JS. Here i'm showing an example using jQuery. Bind an onclick event with your button that will open the modal. and change the label text on that time. like this way-
//button code
<asp:Button ID="btnEasy" runat="server" CssClass="btn btn-success" Text="Easy" Width="200px" Height="50px" data-backdrop="static" data-keyboard="false" OnClientClick="showModal();"/>
//scripts
<script>
function showModal(){
$('#<%=lblQuestion.ClientID%>').text('Easy clicked');
$('#modalQuestion').modal('show');
}
</script>

ASP.NET events not firing in <div> Tag

I have a tags that when you hover over another div tag containing the login and password form appears. But for some reasons the event is not firing.
I put the same control outside of the hover and it can be fired.
At first i thought it was because of a drag-and-drop problem because my div could be dragged and placed in the textbox for the website link so i disabled drag-and-drop on my page but the problem doesn't go away.
The mouse cursor changes to the human finger cursor too when I hover over the div.
Here is the code on masterpage where nav-item is the cause:
<div class="brick1" style="width: 33%">
<a href="" class="nav-item">
<div class="nav-hover">
<div class="loginbrick">
<asp:ContentPlaceHolder ID="LoginPlaceHolder" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
<i class="li_bulb"></i><span>Welcome, Hover over to login</span>
</a>
</div>
Default.aspx's contentplaceholder:
<asp:Content ID="Content4" ContentPlaceHolderID="LoginPlaceHolder" runat="Server">
<form id="AnonymousForm" runat="server">
<asp:Label ID="Label1" runat="server" Text="UserName: " CssClass="aspTextView"> </asp:Label>
<asp:TextBox ID="tbUserName" runat="server" CssClass="aspTextBox" OnTextChanged="tbUserName_TextChanged"></asp:TextBox>
<br />
<asp:Label ID="Label2" runat="server" Text="Password: " CssClass="aspTextView"></asp:Label>
<asp:TextBox ID="tb_Password" runat="server" CssClass="aspTextBox"></asp:TextBox>
<br />
<asp:Button ID="Button1" runat="server" Text="Login" OnClick="Button1_Click" />
</form>
</asp:Content>

You are enclosing div.nav-hover and div.loginbrick in a hyperlink. Try what happens when you remove that.

in your html brow > brick1 in which your login form is placed.
On brick1 click all event are prevented..
So try to put your form out side brick1.
I am sure your button event is not fire bCoz of js

Checkout you have not added multiple form tag actually we have same problem. and i found issue was because of multiple form in same page.

Getting rid of the Refresh on button click

I have a asp:Button that has an onclick function. Is there a way to eliminate the refresh that occurs?
Current HTML containing button.
<div id="user" class="font">
<div id="userPanel">
<asp:TextBox ID="txtSearch" runat="server" Width="400px" align="left"></asp:TextBox>
<asp:Button ID="searchbutton" text="enter" runat="server"
onclick="searchbutton_Click" />
<asp:Label ID="test" runat="server"></asp:Label>
</div>
<asp:UpdatePanel ID="userinfoupdatepanel" runat="server">
<ContentTemplate>
<div class="topcontent">
<ul>...</ul>
</div>
</ContentTemplate>
</asp:UpdatePanel>
The button click then calls a function that fills the UL content

You can use OnClientClick to bind a Javascript function to handle the click in the browser. If you return false from that fumction, the postback doesn't happen.

You can also add client events using Attributes collection.
searchbutton.Attributes.Add("onclick", "alert('Test')");
searchbutton.Attributes.Add("onclick", "return fnSomeThing(this);");