how to create a control designer dynamically adding textboxes according to user input
I saw a video at www.sitefinity.com/.../ldquo_hello_world_rdquo_guide_to_custom_sitefinity_widgets_amp_controldesigners about how to create custom widgets and the corresponding control designers.
My question is: how to create a control designer, initially with only one textbox for entering an integer number, e.g., k. After that, k textboxes are dynamically appended.
Hello Yinfang,
Thank you for using the Sitefinity forums.
I recommend you Sitefinity Thunder as a great time saver when you are creating designers for user and custom controls. Also it will easily allow you to register them as a page widgets.
To install and configure Sitefinity Thunder read this documentation: http://www.sitefinity.com/documentation/documentationarticles/sitefinity-thunder
The easiest way to achieve your goal is to create a custom control as the following:
public class TextBoxes : WebControl public int Amount get; set; protected override void RenderContents(HtmlTextWriter output) for (int i = 0; i < this.Amount; i++) output.Write("<input type=\"text\"/><br/>"); RenderContents" method if you want to modify the HTML output.Georgi,
Thanks for your prompt reply.
What I really ask is to design a user control whose edit panel, popped up when you click the Edit button at the left upper corner, originally has only one textbox. After you enter some number, say k, in that textbox, k textboxes are appended to the edit panel to ask for more information.
Perhaps, the refreshUI() method of the designer loads the initial number textboxes (based on some property value) and then you add/subtract to that in the click event of a button.
I've done similar things in designers with adding/deleting/editing records in RadListBoxes, and adding/deleting standard input-textboxes is pretty basic javascript stuff.
Your applyChanges() method is where you will need to make sense of it all and save the number of boxes and their content to some appropriate property of your control.
Leverage Kendo MVVM do to the heavy lifting for you, way less code
screencast.com/.../cthG4bDgu2
jsfiddle.net/.../
So what you do is then save the JSON string result to your control...then in the frontend to read the data you just leverage JSON.Net that comes with sitefinity
var data = Newtonsoft.Json.JsonConvert.DeserializeObject<dynamic>(this.InputData)
So to summarize...you're just giving the designer a json string, which kendo converts to a JS object. Then when you click save, you just turn that object back to a string and save it. This way you don't need to persist 2 properties, one for the data and another for the textbox count.
Steve