Currently, I am using RadTreeView Telerik control for showing hierarchical data along withadd/edit/delete functionalities for each node. Using TreeView - Context Menu, that has been achieved, but I am trying to implement it as shown in below:
It works the following way:
a) When a node is expanded by clicking "+" icon, "Add Group" button is visible at the bottom of its last child.
b) When a node is selected, "Edit" and "Delete" icons appear.
On clicking any of those icons will open a Dialog for respective actions.
So, I need to replace Context Menu with the display shown in mock. I tried to use NodeTemplate something like below:
<NodeTemplate>
<div>
<span>Test</span>
</div>
</NodeTemplate>
but, it makes the text of all nodes as "Test".
Can somebody please help me out?
<script type="text/javascript">
function OnClientContextMenuItemClicking(sender, args)
{
var menuItem = args.get_menuItem();
var treeNode = args.get_node();
menuItem.get_menu().hide();
switch (menuItem.get_value())
{
case "edit":
treeNode.startEdit();
break;
}
}
</script>
Hope this helps,
I implemented the RadTreeView in serverside. I though it is easy to manage in server side, specially when it comes to binding and handling the events
This is my Default.aspx.cs
using Telerik.Web.UI;
public partial class Default : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
}
protected void RadTreeView1_NodeEdit(object sender, RadTreeNodeEditEventArgs e)
{
// This is the serverside event that is triggered on Edit
RadTreeNode nodeEdited = e.Node; // This is the current node that is clicked
string newText = e.Text;
nodeEdited.Text = newText;
}
//
//.........
//.........
}
This is something extra. In server-side you can also find a node like this,
RadTreeNode node = RadTreeView1.FindNodeByText("TestOne");
// now edit and change any test
node.Text = "Test";
I hope this helps.
Related
I made a webForm in which I simply put a DropDownList like this :
<table>
<tr>
<td>
<dx:ASPxDropDownEdit runat="server"></dx:ASPxDropDownEdit>
</td>
</tr>
</table>
How can I programmaically add item in it ? I would like to display simple text (like "Item1", "Item2, ...) when clicking on the down arrow of this element.
From: ASPxDropDownEdit Overview
The ASPxDropDownEdit represents an editor containing an edit box to
display the editor value and a specific button, that opens a dropdown
window whose content can be templated. The main purpose of the
ASPxDropDownEdit is to allow you to define its value based upon the
value(s) of other control(s) integrated into the editor's
DropDownWindowTemplate.
As per the documentation, you can not use it as like a combo box control. I suggest you use ASPxComboBox, which let you implement this functionality in easy way.
If you desperate to implement the DropDownEdit control then you need to create its DropDownWindowTemplate programmatically. Follow the below approach and you can try to implement what you want to accomplish.
// Assign DropDownWindowTemplate property to custom template
protected void Page_Load(object sender, EventArgs e)
{
ASPxDropDownEdit1.DropDownWindowTemplate = new CustomTemplate();
}
//Template class that implement ITemplate interface.
public class CustomTemplate:ITemplate
{
public void InstantiateIn(Control container)
{
ASPxListBox listBox = new ASPxListBox();
listBox.Items.Add("Item 1");
listBox.Items.Add("Item 2");
listBox.Items.Add("Item 3");
container.Controls.Add(listBox);
}
}
Refer this:
Creating Web Server Control Templates Programmatically
I have a small problem. I am developing an online seat reservation system which allow users to click and select seats. I am using buttons for seats. I am writing a method for the button click event for all buttons. I need to know how to identify the id of the button, user clicked. thanks in advance.
When you use a button clicked event, the signature of the method that'll handle the event goes like this:
protected void foo (object sender, EventArgs e)
sender in this case is the button that was clicked. Just cast it to Button again and there you have it. Like this:
Button button = (Button)sender;
string buttonId = button.ID;
You can have all your buttons pointing their Click event to the same method like this.
The first parameter of your event handler (object source or sometimes object sender) is a reference to the button that was clicked. All you need to do is cast it and then you can retrieve the id value, e.g.:
void Button_Click(object sender, EventArgs e)
{
Button button = sender as Button;
if (button != null)
{
//get the id here
}
}
I think there's another way to do this method you may not thought of it,
why don't you put an
Image control
you only need switch the image's color for this method, the first one we assume that it's Red and it means free seat, and the second one is Blue and means taken .
here is a link you may need to know about this issue How to change color of Image at runtime
Hope I could gave you a better idea. thank you
I know this is an old thread but hopefully it helps someone out there having the same trouble I was here in 2019! This is my solution using the Tag property of the button with Binding through XAML. Worked great for me, even though it might be a little hacky:
In your button click event:
private void Button_Click(object sender, RoutedEventArgs e)
{
Button EditButton = (Button)e.Source;
int id = Convert.ToInt32(EditButton.Tag);
//do your stuff
}
In your XAML:
<Button Click="Button_Click" Content="Edit" Tag="{Binding whateverInt}" />
I have a sharepoint web part where I am programatically adding a button to the page. When the button renders, it has no name or ID. I am doing the following in the code behind of the web part:
public class ChartControl : WebPart
{
protected Button BubbleChartApplyButton;
protected override void CreateChildControls()
{
BubbleChartApplyButton = new Button {Text = "Apply This"};
}
protected override void RenderWebPart(HtmlTextWriter output)
{
BubbleChartApplyButton.RenderControl(output);
}
}
and this is what gets rendered:
<div WebPartID="4844c2e5-2dd5-437b-a879-90c2e1e21f69" HasPers="false" id="WebPartWPQ2" width="100%" class="ms-WPBody ms-wpContentDivSpace" allowDelete="false" style="" >
<input type="submit" value="Apply This" />
...more output here...
</div>
Notice how the input tag gets rendered with no name and no id... I would expect to see something like ID="ctl00$m$g_2d506746_d91e_4508_8cc4_649e463e1537$ctl13" or something.
Any ideas as to why the button control is not rendering with the name and IDs that .NET normally generates?
Thanks,
Ryan
Ugh, it was a simple thing I overlooked. So I am creating the control and rendering it to the output so it shows up when the page is rendered. BUT, in order for it to be dialed into the control tree so that ASP.NET assigns IDs and I can wire it up to an event handler, I MUST specifically add it to the control tree.
So I also needed to do this:
protected override void CreateChildControls()
{
BubbleChartApplyButton = new Button {Text = "Apply This"};
Controls.Add(BubbleChartApplyButton) //<== ADD TO THE CONTROL TREE BEAVIS!
}
Have you tried something like:
BubbleChartApplyButton = new Button {Text = "Apply This", ID = "myButtonID"};
I want to set the node colors of a treeview at runtime. I populate the treeview from a collection that has the parentid, childid, and description, and I've added a property representing the color I want applied to the node. FWIW the source is a database, the app is C#.
In a gridview I use RowDataBound() to programmatically affect the control. Im not sure how to do so in the treeview, including which event to use (DataBound()? TreeViewDataBound()?). My research has not been fruitful so far. A code snippet would be very useful.
Hopefully this will give you a raging clue.
When setting a node text, instead of setting
Node Text
set as
<div style='color: red'>Node Text</a>
you can use Prerender event:
protected void TreeView1_PreRender(object sender, EventArgs e)
{
if (IsPostBack) return;
foreach (TreeNode t in TreeView1.Nodes)
{
if (t.Value.EndsWith("1")) //Some Condition
{
string s = t.Text;
string fs = "<span style=\"color: #CC0000\">" + s + "</span>";
t.Text = fs;
}
}
}
Since .NET Framework 4.5 you can use these style properties:
TreeView.LevelStyles Property - represent the node styles at the
individual levels of the tree
TreeView.RootNodeStyle Property
TreeView.ParentNodeStyle Property
TreeView.LeafNodeStyle
Property
Assuming you are dealing with the standard TreeView control, you can do this in the TreeDataBound Event.
A brief example (not tested):
<asp:TreeView runat="server"
ID="tvMyTreeView"
OnTreeNodeDataBound="tvMyTreeView_TreeNodeDataBound"
/>
And the backend:
protected void tvMyTreeView_TreeNodeDataBound(object sender, TreeNodeEventArgs e)
{
DataRowView dr = (DataRowView)e.Node.DataItem;
e.Node.Style.Add("color", dr["COLOR"].ToString());
}
If you are using the Telerik RadTreeView, then the event name is NodeDataBound
You will probably have to tweak the example to better fit your needs, but hopefully this will get you started.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
.Net Changes the element IDs
I have the following problem (I'll explain it simplified because otherwise it would get too complicated/long).
I need to create an ASP.net server control that is inherited from Panel. Simple enough. When the custom control renders, it should dynamically create a Button, associate an event handler to it (which will also be defined inside the server control) and add this button to the rendered control. The click event handler defined inside the server control does some job which for the moment isn't interesting.
I already coded an example and that works fine. In the constructor of the server control I create a new button control, give it an ID, associate an event handler, on the OnInit of the server control I add the button to the Panel controls (remember, my control inherits from Panel) and then everything gets rendered. This looks something like the following:
public class MyCustomControl: Panel
{
private Button myButton;
public MyCustomControl()
{
myButton = new Button();
myButton.ID = "btnTest";
myButton.Click += new EventHandler(btnTest_Click);
}
protected void btnTest_Click(object sender, EventArgs e)
{
//do something...
}
//...
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
this.Controls.AddAt(0, myButton);
}
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
//...
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
}
protected override void Render(HtmlTextWriter output)
{
base.RenderContents(output);
}
}
This works quite fine. The button gets rendered correctly and when I click on it, the appropriate handler inside this customer server control is invoked and executed. Now the problem however starts when I would like to add multiple instances of this server control to my page because all of my generated buttons will have the same id "btnTest" which results in a conflict. So what I tried is to associate a random number to the id of the button, s.t. it end up being "btnTest1235512" or something similar. This solves my problem with the multiple IDs, but results in the problem that my event handler when clicking on the button is no more called correctly. I guess this is due to the problem that my button always gets another id when entering in the constructor and so the appropriate callback (btnTest_Click event handler) isn't found.
Can someone give me a suggestion how I could handle the problem. Is there some way for remembering the ID of the button and re-associating it. As far as I know however this has to happen in the OnInit, where the ViewState isn't yet available. So storing the id in the ViewState wouldn't work.
Any suggestions??
Implementing INamingContainer should fix the problem. You can then keep naming all your buttons btnTest.
This is just a marker interface so you don't have to implement any methods or properties.
Inherit from INamingContainer like:
public class MyCustomControl : Panel, INamingContainer
{
}
This is a marker interface and requires no implementation. I just verified with your code and it solves your problem.
Implementing INamingContainer will do it for you. It will automatically name the buttons with unique ID's. Just a note, if you need to use any of those buttons in any JavaScript, you'll need to use the ClientID property:
function getButton() {
var myButton = document.getElementById('<%=btnTest.ClientID %>');
}