I got a user control containing a form. On a page that includes the user control, I need to populate the form in the user control, when the user pushes a button.
Heres how I've done it, and it doesn't work:
User Control:
public partial class editUC : System.Web.UI.UserControl
{
public DataTable dataTable { set { UpdateForm(value); } }
protected void Page_Load(object sender, EventArgs e) { }
private void UpdateForm(DataTable dt) { txtControl.Text = dt.Rows..... ... }
}
Where UpdateForm binds different text boxes.
And the page containing the UC, when a button has been clicked:
EditUserControl.dataTable = dt;
Clicking the button, nothing happens. What am I missing here?
Thanks in advance.
UPDATE:
I got a bit closer. It's because I'm using a jQuery dialog for the user control. It works if I remove the jQuery.
This is how I create the dialog:
$(document).ready(function() {
var dlg = $('.editFormDialog').dialog({
autoOpen: false,
height: 650,
width: 550,
modal: true,
bgiframe: true,
title: 'Rediger',
open: function(type, data) {
$(this).parent().appendTo("form");
}
});
dlg.parent().appendTo("form");
$('#btnEdit').live('click', function() {
$('.editFormDialog').css('visibility', 'visible');
$('.editFormDialog').dialog('open');
});
});
I am appending it to the form, but it doesn't work. Any ideas?
2nd update:
It works if I remove the update panels from the page. Any ideas? :-)
are you using Caching on the control? If the control's contents is cached using the ASP.NET control caching mechanism, then there will be no change on the control's text.
Can you add a breakpoint inside the private void UpdateForm(DataTable dt) to make sure this function gets called when you click on your button?
Depending on what the user control contains you might need to do a EditUserControl.DataBind();
If you are sending javascript code (jquery) as part of your update panel async postback, it's important to remember that javascript will not be evaluated by the browser. You need to find another method to run that code after your async postback.
Also, when you do an async postback on an UpdatePanel control, all the DOM elements in that control get trashed and replaced by new elements. The jQuery elements have to be re-created again.
User controls aren't meant to be as complex as this. They're meant to be a simple matter of pulling out some reusable portion of markup, then maybe adding a few properties, methods and events. They're not meant to do data binding. You really should rewrite tihs control as a composite server control.
That said, you'd probably get the most traction out of this by acting like it's a real server control. Binding to data would occur in the DataBinding event. In that event, you should set the DataSource property of the grid, then call DataBind on the grid.
Related
I'm developing a C# ASP.NET application under VS2010. I want to generate a dynamic table by writing HTML text into a literal, including dynamically inserted buttons on my table. I know how to create dynamic ASP.NET controls, but I have a small problem with dynamic HTML controls. I've created an HTML button but I don't know how to give it a server-side click function.
Can I create dynamic ASP.NET controls and insert them in my literal? How can I get a dynamically created button to trigger a server-side event?
I've used OnServerClick property for defining my server side function but it has no effect, how can I use this value?
If you want post back on your button click, you will have to add __doPostBack function on it's onclick event, for this you can add a button like
StringBuilder dynamicHtml = new StringBuilder();
dynamicHtml.Append("Your Html Code");
dynamicHtml.Append("<input type='button' id='btn1' name='btn1' onclick='__doPostBack(\'btn1\',\'\')' value='Click Here' />");
when you click on it, it will post back, and you can check Request.Form["__EVENTTARGET"] to find who post back the page.
By checking Request.Form["__EVENTTARGET"] in Page_Load event handler, you can call your any server side method like
protected void Page_Load(object sender, EventArgs e)
{
var eventTarget = Request.Form["__EVENTTARGET"].ToString();
if(eventTarget == "btn1")
{
CallMethod1();
}
}
private void CallMethod1()
{
//Code which you want to run
}
I have a GridView with dynamically created image buttons that should fire command events when clicked. The event handling basically works, except for the very first time a button is clicked. Then, the postback is processed, but the event is not fired.
I have tried to debug this, and it seems to me, that the code executed before and after the first click is exactly the same as for any other clicks. (With the exception that in the first click, the event handler is not called.)
There is some peculiarity in that: The buttons which fire the event are created dynamically through databinding, i.e. databinding must be carried out twice in the page lifecycle: Once on load, in order to make the buttons exist (otherwise, events could not be handled at all), and once before rendering in order to display the new data after the events have been processed.
I have read these posts but they wouldn't match my situation:
ASP.NET LinkButton OnClick Event Is Not Working On Home Page,
LinkButton not firing on production server,
ASP.NET Click() event doesn't fire on second postback
To the details:
The GridView contains image buttons in each row. The images of the buttons are databound. The rows are generated by GridView.DataBind(). To achieve this, I have used the TemplateField with a custom ItemTemplate implementation. The ItemTemplate's InstantiateIn method creates the ImageButton and assigns it the according event handler. Further, the image's DataBinding event is assigned a handler that retrieves the appropriate image based on the respective row's data.
The GridView is placed on a UserControl. The UserControl defines the event handlers for the GridView's events. The code roughly looks as follows:
private DataTable dataTable = new DataTable();
protected SPGridView grid;
protected override void OnLoad(EventArgs e)
{
DoDataBind(); // Creates the grid. This is essential in order for postback events to work.
}
protected override void Render(HtmlTextWriter writer)
{
DoDataBind();
base.Render(writer); // Renews the grid according to the latest changes
}
void ReadButton_Command(object sender, CommandEventArgs e)
{
ImageButton button = (ImageButton)sender;
GridViewRow viewRow = (GridViewRow)button.NamingContainer;
int rowIndex = viewRow.RowIndex;
// rowIndex is used to identify the row in which the button was clicked,
// since the control.ID is equal for all rows.
// [... some code to process the event ...]
}
private void DoDataBind()
{
// [... Some code to fill the dataTable ...]
grid.AutoGenerateColumns = false;
grid.Columns.Clear();
TemplateField templateField = new TemplateField();
templateField.HeaderText = "";
templateField.ItemTemplate = new MyItemTemplate(new CommandEventHandler(ReadButton_Command));
grid.Columns.Add(templateField);
grid.DataSource = this.dataTable.DefaultView;
grid.DataBind();
}
private class MyItemTemplate : ITemplate
{
private CommandEventHandler commandEventHandler;
public MyItemTemplate(CommandEventHandler commandEventHandler)
{
this.commandEventHandler = commandEventHandler;
}
public void InstantiateIn(Control container)
{
ImageButton imageButton = new ImageButton();
imageButton.ID = "btnRead";
imageButton.Command += commandEventHandler;
imageButton.DataBinding += new EventHandler(imageButton_DataBinding);
container.Controls.Add(imageButton);
}
void imageButton_DataBinding(object sender, EventArgs e)
{
// Code to get image URL
}
}
Just to repeat: At each lifecycle, first the OnLoad is executed, which generates the Grid with the ImageButtons. Then, the events are processed. Since the buttons are there, the events usually work. Afterwards, Render is called, which generates the Grid from scratch based upon the new data. This always works, except for the very first time the user clicks on an image button, although I have asserted that the grid and image buttons are also generated when the page is sent to the user for the first time.
Hope that someone can help me understand this or tell me a better solution for my situation.
A couple problems here. Number one, there is no IsPostBack check, which means you're databinding on every load... this is bound to cause some problems, including events not firing. Second, you are calling DoDataBind() twice on every load because you're calling it in OnLoad and Render. Why?
Bind the data ONCE... and then again in reaction to events (if needed).
Other issue... don't bind events to ImageButton in the template fields. This is generally not going to work. Use the ItemCommand event and CommandName/CommandArgument values.
Finally... one last question for you... have you done a comparison (windiff or other tool) on the HTML rendered by the entire page on the first load, and then subsequent loads? Are they EXACTLY the same? Or is there a slight difference... in a control name or PostBack reference?
Well I think the event dispatching happens after page load. In this case, its going to try to run against the controls created by your first data-binding attempt. This controls will have different IDs than when they are recreated later. I'd guess ASP.NET is trying to map the incoming events to a control, not finding a control, and then thats it.
I recommend taking captures of what is in the actual post.
ASP.NET is pretty crummy when it comes to event binding and dynamically created controls. Have fun.
Since in my opinion this is a partial answer, I re-post it this way:
If I use normal Buttons instead of ImageButtons (in the exact same place, i.e. still using MyItemTemplate but instantiating Button instead of ImageButton in "InstantiateIn", it works fine.
If I assert that DoDataBind() is always executed twice before sending the content to the client, it works fine with ImageButtons.
Still puzzled, but whatever...
I have a web user control (ascx) that exposes an "ID" property. What I want to do is set this property when the SelectedIndexChanged event fires in a gridview in the containing page. However, I can't seem to do it.... Here's my code:
protected void grdPhysicians_SelectedIndexChanged(object sender, EventArgs e)
{
physicians_certif1.mdID = grdPhysicians.SelectedDataKey.ToString();
mvData.SetActiveView(viewEdit);
panAdditional.Visible = true;
}
Physicians_certif1 is the user control. It seems the user control is loading before the SelectedIndexChanged event has a chance to set it's property.
Any ideas folks?
ASP.Net page lifecycles can be hard to understand especially with ascx user controls which also have their own lifecycle. If you are setting the mdID property in Page_Load of either the page or the ASCX control or have hardcoded a default value into it in the XHTML, it is probably being reset after SelectedIndexChanged fires.
Set a breakpoint in grdPhysicians_SelectedIndexChanged, set a watch on physicians_certif1.mdID and step through the code using the debugger.
Yes, that is exactly what is happening. You should look at (and be familiar with) the following resource:
ASP.Net Page Life Cycle
The page will load, then the control will load, then your events will begin to fire. If you have configuration needs based on event triggers, it is best either to place those configurations in the Page_LoadComplete or Page_PreRender events of the user control in question or apply "Rebinding" instructions in the Set method of your property:
public MyValue MyProperty()
{
get
{
return _myProperty;
}
set
{
RebindMyControls();
_myProperty = value;
}
}
I've got a rather lengthy question I'm afraid. I'm fairly new to ASP.NET so please bear with me.
I have built a control for an ASP.NET page that lists a number of options. Each option has two clickable areas (call them buttons for the sake of simplicity). One to select the option and one to hide the option.
protected void Page_Load(object sender, EventArgs e)
{
RenderOptions();
}
public void RenderOptions()
{
for (int i = 0; i < 5; i++) {
HtmlGenericControl div1 = new HtmlGenericControl("div");
div1.Attributes.Add("onclick", ClientScript.GetPostBackEventReference(this, "option" + i));
m_TreeContainer.Controls.Add(div1);
HtmlGenericControl div2 = new HtmlGenericControl("div");
div2.Attributes.Add("onclick", ClientScript.GetPostBackEventReference(this, "option" + i));
m_TreeContainer.Controls.Add(div2);
}
}
public void RaisePostBackEvent(string arg)
{
//do something
}
This works fine (I do implement the IPostBackEventHandler interface). The problem here is that there doesn't seem to be a way for me to find which HTML element was clicked and thus which action should be performed in the RaisePostBackEvent method.
What I tried to do is create a new class (HtmlDivControl) which looks like this:
class HtmlDivControl : HtmlGenericControl, IPostBackEventHandler
{
#region Delegates
public delegate void ClickEventHandler(object sender, string eventArgument);
#endregion
#region Properties
private ClickEventHandler m_Click;
public ClickEventHandler Click
{
get { return m_Click; }
set { m_Click = value; }
}
#endregion
#region Constructors
public HtmlDivControl()
{
}
#endregion
public void RaisePostBackEvent(string eventArgument)
{
m_Click.Invoke(this, eventArgument);
}
}
Now I made div1 and div2 my HtmlDivControl rather than HtmlGenericControl, set the Click property to a method (delegate) and passed the div (div1 or div2) itself as control for the GetPostBackEventReference method. This time, I could not only differentiate between the divs but also pre-determine the action that should be performed. However, the RaisePostBackEvent for controls are called after PageLoad. So the problem I'm with now is that the whole options control is rendered before the events are handled (and thus, an option that should for instance be hidden isn't because the actual hiding happens after the rendering). Moving the RenderOptions() call to the PageLoadComplete method doesn't help either, since then the div controls won't exist yet.
I'm pretty sure I'm missing something quite fundamental here. But could someone please explain me how I should approach something like this?
p.s.
How am I supposed to write underscores here? They're used to make text italic? Is there some escape character?
For someone new to ASP.Net, you've done pretty well so far. Your roadblock here is actually the way you are thinking about the issue. You should get a good grasp of the ASP.Net Page Lifecycle - you are missing something very fundamental.
In a nutshell, you want your page to rebuild it's state to the same way it was before the postback. Then process your events. Then make any state changes.
You're thinking about it as if your html controls should know about their state change at the start of the request, which is incorrect. There has to be the rebuilding phase first. This is critical for ASP.Net to even figure out which events to raise.
What I would recommend:
move your "RenderOptions()" method to the Page_Init handler. This will save you lots of issues if you ever incorporate ViewState into your controls. (I would also rename it, as it's not truly rendering anything, it's just adding your controls to the page. Render has a specific context in ASP.Net).
Then, in your OnClick event handlers for your controls, simply set your controls visibility as necessary, rather than trying to control the way they are rendered. It is always much simpler to set controls to Visible=False rather than try to change the way the controls are being rendered to the page. Remember that if you set Visible=False, there will be zero html sent to the response for that control, but the server will still know it's on the page, so you can still deal with it.
Think about your event handlers as the place where you will change the state of the page. It's where your logic should be in this case, rather than in Page_Load.
I am using an ASP.NET ModalPopupExtender on a page and would like to prevent the dialog from hiding when the user presses the ok button in certain conditions. But I can't seem to find a way.
What I am looking for is something like this
ajax:ModalPopupExtender
...
OnOkScript="return confirm('You sure?')"
...
if confirm is false, then the modal dialog doesn't disappear.
From my understanding in your specific situation you would not wire up the button, and just wire up a script to handle the conditional, then you can close it via JS.
The following JavaScript function will allow you to achieve this:
function conditionalHide(clientID)
{
if (confirm('You sure?'))
{
$find(clientID).hide();
}
}
You can wire this up to your asp:Button control in the Page_Load event of your page
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
btnOK.OnClientClick = string.Format("conditionalHide('{0}'); return false;",
panPopup_ModalPopupExtender.ClientID);
}
}
Some notes:
panPopup_ModalPopupExtender is your ModalPopupExtender
The return false; prevents a postback from occurring when the user clicks the button
You could hard-code the ClientID of the ModalPopupExtender, but this introduces an (additional) maintainance headache. The approach shown is the best one that I've found to alleviate this overhead