Update Panel Only Updates Once Radio Button List Async Postback - asp.net

I'm trying to use a radio button list to change some label texts in an update panel, but for whatever reason the SelectedIndexChanged event seems to only fire the first time and then never again. I've Googled and Googled but everything I've found to try has had no luck fixing the issue.
Autopostback is set to true, I've tried both the standard .net ScriptManager and the ToolkitScriptManager, both act the same, I've tried specifying the Event in the Trigger and having it unspecified (which falls back on the default for that control type) ... I've also tried binding the rbl in a if not me.ispostback then... structure for the page load event.
The VB I'm using in the event is just a simple If this index is selected, label.text="whatever" else "yadda" ... nothing fancy at all. It all works great if the Update panel isn't in play, except I was hoping to get rid of the screen flash from a full postback. I'm sticking the meat & potatoes of my asp.net below...Help!
Type1
Type2
<asp:Panel ID="DesignInfoHeaderPanel" runat="server" CssClass="headerpanel">
<asp:Label ID="lblDesignInfo" runat="server" font-bold="true"
style="z-index: 1; left: 5px; top: 5px; position: absolute" Text="Design Information"></asp:Label>
</asp:Panel>
<div class="cpdiv">
<asp:Panel ID="DesignInfoPanel" runat="server" CssClass="collapsepanel">
<asp:UpdatePanel runat="server" ID="DIUpdatePanel" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" font-bold="true"
style="z-index: 1; left: 5px; top: 7px; width: 95px; position: absolute; text-align: right"
Text="Account Name"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server" Font-Names="Verdana" Font-Size="8pt"
style="z-index: 1; left: 110px; top: 4px; width: 144px; position: absolute"></asp:TextBox>
<asp:Label ID="Label2" runat="server" font-bold="true"
style="z-index: 1; left: 270px; top: 7px; width: 140px; position: absolute"
Text="Est. Volume (# units)"></asp:Label>
<asp:TextBox ID="TextBox2" runat="server" Font-Names="Verdana" Font-Size="8pt"
style="z-index: 1; left: 415px; top: 4px; width: 60px; position: absolute"></asp:TextBox>
<asp:Label ID="Label3" runat="server" font-bold="true"
style="z-index: 1; left: 7px; top: 35px; width: 95px; position: absolute; text-align: right"
Text="Sales Manager"></asp:Label>
<asp:DropDownList ID="DropDownList1" runat="server" Font-Names="Verdana" Font-Size="8pt"
style="z-index: 1; left: 110px; top: 32px; width: 150px; position: absolute">
</asp:DropDownList>
<asp:Label ID="Label4" runat="server" font-bold="true"
style="z-index: 1; left: 485px; top: 7px; width: 140px; position: absolute"
Text="Personalization Type"></asp:Label>
<asp:DropDownList ID="DropDownList2" runat="server" Font-Names="Verdana" Font-Size="8pt"
style="z-index: 1; left: 630px; top: 4px; width: 150px; position: absolute">
</asp:DropDownList>
<asp:CheckBox ID="CheckBox1" runat="server" font-bold="true"
style="z-index: 1; left: 298px; top: 32px; position: absolute" Text="Rental"
TextAlign="Left" />
<asp:CheckBox ID="CheckBox2" runat="server" font-bold="true"
style="z-index: 1; left: 397px; top: 32px; position: absolute" Text="Dir Sales"
TextAlign="Left" />
<asp:RadioButtonList ID="RadioButtonList1" runat="server" BorderColor="#640000"
BorderStyle="Solid" BorderWidth="2px" Font-Bold="true"
RepeatDirection="Horizontal"
style="z-index: 1; left: 545px; top: 28px; position: absolute"
TextAlign="Left">
<asp:ListItem Value="0">Type1</asp:ListItem>
<asp:ListItem Value="1">Type2</asp:ListItem>
</asp:RadioButtonList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="rblEmblemType" />
</Triggers>
</asp:UpdatePanel>

It could be because UpdatePanel is Updating. Since You have not post any information about your Code-Script, I assume that you have not used The following code in your Event Method.
UpdatePanel1.Update()
This(The Following One) is a less chance that could happen.
You don't need to use asyncPostBackTrigger if you use AutoPostBack..! You need to use trigger when an Image Button/Image/Grid..etc Event happens which or this Error Occurs
The message received from the server could not be parsed.

Try to add ClientIDMode="AutoID" to your RadioButtonList.

My code and yours are very similar.
In my cases, SelectedIndexChanged events are fired when I set PostBackTrigger.
Actually, Event fires only once means click events are attached the other Radio buttons (which is not selected).
So, I simply solved to delete "Selected=true"

