how can I use updatepanel for more than 1 control - asp.net

<div class="step-content">
<div class="step-pane active" id="step1">
<div class="control-group ">
<label class="control-label" for="inputWarning">Please select the Event Name</label>
<div class="controls">
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" AutoPostBack="True" DataSourceID="SqlDataSource1" DataTextField="EventName" DataValueField="EventId"></asp:DropDownList>
<asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString='<%$ ConnectionStrings:WBENCConnectionString %>' SelectCommand="SELECT [EventId], [EventName] FROM [Event]"></asp:SqlDataSource>
</div>
</div>
</div>
<div class="step-pane" id="step2">
<div class="control-group " >
<asp:Label ID="DateLabel" runat="server"></asp:Label>
<div class="controls">
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:RadioButtonList ID="RadioButtonList1" runat="server" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged" AutoPostBack="true">
<asp:ListItem Text="Yes" Value="Yes"></asp:ListItem>
<asp:ListItem Text="No" Value="No"></asp:ListItem>
</asp:RadioButtonList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="RadioButtonList1" EventName="SelectedIndexChanged"/>
</Triggers>
</asp:UpdatePanel>
</div>
</div>
</div>
<div class="step-pane" id="step3">
<div class="control-group ">
<label class="control-label" for="inputWarning">
<span class="muted">You can learn more about the program here</span></label>
<div class="controls">
<label class="radio">
<asp:RadioButton ID="Radio1" runat="server" Text="Yes" value="option1" /></label>
<label class="radio">
<asp:RadioButton ID="Radio2" runat="server" Text="No" value="option2" /></label>
<label class="radio">
<asp:RadioButton ID="Radio3" runat="server" Text="Uncertain" value="option2" /></label>
</div>
</div>
</div>
<div class="step-pane" id="step4">
<div class="control-group">
<label class="control-label" for="selectError30">Which days will you be available to participate in the Matchmaker Sessions?</label>
<div class="controls">
<asp:DropDownList ID="selectError30" runat="server" OnDataBound="selectError30_DataBound">
</asp:DropDownList>
</div>
</div>
<div class="control-group">
<label class="control-label">Upload your capability statement. <a style="color: #67c2ef;" href="#">What's this?</a></label>
<div class="controls">
<asp:FileUpload ID="FileUpload1" runat="server" />
</div>
</div>
</div>
here the DropDownlist1_onselectedIndexChanged event got full page load..
and RadioButtonList1 event also get page load...
here how can I use the Update Panel to overcome the full page load....
In my code all events perform Page_Load....
I want to prevent that loading....

If there is a full page load then since panel is inside the page, it will also get refreshed. You can put the drop down inside another update panel. This will prevent the refreshing of radio button update panel.

Related

Repeat set of Codes again and again when a button is clicked

I'm learning to develop a webform. I want to run set of codes again when button is clicked. Can anyone please help me. asp IDs should also be changed for new items. As an example ID="itemCode1" should changed to itemCode2 in the second instance in 3rd itemcode 3 and so on. It is better if the button is moved to last row after clicking
<div class="form-group col-md-2">
<label>Item Code</label>
<div class="form-group">
<asp:TextBox Cssclass="form-control" ID="Itemcode1" runat="server" placeholder="Enter Item Code" ></asp:TextBox>
</div>
</div>
<div class="form-group col-md-2">
<label>Item Name</label>
<div class="form-group">
<asp:TextBox Cssclass="form-control" ID="ItemName" runat="server" placeholder="Enter Item Name" ></asp:TextBox>
</div>
</div>
<div class="form-group col-md-2">
<label>Select The Range</label>
<asp:CheckBoxList ID="CheckBoxList1" TabIndex="2" CssClass="rangecheckbox" RepeatDirection="Vertical" runat="server">
<asp:ListItem Text="Casabalanca (X05)" Value="Casabalanca (X05)"></asp:ListItem>
<asp:ListItem Text="Monaco (X07)" Value="Monaco (X07)"></asp:ListItem>
<asp:ListItem Text="Akoya" Value="Akoya"></asp:ListItem>
<asp:ListItem Text="Scintilla" Value="Scintilla"></asp:ListItem>
<asp:ListItem Text="Enigma" Value="Enigma"></asp:ListItem>
<asp:ListItem Text="BigRocker" Value="BigRocker"></asp:ListItem>
</asp:CheckBoxList>
</div>
<div class="form-group col-md-1">
<label>No Of Cavities</label>
<div class="form-group">
<asp:TextBox Cssclass="form-control" ID="NoOfCavities" runat="server" placeholder="Enter No of Cavities" ></asp:TextBox>
</div>
</div>
<div class="form-group col-md-2">
<label>Add the photo</label>
<div class="form-group">
<asp:FileUpload Cssclass="form-control" ID="ItemPhoto" type="submit" runat="server" text="Upload Photo" ></asp:FileUpload>
</div>
</div>
<div class="form-group col-md-1">
<label>Material</label>
<div class="form-group">
<asp:DropDownList ID="DropDownList1" Cssclass="form-control" runat="server">
<asp:ListItem text="Select" value="Select" />
<asp:ListItem text="PC" value="PC" />
<asp:ListItem text="Nylon6" value="Nylon6" />
<asp:ListItem text="HIPS" value="HIPS" />
<asp:ListItem text="PBT" value="PBT" />
<asp:ListItem text="ABS" value="ABS" />
<asp:ListItem text="Nylon Fiberfilled" value="Nylon Fiberfilled" />
</asp:DropDownList>
</div>
</div>
<div class="form-group col-md-1">
<asp:Button class="btn btn-primary btn-block" ID="AddAnotherItem" runat="server" Text="AddAnother" />
</div>
</div>
</div>

