Develop Reference

Open a modal with a text area to fill and a text area loading some content from the page

I'm working with WebForms and I need to create a modal, or anything like this on click on a button to reject an item, the modal should show the item ID and a text area to fill up with the reason why this item will be rejected.
I'm on it for about one week and I can't figure out how could I get the item id and put it on the modal.
I've never used WebForms before, and I'm not finding anything that helps me.
this is my modal code:
<asp:Panel ID="pnlMotivoRejeitarTitulo" runat="server" Width="610px">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button runat="server" ID="btnShowModalPopup2" Style="display: none" />
<ajaxToolkit:ModalPopupExtender ID="modalRejeitarTitulo" runat="server" TargetControlID="btnShowModalPopup2"
PopupControlID="divPopUp2" BackgroundCssClass="popUpStyle" PopupDragHandleControlID="panelDragHandle"
DropShadow="true" RepositionMode="RepositionOnWindowResize" />
<div class="popUpStyle" id="divPopUp2" style="display: none;">
<div style="width: 600px; max-height: 160px;">
<asp:Panel runat="Server" ID="panel1" CssClass="drag01">
<asp:Label ID="lblTituloModal" runat="server" Text="EXCLUIR TÍTULO?"></asp:Label>
<br />
</asp:Panel>
<div class="subtitulo">
<asp:Label ID="lblMensagemOrigemAgregadoMiudo" runat="server" Text=""></asp:Label>
</div>
<br />
<asp:Panel ID="pnlRejeitarTitulo" runat="server" Width="550px" BackColor="#CCCCCC"
CssClass="centralizaPanel" BorderStyle="Outset">
<div style="padding-top: 10px;">
<div class="campo">
<div class="label_formulario8">
<asp:Label ID="lblId" runat="server" Text="ID: "></asp:Label>
</div>
<asp:TextBox ID="txtId" runat="server" Width="100px" ReadOnly="true"></asp:TextBox>
</div>
<div class="campo">
<div class="label_formulario8">
<asp:Label ID="Label3" runat="server" Text="Descrição: "></asp:Label>
</div>
<asp:TextBox ID="txtDescricao" runat="server" Width="300px"></asp:TextBox>
</div>
<br />
</div>
<div class="centraliza_botao">
<asp:Button ID="btnConfirmarExcluirTitulo" runat="server" Text="Confirmar" CssClass="btn btn-primary" OnClick="btnConfirmarExcluirTitulo_Click"
Style="height: 31px" CausesValidation="false" />
<asp:Button ID="btnFecharExcluirTitulo" runat="server" Text="Fechar" CssClass="btn btn-warning"
Style="height: 31px" CausesValidation="false" OnClick="btnFecharExcluirTitulo_Click" />
</div>
<br />
</asp:Panel>
</div>
<br />
<br />
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
on txtId must appear the item ID, I've tried to use JS getting the id of the rendered input, but it take so long to render, so JS does not work.

I figured out that I had to fill all the fields before call the method that shows the modal dialog.
I was thinking like jQuery but it does work like that on WebForms

Need to add 'for' attibutes to labels inside a ListView control of an ASP.NET page

I have something like this
<asp:ListView ID="lvOptions" runat="server"">
<LayoutTemplate>
<p>Select an option<span>*</span></p>
<div class="row">
<asp:Literal runat="server" ID="groupPlaceHolder"></asp:Literal>
</div>
<div class="row">
<div class="w100">
<label>
Other types:</label>
<asp:DropDownList ID="ddlOtherTypes" runat="server" DataTextField="Description" DataValueField="Id"
AutoPostBack="true" Enabled="false"
</asp:DropDownList>
</div>
</div>
</LayoutTemplate>
<GroupTemplate>
<asp:Literal runat="server" ID="itemPlaceHolder"></asp:Literal>
</GroupTemplate>
<ItemTemplate>
<span class="wrap-w50">
<asp:RadioButton runat="server" ID="rdbOption" AutoPostBack="true" />
<label>
<%# Eval("Description") %></label>
</span>
</ItemTemplate>
</asp:ListView>
And I got here two labels, one fot the Other types DropDownList, and another for each RadioButton.
For this labels, I need to add a "for" attribute, and I need the clientID but, if I try to write the attibute like:
for="<%= ddlOtherTypes.ClientID %>"
for="<%= rdbOption.ClientID %>"
I got the error: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
Any suggestions please?
Thank you in advance.

Certain controls won't get generated in aspx.designer.cs-file