Related

How to selected value from dropdownList URL aspx

I have a popupButton (custom component) in my aspx page. (Car.aspx)
This button has a URL that calls a new view. (Color.aspx)
I would like to pass as a URL parameter a selected value from the dropdown on the Car.aspx page
I tried the code below but it does not send the selected value in the request but the text <%:ddlCodMercado.SelectedValue%>
Cars.aspx
<asp:DropDownList id="ddlCodMercado" style="Z-INDEX: 111; LEFT: 10px; POSITION: absolute; TOP: 50px" runat="server" Width="130px" accessKey="R" CssClass="campo" tabIndex="2">
<asp:ListItem Value="3433">3433</asp:ListItem>
<asp:ListItem Value="3431">3431</asp:ListItem>
</asp:DropDownList>
<gvs:popupbutton id="pubConcessionaria" style="Z-INDEX: 109; LEFT: 400px; POSITION: absolute; TOP: 50px"
tabIndex="2" runat="server" ImageUrl="../img/img_lupa.gif" URL="../Pop-ups/Color_pop.aspx?codMercado=<%:ddlCodMercado.SelectedValue%>"></gvs:popupbutton>
How to pass selected value from dropwdown?
Try this;
<asp:DropDownList id="ddlCodMercado" style="Z-INDEX: 111; LEFT: 10px;
POSITION: absolute; TOP: 50px" runat="server" Width="130px" accessKey="R"
CssClass="campo" tabIndex="2">
<asp:ListItem Value="3433">3433</asp:ListItem>
<asp:ListItem Value="3431">3431</asp:ListItem>
</asp:DropDownList>
<gvs:popupbutton id="pubConcessionaria" style="Z-INDEX: 109; LEFT: 400px;
POSITION: absolute; TOP: 50px"
tabIndex="2" runat="server" ImageUrl="../img/img_lupa.gif" URL='<%#
string.Format("../Pop-ups/Color_pop.aspx?codMercado={0}",
ddlCodMercado.SelectedValue) %>'></gvs:popupbutton>

Modal popup border disappears when css background applied

I am using the Ajax Modal Popup Extender to display a panel as a modal popup. I've applied a CSS class to the panel and everything displays fine. However, when I add the BackgroundCssClass property to my popup extender, the border on my panel does not show up. The modal background displays properly and everything else in the panel remains the same, but I can't get the border to display. What might be causing this?
**CSS**
.PopupPanel
{
width: 75%;
height: 55%;
text-align: center;
padding: 5px;
overflow: auto;
border-style: solid;
border-width: 8px;
border-color: #0055A5;
background-color: White;
}
.ModalBackground
{
background-color: rgba(170,170,174,0.5);
}
**ASPX**
<asp:Panel ID="InputPanel" runat="server" CssClass="PopupPanel">
<asp:Label ID="HeaderLabel" runat="server"
Text="[text here]"
Font-Size="Large"></asp:Label>
<br />
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Width="85%"
Height="65%" Wrap="False"></asp:TextBox>
<br />
<asp:Button ID="okButton" runat="server" Text="Submit"
CssClass="genericButton" />
<asp:Button ID="CancelButton" runat="server" Text="Cancel"
CssClass="genericButton" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
PopupControlID="InputPanel" TargetControlID="PasteButton"
BackgroundCssClass="ModalBackground" PopupDragHandleControlID="HeaderLabel">
</ajaxToolkit:ModalPopupExtender>

Image preview on asp:file upload control

I have an asp:file upload which I allowed users to select multiple files, I want it that if the user clicks on browse and pressed ok, I want the users to be able to preview the images selected (just like facebook image upload) how can i do this?
http://www.aspforums.net/Threads/165544/Display-Image-Preview-without-saving-file-physically-after-upload-in-ASPNet/
also refer this link...........
<asp:FileUpload ID="FileUpload1" runat="server"
style="top: 256px; left: 533px; position: absolute; height: 23px; width: 217px" ForeColor="White" />
<asp:Button ID="btnset" runat="server" Font-Bold="False" Font-Names="Times New Roman" Font-Size="Medium" style="top: 309px; left: 605px; position: absolute; height: 26px; width: 81px" Text="Set Photo " />
<asp:Image ID="Image2" runat="server" style="top: 66px; left: 568px; position: absolute; height: 152px; width: 136px" BorderColor="#CCCCFF" BorderStyle="Ridge" />
VB Code :
Protected Sub btnset_Click(ByVal sender As Object,
ByVal e As System.EventArgs) Handles btnset.Click
Image2.ImageUrl = FileUpload1.FileName
End Sub