how to make the radio button list text is NOT below the radio button?

I am using visual studio 2013 and use the radio button list in ASP.Net. Im having problem with the text which it's not in line with the button. This is what I got and This is what I want
here is my code
<div class="form-group">
<div class="row">
<div class="col-md-2">
<asp:Label ID="lbl6" Text="From Date" runat="server"></asp:Label>
</div>
<div class="col-md-2">
<dx:ASPxDateEdit ID="datepickerFrom" runat="server" AutoPostBack="true" DisplayFormatString="yyyy-MM-dd" EditFormat="Date" EditFormatString="yyyy-MM-dd" NullText="Please select the date">
</dx:ASPxDateEdit>
</div>
<div class="col-sm-2">
<dx:ASPxDateEdit ID="datepickerto" runat="server" AutoPostBack="true" DisplayFormatString="yyyy-MM-dd" EditFormat="Date" EditFormatString="yyyy-MM-dd" NullText="Please select the date">
<DateRangeSettings StartDateEditID="datepickerFrom" />
</dx:ASPxDateEdit>
</div>
<div class="col-md-2">
<asp:CheckBox ID="cbHalfDay" runat="server" Text="Half Day" AutoPostBack="true" />
<asp:RadioButtonList ID="rblHalfday" runat="server" Visible="false" RepeatDirection="Horizontal" CssClass="margin-5">
<asp:ListItem Text="First Half " Value="1" />
<asp:ListItem Text="Second Half" Value="2" />
</asp:RadioButtonList>
</div>
</div>
</div>
So,I try to use this in asp.net
<div class="col-sm-8">
<asp:RadioButtonList ID="rblHalfday" runat="server" Visible="false" RepeatDirection="Horizontal" RepeatLayout="Table" RepeatColumns="2" CssClass="mylist">
<asp:ListItem Text="First Half" Value="1" />
<asp:ListItem Text="Second Half" Value="2" />
</asp:RadioButtonList>
</div>
and this is the css
table.mylist label {
width: 100px;
display: block;
float: left;
margin-left: 20px;
margin-right: 5px;
}
And the text in line like image below. BUT I want the text inline with the radio button too.
This is what I got:

How to resolve this error in ASP.NET Web Forms 4.5.2: Invalid postback or callback argument?

I am a new ASP.NET Web Forms developer and I am currently using .NET Framework 4.5.2.I have a simple form that includes two textbox controls and two buttons. I am struggling right now with the button click event. When I click on the button, I got the following error and I don't know why.
I searched on the web and I couldn't find any solution to this. Could you please help me in this regard?
For your information, here's my ASP.NET Code:
<asp:UpdatePanel ID="upAdd" runat="server">
<ContentTemplate>
<div id="post-wrapper" class="row">
<div id="content" class="col-md-12 col-sm-12 col-xs-12">
<div id="login">
<div class="form-wrap">
<div role="form">
<div class="form-group">
<label for="email" class="control-label">Name</label>
<asp:TextBox ID="txtNameNew" runat="server" CssClass="form-control" placeholder="e.g. fire extinguisher"></asp:TextBox>
</div>
<div class="form-group">
<label for="key" class="control-label">Description</label>
<asp:TextBox ID="txtDescNew" runat="server" CssClass="form-control" placeholder="e.g. ........."></asp:TextBox>
</div>
<%--<div class="form-group">
<label for="key" class="control-label">ImagePath</label>
<asp:TextBox ID="TextBox2" runat="server" CssClass="form-control"></asp:TextBox>
</div>--%>
<asp:LinkButton ID="lbtnAdd" runat="server" CssClass="btn btn-primary"
OnClick="lbtnAdd_Click">
<span class="fa fa-plus"></span> Add</asp:LinkButton>
<asp:LinkButton ID="lbtnCancel" runat="server" CssClass="btn btn-default"
OnClick="lbtnCancel_Click">
<span class="fa fa-remove"></span> Cancel</asp:LinkButton>
</div>
<hr>
</div>
</div>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lbtnAdd" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="lbtnCancel" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

