I have a division something like :
<div id="divAdditionalInfo" runat="server">
//html code here
</div>
In code behind, I need to prompt out a small window (generate by this div) more than 1 time.
Because it is the same div, so I only can see the final time window pop up.
My main question is, Can I change the div id in code behind?
and then use the div id to pop up another window.
Something like :
divAdditionalInfo.Style["visibility"] = "visible";
divAdditionalInfo.Style["display"] = "table-cell";
After change :
divAdditionalInfo.ID = "div2";
But I cant write code like :
div2.Style["visibility"] = "visible";
I only can write back :
divAdditionalInfo.Style["visibility"] = "visible";
There is find control method for panel, text box, button and so on, but how about division?
Can find control division?
something like :
Division d = (Division).FindControl("div2"); //find control on the div id that just change
d.Style["visibility"] = "visible";
kindly comment my question is not clear : )
I have tried something like this.
aspx file:
<div id="div1" runat="server">
<asp:Label ID="lbl1" runat="server" Text="Div ID: "></asp:Label>
</div>
<asp:Button ID="btn_change" runat="server" Text="Change" OnClick="btn_change_Click" />
On button Click event:
div1.ID = "div2";
lbl1.Text = lbl1.Text + div1.ID.ToString();
It will change the ID of div for the temporary. Button when you refresh the page it will automatically get the ID which you have specified on ASPX page.
I think this will work when the ID is chenged by you at that time you can perform the operations you want to perform.
You will able to find Div Tag in FindControl() of panel or form but in Code behind You will not have the Division Control or something like that. Because it not the Asp.Net control it is typical HTML control.
Related
I have a div of the form
<div id="mydiv" runat="server" style="display:none"></div>
In my code behind, I attempt to change the display to block by
mydiv.Style["display"] = "block";
When I view the source code after the piece of code above is run, the page source reflects the change (i.e. the div's display is set to block) but the visible page does not. How can I get my page to show the div?
Where is your code mydiv.Style["display"] = "block";? I just test it in Page_Load,and in the view page,it displayed,and the code in page source is this
<div id="mydiv" style="display:block;">12345</div>
I set innerhtml to have a good view
I have a basic url redirect on a DIV's onclick.
<div onclick="location.href = 'page.aspx';">
I have a need to do some work server side, rather than just a redirect, when this Div is clicked.
How do I call one of my code behind functions from the DIV onclick? The DIV is the parent control inside a usercontrol. I suppose I can "fix" it by using a literal control and writing a query string into the onclick, but I would use that as a last resort as I don't want to use a query string.
Are there any other ways of catching a DIV click in code behind that I may have missed?
You can have a button whose display can be 'none'.
Handle click of Div on client side and then from there fire the Click of that button and handle the thinks Server Side on the Click Event of the button.
<asp:Button runat="server" id="btnHidden" style="display:none" onclick="btnHidden_OnClick" />
<div onclick="javascript:DivClicked(); return true;"></div>
<script>
function DivClicked()
{
var btnHidden = $('#<%= btnHidden.ClientID %>');
if(btnHidden != null)
{
btnHidden.click();
}
}
</script>
I am working in VS10 using C# in ASP.NET. In my design form, I have a textArea(standard HTML control).
<textarea id="Text1" rows = "8"; cols="30" onkeyup="AutoGrowTextArea(this)" name="S1"> </textarea>
Now in my code-behind page, I am using C# to code the controls. I have given the textArea an auto-expand functionality which I require thru out my project. I need this TextArea as a server control, like when we put a textBox in the design page, we can use it in the code-behind page to code, since it is a server control. However, textArea isn't a server control.
I have gone thru the previous posts on the site but i did not get anything enough useful.
I have even tried using [<% %>] system, and [runat="server"] but it did not help.
What i wanna do is to use the textArea in the Code-behind page, i.e. call it in the coding space, just like we can call the TextBox control objects.
So, can anyone please help me with this,,,
Regards..
javascript for autogrowing text box is:
<script type="text/javascript">
function AutoGrowTextArea(textField)
{
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height = textField.scrollHeight + "px";
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height = (textField.scrollHeight * 2 - textField.clientHeight) + "px";
}
}
}
</script>
Try this
add runat="server" to the tag
<textarea id="Text1" runat="server" rows = "8" cols="30" onkeyup="AutoGrowTextArea(this)" name="S1"> </textarea>
you can manipulate raw html controls setting the runat="server" propery of the control.
<textarea id="Text1" runat="server" rows = "8"; cols="30" onkeyup="AutoGrowTextArea(this)" name="S1"> </textarea>
You can add runat="server" in your markup and it will be a server control.
You can also create server controls in your code behind. Declaration (In Visual Basic):
Protected WithEvents foo As Global.System.Web.UI.HtmlControls.HtmlGenericControl = Global.System.Web.UI.HtmlControls.HtmlGenericControl("textarea")
If you want to use something in all your project, you can declare a class inherited from Control or HtmlGenericControl and you can implement whatever you need to implement everywhere where you your new control.
<asp:TextBox id="thisIsMyTextBox" runat="server" multiline="true" width="200px" onkeyup="AutoGrowTextArea(this)" height="80px" style="resize:none;"></asp:TextBox>
You can play with the width/height as you wish !
function AutoGrowTextArea(textField)
{
if(textField.Lenght()%50==0)//50 is the number of character in your textbox
{
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height = textField.scrollHeight + "px";
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height = (textField.scrollHeight * 2 - textField.clientHeight) + "px";
}
}
}
This is question is in relation to my last question in case you want some more background information.
My question is: Is it possible to make a cell in an asp.net Table clickable?
Or Is it at least possible to make a clickable WebControl (which should be possible to place in a ControlCollection), that is not a Button or a LinkButton, in ASP.NET?
And if not, is it possible to multiple lines of information into the button text?
I've tried adding other components to the button's ControlCollection (which I've seen working in the Windows Forms version of the Button), to see if I could render child components to a button, but without success:
private void ModifyTableCell(TableCell cell)
{
//Create new button
Button btnCell = new Button();
btnCell.Click += (sender, args) =>
{
//Event for the button
};
//Create new Label
Label lblCell = new Label();
lblCell.Font.Bold = true;
lblCell.Text = "This text won't appear";
btnCell.Controls.Add(lblCell); //Attempt to add label to Button
cell.Controls.Add(btnCell);
}
EDIT: I ended up just creating a multi-lined LinkButton for the entire cell.
You should be able to make pretty much any control clickable by assigning an onclick attribute and leveraging the __doPostBack function.
ctrl.Attributes["onclick"] = string.Format("__doPostBack('{0}', '{1}');", ctrl.ClientID, "SomeArgument");
You could also use the GetPostBackEventReference method too. This option is actually safer, because it will register the __doPostBack function it doesn't already exist:
ctrl.Attributes["onclick"] = Page.ClientScript.GetPostBackEventReference(ctrl, string.Empty);
Then, in the code-behind you can simply override the RaisePostBackEvent method:
protected override void RaisePostBackEvent(IPostBackEventHandler source, string eventArgument)
{
base.RaisePostBackEvent(source, eventArgument);
if (eventArgument == "SomeArgument") //using the argument
{
//do whatever
}
}
You can add multiple lines to a asp.net button by using the string builder, something like:
System.Text.StringBuilder buttonText = new System.Text.StringBuilder();
buttonText.AppendLine("first line");
buttonText.AppendLine("second line");
btnMultiline.Text = buttonText.ToString;
I am not sure how you imagine such a composite control would be rendered. Remember that each ASP.NET control in the end outputs HTML. You Button essentially outputs a
<input type="button">The button text</input>
If you want to place anything else inside the <input> tag, it must be HTML-compatible. I'm not sure the input tag allows other HTML inside.
If it is a LinkButton on the other hand, the generated HTML markup is an <a href=""> tag. You can put anything there, even an image if you wish, which will become clickable.
I am not sure what is your full scenario, but what you're trying to do smells bad. I suggest that you either use a LinkButton or rethink your approach, just have in mind what the final output in HTML would be.
In reading both of your posts, it looks like you want to be able to click on anything in the cell and have it post back as if the whole cell were a button?
If so, one of the fairly simple ways to do it is to build your cell content as you would if you were not trying to post back. Then add a button with a style of display:none;. You can then use client side scripting to capture the click event of the cell, and raise the click event of the button to cause a post back.
This allows you to create the cell content in any way you like, and the postback code and handlers are automatically generated for you.
Using JQuery you end up with something along the lines of this:
<head runat="server">
<style>
input.ClickableCellButton
{
display: none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("td.ClickableCell").click(function (event) { $(event.target).children("input.ClickableCellButton").click() });
});
</script>
<div>
<table>
<tbody>
<tr>
<td class="ClickableCell">
Cell Contents<br />
on multiple lines
<asp:Button ID="Button1" runat="server" Text="Button" CssClass="ClickableCellButton"
OnClick="Button1_Click" />
</td>
</tr>
</tbody>
</table>
</div>
</form>
</body>
And if not, is it possible to multiple lines of information into the
button text?
For this particular case, you can accomplish this via CSS only; no need to extend Button:
<asp:button id="myMultilineButton" runat="server" style="width:60px; white-space: normal;" Text="Several lines of text" />
It will render as:
I building an online CV application that allows the user to add new education sections that consist of a number of text boxes and labels.
What is the best way of dynamically creating the form elements and reading them depending on whether the user hits an [Add another] button.
1) server side :In your asp.net button click event , Create the required controls (text box, drop down etc..) dynamically and add that to a conainer like a Panel.
2)Client Side : Using javascript create elements and append to an existing container (div). In this approach, you save a server round trip because you are doing it in the client side.
Here is a javascript sample using jquery which will give you an idea.
HTML
<div id="divContainer">
Education 1 <input id="txt1" type="text" class="txtBox"/>
</div>
<input id="btn1" type="button" value="Add Another" />
Javascript
var counter=1;
$("#btn1").click(function(){
counter++;
$("#divContainer").append("<br/> Education "+counter + " <input type='text' id='txt"+counter+"' class='txtBox' />");
});
Here is the working sample : http://jsfiddle.net/huYMT/13/
I don't know the best way unfortunately but I can tell you what I did in web forms when I used to use them.
I made a PlaceHolder where I could dump in controls on the fly type of thing. I made a UserControl that could be repeated again and again that had public properties. I wrapped an UpdatePanel around the PlaceHolder and attached a click event tied to the UpdatePanel so the user would have the AJAX experience.
Here is kind of a quick summarized version of the code. I can give you the full source if you want. Let me know.
<script runat="server">
void aspx_Init(object sender, EventArgs e)
{
AddCreditCardReceiptButton.Click += new EventHandler(AddCreditCardReceiptButton_Click);
}
void AddCreditCardReceipt()
{
AddCreditCardReceipt(this.ID + "_" + Guid.NewGuid().ToString("N").Substring(0, 5));
}
void AddCreditCardReceiptButton_Click(object sender, EventArgs e)
{
AddCreditCardReceipt();
CreditCardReceipt lastAdded = (CreditCardReceipt)CreditCardReceiptPH.Controls[CreditCardReceiptPH.Controls.Count - 1];
lastAdded.ContainerStyle = "display:none";
ScriptManager.RegisterStartupScript(lastAdded, typeof(CreditCardReceipt), lastAdded.ClientID,
"$('#CreditCardReceipt_" + lastAdded.ClientID + "').toggle(500);", true);
}
</script>
<asp:UpdatePanel runat="server" id="CreditCardReceiptUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:PlaceHolder ID="CreditCardReceiptPH" runat="server" />
<asp:Button runat="server" ID="AddCreditCardReceiptButton" CausesValidation="false" Text="(+) Add Credit Card Receipt" /></div>
</ContentTemplate>
I prefer to create a user control for education section.
And if you hit the add button, The click event of button could dynamic add a new user
control in UI.