How to make Dropdown List with checkboxes? - c#

How do we make a drop down list with checkboxes? C# lang is preferred for this.

You can't. Not a real one anyway, but you can fake one by making a scrolling div which appears when you click a button (using JQuery):
<div id="cbListDiv" style="height: 172px; width:300px; overflow-y:scroll; border:1px solid silver; margin-top:8px;">
<asp:CheckBoxList id="cbList" runat="server" RepeatLayout="Flow" />
</div>
Then you'd need to add some code to display or expand that region when you click a link on the page. That's about as close as you can get I think.

Related

Change button text on ASPxPopupControl buttons

I am trying to change the text of ASPxPopupControl buttons (I have not written the ASPxPopupControl code myself. Those guys are long gone. :) So it's up to me). As far as I know, the ASPxPopupControl default buttons are used and if I want to change the button text I have to add code to the .aspx file. I have tried searching for an answer on the DevExpress docs and the world wide web. But could not find anything that matches my needs. I am very grateful for any ideas.
This is the buttons I am talking about:
The ASPxPopupControl code (There is an attempt to add a custom button but it does not work.):
<dxpc:ASPxPopupControl ID="someLongID" runat="server"
AllowDragging="True" ClientInstanceName="someLongID"
CloseAction="CloseButton" HeaderText="Varning!" Modal="True"
PopupHorizontalAlign="WindowCenter"
Width="300px">
<ContentCollection>
<dxpc:PopupControlContentControl ID="PopupControlContentControl3"
runat="server" Enabled="True">
<p>
<br />
</p>
<p align="right">
<input
id="Button1"
onclick="javascript:someLongID.Hide();"
type="button" value="Stäng" />
</p>
</dxpc:PopupControlContentControl>
</ContentCollection>
<HeaderStyle BackColor="#FFB6C1" />
</dxpc:ASPxPopupControl>
If you don't implement you own popup edit form, but use the built-in one, it is necessary to access the required text setting via the ASPxGridView.SettingsText (CommandUpdate, etc.).
I think you can change the text content in the item property (in "Properties") which is located in the right down corner on VS.
you can click on the item in "Design" mode and then check its setting in "Properties"
Hope this helps

C# Access asp control from Parent page