How do I display a ModalPopupExtender from another ModalPopupExtender and set which one has to be shown first?

I have a ModalPopUpExtender that contains a button that display a second ModalPopUpExtender . The problem is that when I show the second ModalPopUpExtender it appears behind the first. Is it any way i can set that the second ModalPopUpExtender was shown ahead of the fist one?
<asp:ToolkitScriptManager ID="ToolkitScriptManagerProfesiones" runat="server">
</asp:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanelAgenda" runat="server">
<ContentTemplate>
<DayPilot:DayPilotCalendar ID="DayPilotCalendar1" runat="server" BackColor="#FFFFD5" BorderColor="Black" CssClassPrefix="calendar_default" DayFontFamily="Tahoma" DayFontSize="15pt" DurationBarColor="Blue" EventBackColor="White" EventBorderColor="Black" EventClickHandling="PostBack" EventFontFamily="Tahoma" EventFontSize="8pt" EventHoverColor="Gainsboro" HourBorderColor="#EAD098" HourFontFamily="Tahoma" HourFontSize="16pt" HourHalfBorderColor="#F3E4B1" HourNameBackColor="#ECE9D8" HourNameBorderColor="#ACA899" HourWidth="100" HoverColor="#FFED95" NonBusinessBackColor="#FFF4BC" StartDate="2015-03-25" TimeFormat="Clock24Hours" CellHeight="40" HeaderHeight="40" OnEventClick="DayPilotCalendar1_EventClick" OnTimeRangeSelected="DayPilotCalendar1_TimeRangeSelected" style="top: 0px; left: 0px; width: 375px; height: 501px; margin-right: 221px" Width="600px" TimeRangeSelectedHandling="PostBack" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:ModalPopupExtender ID="modificarTurno_ModalPopupExtender" runat="server" Enabled="True" PopupControlID="PanelModificarTurno" DropShadow="false" BackgroundCssClass="FondoAplicacion" TargetControlID="lb">
</asp:ModalPopupExtender>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" Enabled="True" PopupControlID="panelClientes" DropShadow="false" BackgroundCssClass="FondoAplicacion" TargetControlID="lbClientePop">
</asp:ModalPopupExtender>
<asp:Button ID="Button1" class="btn btn-info" runat="server" Text="Modificar" Visible="false" />
<asp:Panel ID="panelClientes" runat="server" >
<asp:Label ID="lbClientePop" runat="server" Style="display: none " ></asp:Label>
<asp:UpdatePanel ID="UpdatePanelCliente" runat="server">
<ContentTemplate>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" >
<h2> prueba</h2>
</div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="PanelModificarTurno" runat="server" >
<asp:Label ID="Lb" runat="server" Style="display: none"></asp:Label>
<asp:UpdatePanel ID="UpdatePanelModificarTurno" runat="server">
<ContentTemplate>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" >
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabelModificar16">Modificar turno</h4>
</div>
<div class="modal-body">
<div class="form-horizontal">
<fieldset>
<div class="form-group">
<label for="DropDownEstado" class="col-lg-2 control-label">Estado</label>
<div class="col-lg-6">
<asp:DropDownList ID="DropDownEstado" runat="server" CssClass="form-control" DataSourceID="SqlDataSourceEstado" DataTextField="estado" DataValueField="id"></asp:DropDownList>
<asp:SqlDataSource runat="server" ID="SqlDataSourceEstado" ConnectionString='<%$ ConnectionStrings:MiWeb.Properties.Settings.cs %>' SelectCommand="SELECT * FROM [Estado]"></asp:SqlDataSource>
</div>
</div>
<div class="form-group">
<asp:UpdatePanel ID="updatepanelboton" runat="server">
<ContentTemplate>
<label for="txtCliente" class="col-lg-2 control-label">Cliente</label>
<div class="col-lg-4">
<asp:TextBox ID="txtCliente" class="form-control" runat="server"></asp:TextBox>
</div>
<div class="col-lg-2">
<asp:Button runat="server" ID="BtnBuscarCliente" Text="..." OnClick="BtnBuscarCliente_Click" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="form-group">
<label for="DropdownServicios" class="col-lg-2 control-label">Servicio</label>
<div class="col-lg-6">
<asp:DropDownList ID="DropdownServicios" runat="server" CssClass="form-control" DataSourceID="SqlDataSourceServicios" DataTextField="nombre" DataValueField="id" OnSelectedIndexChanged="DropdownServicios_SelectedIndexChanged"></asp:DropDownList>
<asp:SqlDataSource runat="server" ID="SqlDataSourceServicios" ConnectionString='<%$ ConnectionStrings:MiWeb.Properties.Settings.cs %>' SelectCommand="SELECT * FROM [Servicios] WHERE ([activo] = #activo)">
<SelectParameters>
<asp:Parameter DefaultValue="true" Name="activo" Type="Boolean" />
</SelectParameters>
</asp:SqlDataSource>
</div>
</div>
<div class="form-group">
<label for="DropDownProfesioanles" class="col-lg-2 control-label">Profesional</label>
<div class="col-lg-6">
<asp:DropDownList ID="DropDownProfesioanles" runat="server" CssClass="form-control" ></asp:DropDownList>
</div>
</div>
<div class="form-group">
<label for="ChkPrimeraVez" class="col-lg-2 control-label">Primera vez? </label>
<div class="col-lg-6">
<asp:CheckBox ID="ChkPrimeraVez" runat="server" />
</div>
</div>
<div class="form-group">
<label for="DropDownHsInicio" class="col-lg-2 control-label">Inicio</label>
<div class="col-lg-4">
<asp:DropDownList ID="DropDownHsInicio" runat="server" CssClass="form-control" DataSourceID="SqlDataSourceHI" DataTextField="hora" DataValueField="id"></asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSourceHI" runat="server" ConnectionString='<%$ ConnectionStrings:MiWeb.Properties.Settings.cs %>' SelectCommand="SELECT * FROM [horarios]"></asp:SqlDataSource>
</div>
<label for="DropDownHsFin" class="col-lg-2 control-label">Fin</label>
<div class="col-lg-4">
<asp:DropDownList ID="DropDownListFin" runat="server" CssClass="form-control" DataSourceID="SqlDataSourceFI" DataTextField="hora" DataValueField="id" Enabled="False"></asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSourceFi" runat="server" ConnectionString='<%$ ConnectionStrings:MiWeb.Properties.Settings.cs %>' SelectCommand="SELECT * FROM [horarios]"></asp:SqlDataSource>
</div>
</div>
</fieldset>
</div>
</div>
<div class="modal-footer">
<asp:Button ID="BtnEliminarTurno" runat="server" class="btn btn-danger" Text="Eliminar turno" OnClick="BtnEliminarTurno_Click" />
<asp:Button ID="btnCancelarMod" runat="server" class="btn btn-default" Text="Cancelar" OnClick="btnCancelarMod_Click" />
<asp:Button ID="btnConfirmarMod" runat="server" class="btn btn-success" Text="Modificar" OnClick="btnConfirmarMod_Click" />
</div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
protected void btnConfirmarMod_Click(object sender, EventArgs e)
{
modificarTurno_ModalPopupExtender.Hide();
}
protected void BtnBuscarCliente_Click(object sender, EventArgs e)
{
ModalPopupExtender1.Show();
}
thanks in advance !
ModalPopupExtender "decides" on its own what z-index to use. Generally it will do the right thing.
The only way I know to assure that your second one will appear on top is to Not use a second ModalPopupExtender, but instead to assign the z-index of the second modal popup explicitly. I suggest 99999 for the second popup and 99998 for its blanket. I have seen typical z-index assigned by ModalPopupExtender in ranges of 50000 to 79000 (aprox).