Text box display based on drop down list

I have a drop down list that shows all of the job numbers that are current. I need a text box to display the "name" equivalent of this number. The drop down list is based on a query to a separate table within the same database. The drop down list is:
<asp:DropDownList ID="dlRef" runat="server" DataSourceID="DataRef" DataTextField="Ref"
DataValueField="Ref" style="z-index: 1; left: 155px; top: 68px; position: absolute;
width: 115px; height: 29px; bottom: 254px;" AutoPostBack="True">
</asp:DropDownList>
What I need to do is have the text box tbADName to be associated with a datasource that uses a query such as this select Name from ActiveJobs where Ref = dlRef.DataValueField.
Is this possible or do I need to use another construct to display this information?
You can use the following function
onchange="showText(this.options[this.selectedIndex].text);"
Adding in your dropdown it will be
<asp:DropDownList ID="dlRef" runat="server" DataSourceID="DataRef" DataTextField="Ref"
DataValueField="Ref" style="z-index: 1; left: 155px; top: 68px; position: absolute;
width: 115px; height: 29px; bottom: 254px;" AutoPostBack="True"
onchange="showText(this.options[this.selectedIndex].text);">
</asp:DropDownList>
Create a function in java-script
function showText(value)
{
document.getElementById("textboxid").value=value
}
Edit 1
<head>
<title>DropDown</title>
<script type="text/javascript">
function chkind(){
var dropdown1 = document.getElementById('dlRef');
var textbox = document.getElementById('textbox');
var a = dropdown1.options[dropdown1.selectedIndex].text;
textbox.value = a;
}
}
</script>
</head>
<body>
<asp:DropDownList ID="dlRef" runat="server" DataSourceID="DataRef" DataTextField="Ref"
DataValueField="Ref" style="z-index: 1; left: 155px; top: 68px; position: absolute;
width: 115px; height: 29px; bottom: 254px;" AutoPostBack="True"
onchange="chkind()">
<option>Hi</option>
<option>Bye</option>
</select><br />
<asp:textbox id="textbox" type="text" runat="server" />
</body>
I'd use javascript to do this. Add an onchange=functionName() in your asp:DropDownList and handle the onchange in javascript to change the textbox text to the value in the dropdown list.
EDIT:
you could call the onchange event like this:
<asp:DropDownList ID="dlRef" runat="server" DataSourceID="DataRef" DataTextField="Ref"
DataValueField="Ref" style="z-index: 1; left: 155px; top: 68px; position: absolute;
width: 115px; height: 29px; bottom: 254px;" AutoPostBack="True" onchange="changeTextBox(this)">
</asp:DropDownList>
And your script like this:
<script>
function changeTextBox(data) {
document.getElementById("yourTextBoxId").value = data.value;
}
</script>
If you want the text displayed I'm guessing you should use the text property.
Note: As of html5 the script tags can be used like so without the type attribute.

Shrink a cell (in an absolutely-positioned ASP.NET table) to fit its contents?

My webpage currently looks like this:
<asp:Table runat="server" style="position: absolute;
left: 0%; top: 82%; right: 0%; bottom: 0%; width: 100%; height: 18%"
CellPadding="0" CellSpacing="0" GridLines="Both">
<asp:TableRow>
<asp:TableCell>
Content1
</asp:TableCell>
<asp:TableCell Width="2.5%">
</asp:TableCell>
<asp:TableCell >
Content2
</asp:TableCell>
</asp:TableRow>
</asp:Table>
http://img684.imageshack.us/img684/9677/tableu.png
But I need it to look like this:
http://img263.imageshack.us/img263/4508/table2k.png
"Content1" is of unknown size, and the table will have to adjust to fit it in, but without taking any unnecessary space away from "Content2." I can't use "display: table" because it isn't supported in IE7 and such, so I'm pretty much stuck using a regular table element unless there is something better out there that is supported in older browsers.
Does anyone know how this can be accomplished?
Why not add a width to the Content2 cell? Something like:
<asp:Table runat="server" style="position: absolute;
left: 0%; top: 82%; right: 0%; bottom: 0%; width: 100%; height: 18%"
CellPadding="0" CellSpacing="0" GridLines="Both">
<asp:TableRow>
<asp:TableCell>
Content1
</asp:TableCell>
<asp:TableCell Width="2.5%">
</asp:TableCell>
<asp:TableCell Width="97.5%">
Content2
</asp:TableCell>
</asp:TableRow>
</asp:Table>

Resources