I have a weird problem. I can't access some of my server controls from my codebehind. I've looked around and can only find answers for situations where you can't find ANY controls and I've tried all solutions I've found here on stack. re-creating designer file, deleting temp data, renaming controls etc. Nothing works.
The weird thing is that I can access every controller I put outside my ListView element. But everything inside will not get generated in my aspx.designer.cs file.
Code:
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolderMid" runat="server">
<h2><asp:Label ID="LabelCat" runat="server" Text=""></asp:Label></h2>
<asp:HiddenField ID="HiddenFieldID" runat="server" />
<br />
<div class="list-group">
<asp:ListView ID="ListViewSearch" runat="server" DataSourceID="SqlDataSourceWebsite" DataKeyNames="WebsiteID">
<EmptyDataTemplate>
<table runat="server">
<tr>
<td>Darn</td>
</tr>
</table>
</EmptyDataTemplate>
<ItemTemplate>
<td>
<div class="row list-group-item">
<div class="">
<%# Eval("url") %>
</div>
<div class="col-xs-5">
<div class="pull-left">
<div>
<asp:LinkButton ID="BtnUp" runat="server" CssClass="btn btn-default btn-xs" CommandArgument='<%# Eval("websiteId").ToString() %>' OnClick="up_click"><i class="fa fa-chevron-up" style="color:green"></i></asp:LinkButton>
</div>
<div>
<asp:LinkButton ID="BtnDown" runat="server" CssClass="btn btn-default btn-xs" CommandArgument='<%# Eval("websiteId").ToString() %>' OnCommand="down_click"><i class="fa fa-chevron-down" style="color:red"></i></asp:LinkButton>
</div>
</div>
<div class="lbl-score">
<asp:Label ID="LabelScore" runat="server" Text="Score: "></asp:Label>
<asp:ScriptManagerProxy ID="ScriptManagerProxySearch" runat="server"></asp:ScriptManagerProxy>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Label ID="LabelRating" runat="server" Text=' <%# Eval("rating") %>'></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnUp" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
<div class="lbl-desc">
<asp:Label ID="LabelDesc1" runat="server" Text=' <%# Eval("Description1") + " | "%> '></asp:Label>
<asp:Label ID="LabelDesc2" runat="server" Text=' <%# Eval("Description2") %> '></asp:Label>
</div>
</div>
</td>
</ItemTemplate>
</asp:ListView>
</div>
<asp:SqlDataSource ID="SqlDataSourceWebsite" runat="server" ConnectionString="<%$ ConnectionStrings:WDBAPPConnectionString %>" SelectCommand="SELECT * FROM [Website] WHERE ([categoryId] = #HFID)">
<SelectParameters>
<asp:ControlParameter ControlID="HiddenFieldID" Name="HFID" Type="Int32" DefaultValue="0" />
</SelectParameters>
</asp:SqlDataSource>
</asp:Content>
I know there is a lot of code but basically the controls "LabeCat", "HiddenFieldID", "ListViewSearch" and "SqlDataSourceWebsite" show up in my aspx.designer.cs-file, but no other controls do, in other words; all controls before and after my ListView work fine. What could be wrong here? So confused.

ListView Coding

How do i code the "View Details" portion of my ListView to hyperlink it to the product details page? My product catalog is displayed as follows:
ListView codes
<asp:ListView runat="server" ID="listView" GroupItemCount="3"
DataSourceID="AccessDataSource1">
<LayoutTemplate>
<div style="height: 966px;">
<div style="width: 771px;">
<asp:PlaceHolder runat="server" ID="groupPlaceHolder" />
<asp:DataPager runat="server" ID="dpMyDatePager" PageSize="9"
PagedControlID="listView">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button" ShowLastPageButton="True"
ShowFirstPageButton="True" />
<asp:NumericPagerField />
</Fields>
</asp:DataPager>
</div>
</LayoutTemplate>
<GroupTemplate>
<div style="clear: both;">
<asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
</div>
</GroupTemplate>
<ItemTemplate>
<div class="productItem">
<div>
<img src='<%# Eval("ProductUrl") %>' >
</div>
<div class="catalog-price">
<br />
<%# Eval("ProductBrand") %>
<%# Eval("ProductModel") %></div>
<div class="catalog-price2">
<b>
Our Price: S$<%# Eval("NormalPrice") %></div>
</b><br />
<div class="cell1">
Add to cart</div>
<div class="cell2">
View details</div>
</div>
</ItemTemplate>

You have to pass the id of Selected Product to view the details of Selected Product.
Your ViewDetails button code should be like...
<asp:HyperLink ID="HypViewDetails" ImageUrl="~/Images/viewDetails.png"
NavigateUrl='<%#Eval("ProductId", "ProductDetails.aspx?cid={0}")%>'
runat="server"></asp:HyperLink>

Put the view details div in a hyperlink, coded with the model id?

checkbox.checkchanged event question. How do I find out which Checkbox was checked/unchanged

I'm using a Repeater:
<form id="form1" runat="server">
<div>
<asp:Repeater ID="repeater" runat="server" OnItemDataBound="repeater_ItemDataBound">
<ItemTemplate>
<tr>
<td>
<asp:CheckBox ID="checkbox" runat="server" AutoPostBack="false" OnCheckedChanged="Check_Clicked" data-id='<%# DataBinder.Eval(Container.DataItem, "ProfileID") %>'
Text="I agree" />
</td>
<td>
<asp:Label ID="lblProfileDesc" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "ProfileDesc") %>'></asp:Label>
</td>
</tr>
<br />
</ItemTemplate>
</asp:Repeater>
<asp:Button ID="btn" runat="server" Text="Click" onclick="btn_Click" />
</div>
</form>
I'm handling onCheckedChange however how can I find out which checkbox was clicked? Thanks in advance!

You can try
CheckBox checkBox = (CheckBox)sender;
var id = checkBox.Attributes["data-id"];

Maybe you should redesign your UI architecture, as it's not acceptable to cause a full post back only for a change of a CheckBox (which is a Boolean parameter). I think you can use ajax here:
$(function(){
$('input[type=checkbox]').click(function(){
// Initializing an ajax call here, and updating DOM based on response.
});
});