HTML5 required stops ASP:Button from working

I am trying to click on an ASP:Button with an onclick function. Every time I do that the HTML5 Required stops the click from occurring. I even tried to include an ASP:UpdatePanel but that does not work neither.
<form id="form1" name="theform" class="form-horizontal" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="fb_login" runat="server">
<asp:button CssClass="btn-facebook" ID="FacebookButton" Text="Login with Facebook" OnClick="FacebookButton_Click" runat="server" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="container">
<div class="form-group">
<label for="FirstName">First Name</label>
<div>
<input type="text" tabindex="1" class="form-control" id="FirstName" required title="Enter First Name" runat="server" placeholder="First Name">
</div>
</div>
<div class="form-group">
<label for="LastName">Last Name</label>
<div>
<input type="text" tabindex="2" class="form-control" id="LastName" required title="Enter Last Name" runat="server" placeholder="Last Name">
</div>
</div>
<div class="form-group">
<div>
<button type="submit" class="btn btn-primary">Submit Information</button>
</div>
</div>
</div>
</form>
Remove the UpdatePanel and set UseSubmitBehavior="false" on FacebookButton:
<asp:button UseSubmitBehavior="false" CssClass="btn-facebook" ID="FacebookButton" Text="Login with Facebook" OnClick="FacebookButton_Click" runat="server" />

Resources