I have a parent page containing an iframe, an ASP label and a button.
When the user click on the parent button, it will display some table results inside the iframe.
Now i would like to display the parent label with different text and color depending on the results of the iframe.
So i m trying in the code behind (C#) of the iframe to retrieve the label from the parent and assign it a CssClass. But no matter what i do it always come back with a null reference when trying to find the control from the parent.
Can someone please help?
Parent page code:
<div class="search-row">
<div class="search">
<button id="btnSearch" type="submit" class="button button-block">Search</button>
</div>
<div class="search" style="padding-top: 20px;">
<asp:Label ID="wrapperResponse" CssClass="resp" runat="server">TEST</asp:Label>
</div>
</div>
<div id="iframeDiv">
<iframe name="my_frame" width="100%" height="350px" src="Results.aspx" scrolling="no" frameborder="0"></iframe>
</div>`
The Results.aspx will display a table with some html build dynamically.
Now let s say if resulting Table has one row, i would like Label WrapperReponse to be in Green and says "1 row" but if 2 rows then i would like it to be in Red and says "2 Rows"
In my Results.aspx.cs i tried
String test= String.Format("{0}", Request.Form["wrapperResponse"]);
Label statusResponse = (Label)this.FindControl("wrapperResponse");
Label statusResponse2 = (Label)Parent.FindControl("wrapperResponse");
Any ideas are welcome!
thanks
Well, just a couple of points needed mentioning here. Food for thought.
In order to access the asp label control, you need to do it on the parent page instead of on the results page.
I would suggest you reconsider the design of the page. Do you really have to use the iframe here? Why not place your button and label controls on the results.page directly? Or perhaps make results.aspx as an ASCX user control, so you can embed it on the parent page.
Hope it helps

How do I make a SQL Query only fire when a user "expands" a gridviewrow?

At the moment, I have a GridView that pulls from a SQL data source. Every row has a summary in it, and when a user clicks expand on the row, they get a DetailsView with the details of that particular item in it.
I'm looking for a way to make it so DetailsView only binds to the DataSource when the row is expanded. At the moment it happens on RowDataBound, which results in heaps of queries going back and forth between the SQL server and the ASP NET server.
I'd also like to use Bootstrap to expand and collapse these rows, so it looks good when it expands or collapses.
Any help would be very much appreciated :) I've really tried to find some resources that would assist me in the above, but I've come up bumpkis. The closest I've gotten is an AJAX CollapsiblePanel, but it loads everything at Page_Load anyway.
You are battling two different areas here, and this comment is the one that makes it more complicated:
I'd also like to use Bootstrap to expand and collapse these rows, so it looks good when it expands or collapses.<
What I did was use BS panels and a repeater and with this approach, you can still databind details on a click event but you need some hidden controls inside your item templates for your DetailsView to bind the correct data. When you "loop" through your summary data, you'll need to provide an accurate link to BS expanding child - presumably an identifier and then another hidden control with the same. Run the link on the server so you can have a click event and assign the datasource and databind there.
Depending on how long it take your data to load, you might consider avoiding the databind on every click. If you are using BS to make it elegant, it seems counterproductive to add a postback - at least on the user experience/elegance side. I understand the want to avoid so many data calls though.
Hopefully this will get you started:
<asp:Repeater ID="RepeatCont" runat="server" ClientIDMode="Static">
<HeaderTemplate>
<div class="panel-inner">
<div class="panel-group" id="accCont"> // parent
</HeaderTemplate>
<ItemTemplate>
<div class="panel panel-dark-gray">
<div class="panel-heading">
<h5 class="panel-title">
<a class="panel-toggle" data-toggle="collapse" data-parent="#accCont" href='<%# "#" + Eval("MATCHID1") %>'> // add a postback here with linkbutton or javascript postback force - easier just do bind your child data because you'll have two different trying to happen - postback and data-toggle
<div>
//stuff on the panel
</div>
<div class="clearfix">
<br />
</div>
</a>
</h5>
</div>
<div id='<%# Eval("MATCHID1") %>' class="panel-body collapse">
//Hidden label with your MATCH ID 1 again - this is where you will tell your DetailsView to look for parameter
//put your details view here
</div>
</div>
</ItemTemplate>
<FooterTemplate>
</div>
</div>
</FooterTemplate>

How to change image without refreshing the page

I have a website where the user can select different cards. I need a way where when a new card is selected then the page does not refresh. When I click the back button now it just goes back to previous selections. I need it to go back to the previous page. Here is the code for the image change
<div class="imgCard" style="padding-right: 50px">
<asp:ScriptManager ID="ScriptManager" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">
<ContentTemplate>
<fieldset style="border-width: 150px; border-style: none">
<asp:Image ID="imgCardChoice1" runat="server" />
<br />
<br />
<a id="openChange1" href="#" style="color: Red">Change Card</a>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</div>
When the user clicks on "Change Card" then a jquery modal box opens and allows them to change the card. Thank you for any help/advice. If needed the code behind to select a new card is in C#.
Without knowing more, it sounds like you need to use AJAX to do that. If you are already using jQuery, check out jQuery.load(). You can make an AJAX request to a url on your site that will only return the image information and load that into the element you specify.
Here is a link to the docs:
http://api.jquery.com/load/
Try to use some javascript function.
create a div where you want to put your image.
then give him an ID, on javascript function call the div id and change the src to the image that you want to put.
on your link or wathever you have to change the image, call the onclick function and use the javascript function.
On my website i have 2 images, that onmouseover change an image in other div completely different.
see it on:http://roundhillevents.com
and pass the cursor on the facebook and on the youtube logo's.
If nothing appears, let stay the cursor over that a little while.
PS: Only works with forefox and don't know why.

how to make a part of the textbox as readonly

i have a tagtextbox on my page
when a user selects a category that category name goes to tagtextbox
now i want that this category name user cant change but he can append some more tags
means first tag becomes readonly and further he can add too in same text box
This is not possible.
Instead, you can put the first category name in a <span>, and put the textbox after the span.
You can then apply border: none to the textbox and make your own border around the entire thing to make it look like a single textbox.
CSS :
<style type="text/css">
.div {
margin:20px;
padding:10px;
background:#ccc;
float:left;
}
.textarea {
border:0;
display:block;
font-size:12px;
padding:5px 5px 0;
outline:none;
}
.span {
display:block;
background:#fff;
font-size:14px;
padding:5px 5px 5px;
color:green;
outline:none;
}
</style>
HTML :
<div class="div">
<div class="span">
<asp:TextBox runat="server" ID="txtNumber" BorderStyle="None" />
<asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" ValidationExpression="\d+" ControlToValidate="txtNumber" ErrorMessage="Only Numbers are allowed" Display="Dynamic" />
</div>
</div>
You can't make part of a textbox editable and another not.
My suggestion would be to change the type of element from a TextBox to a div or span via Javascript as soon as the user begins to enter the next tag.
If you want to allow append has in "paste" action, then you can't do that. Else and you just want to append via your code, why not use just a div to show what he has selected and add the selections to your post on a hidden textbox?
Adding to what SLaks said - Here is an example of a CSS & HTML hack where someone has added a span under the textbox. To make it look like it is part of the same textbox there is a border round the enclosing div. It looks quite effective.
textbox with uneditable name at the bottom

Categories

Resources