I've been trying to iterate over a placeholder in sitecore. Essentially, there control that needs to be repeated by the page for a collection of elements (say a tab). I've only gotten the placeholder to render once. The following tabs don't have content inserted into them.
The code for something like what I'm trying to do is:
<asp:Repeater ID="rptTabs" runat="server">
<sc:Placeholder ID="plSocialSharing" runat="server" Key="Social"/>
<sc:Placeholder ID="plTab" runat="server" Key="content"/>
</asp:Repeater>
Should something like what I'm doing work? If it doesn't, do I need to user another sitecore control (something more dynamic?). Should I instead be using user controls I place there, or should I stick with the sitecore framework approach?
Since each of your tabs will contain the same rendering the I would not bother with placeholders. I think you will be adding more complexity than is required.
Assuming you are going to be using the jQuery UI Tab plugin then I would use the same technique you used in the previous question you asked, i.e. render out the content of the div tabs in the repeater, and you will need another repeater to create the ul list of the actual tabs.
Assuming you have a tree structure like:
- Social Sharing
-- Facebook
-- Twitter
-- Email
You could now Social Sharing use as the datasource of your Repeater and still allow the content of the tabs to be editable if you use Sitecore controls.
If you wanted something much more dynamic, like different rendering for each of the tabs, for example one with rich text, one with 2 column, one with table etc, then again there are a couple of ways of achieving this. One way would be to use standard <asp:PlaceHolder> in your repeater and add the rendering in this from your codebehind on ItemDataBound event.
Another option would be to add a bunch of different renderings into the placeholder in the page editor and set the datasource of each to content item. It will be difficult to use jQueryUI Tabs with this though since you would want markup like this in each control to make them self contained:
<div class="tab-title">Tab Title</div>
<div class="tab-content">Put whatever content you want in here</div>
As long as each rendering followed this structure then it would be easy to add several of these to the page and they would still be editable in the Page Editor, albeit listed one after another (not in tab format) in Editing mode. You would need to roll your own tab plugin, but it could be something as simple as:
Only in Preview or Normal mode
Get all .tab-title elements
Create a ul list and prepend to the tab container
Now call jQuery UI Tabs on the element
Hopefully given you some options at least, I can expand on any of these if it something you need but will have to get some code samples together.
Related
I am unsure which asp.net control to use. I've tried / thought about with no avail.
Repeater / ListBox (doesn't allow for multiple lines)
Repeater / Div (No click unless I use JavaScript postback)
I have a list of Messages in codebehind that I would like to attach to some UI control that could display them (spanning multiple lines per item), with good styling.
I need the clickable functionality of a selected item change in a ListBox. But I need the ability to space out each Line item to span multiple lines and possibly contain graphics.
A good visual example would be the inbox view of Microsoft Outlook. Each message consists of the Email-Address, timestamp, etc spaced out and styled nicely. How do I accomplish this with asp.net? :)
You can put a repeater inside another repeater...
That will help you nest multiple elements per row
I typically use KnockoutJS for these types of requirements though since it offers great data bound templates
I have created four ASP.NET Server controls that will inject a lot of JavaScript and HTML.
One control shows a html table.
One control is for showing a data entry form that have juery plugin validation.
One control is for creating a data entry form(described above)
One control is for modifying that data entered (above).
I want to apply a style the end user can define before the server control is loaded.
Like he/she can say that the HTML table, its tr, its td, have this height or width. He can specify colors, borders, font styles etc.
Before the control is populated he can set all the attributes in the design time.
What is the best way to achieve this?
Do I need to override CSS class properties of server control? if
yes, please provide the code.
If you want to do something like that, you would have to write a bunch of code.
However, you can easily create several different themes and let your user choose a theme before you load the controls. This option would be very easy to do using Themes. Check out this link on
Dynamic Themes
I have a section on my website where I plan to add a lot of text-based content, and rather than display this all at once it would be nice if I could add paging on just these pages. If possible, I would like to put all of my content within one content item and have the paging work automatically, building a URL along the lines of http://example.org/articles/title?page=2 or similar.
I've stumbled across an article that mentions paging with Sitecore items and this seems rather close to what I require, although mine requires pagination on a single content item, rather than multiple items. Can someone help me adapt this article towards my needs (if it's on the right track of where I should be looking)?
Is it possible to do this with a Sitecore content item?
http://briancaos.wordpress.com/2010/09/10/create-a-google-style-paging-component-in-c/
I think you'd either want to create your own WebControl and define a custom Render() method that reads the query string to write out the correct information, or you could even do it all in a Sublayout (a user control ASCX file). I've done this before by adding in a custom tag in the Rich text editor via Sitecore (I think I used <hr class="page-break" />) then in my ASCX I'd look for that HTML tag and split the content into chunks from that. I think my solution also used jQuery for some of it but you could probably do it with C# too.
Edit:
You'd want to split the tasks up and have the "paged" content as well as a list of pages (like the article you referenced) so you can easily generate the page buttons. Both of these could be done in two separate repeaters.
You can split the text from a single field into the different pages using approach described here: Split html string to page. All you need to do after that - read the query string and display appropriate block.
If I understand you correctly you have an Item in Sitecore that has x number of text fields and you only want a subset of those displayed depending on input in the querystring ?
In it's simplest form you want a sublayout that handles that.
Basically I'd imagine you having fields called Text1, Text2, text3 etc.
This .ascx could then retrieve the data for fields the fields you'd want using the control and adding them.
Then you could use the code from the article to generate the paging links.
This should be simple enough, but I'd say it would be a better idea to have an item in sitecore and use it's children as the data you want viewed and paged.
It's nicer because if you start out with 5 "page" fields and suddenly want 10, your item will keep on growing, where children can be added without bloating the parent page. Plus the user could then order the children how he sees fit.
I hope this helps a bit.
Basically I want to load a HTML document and using controls such as multiple check boxes which will be programmed to hide, delete or show HTML elements with certain ID's. So I am thinking I would have to set an inline CSS property for visibility to: false on the ones I want to hide or delete them altogether when necessary.
I need this so I don't have to edit my Ebay HTML templates in dreamweaver all the time, where I usually have to scroll around messy code and manually delete or add tags and their respective content. Whereas I just want to create one master template in dreamweaver which has all the variations that my products have, since they are all of the same genre with slight changes here and there and I just need to enable and disable the visibility of these variants as required and copy + paste the final html.
I haven's used Windows Forms before, but tried doing this in WebForms which I do know a bit. I am able to get the result that I want by wrapping any HTML elements in a <asp:PlaceHolder></asp:PlaceHolder> and just setting that place holders visibility to false after the associated checkbox is checked and a postback occurs, finally I add a checkbox/button control that removes all the checkboxes, including itself etc for final html. But this method seems just like too much pain in the ass as I have to add the placeholder tags around everything that I need control over as ordinary html elements do not run at server, also webforms injects a bunch of Javascript and ViewState data so I don't have clean HTML which I can just copy after viewing the page source.
Any tips/code that you can suggest to achieve the desired effect with the least changes required to existing HTML documents? Ideally I would want to load the HTML document in, have a live design preview of it and underneath have a bunch of well labelled checkboxes programmed to hide, delete or show elements with certain ID's.
Thanks...
<table runat="server" id="tblMain">
<tr runat="server" id="tr1">
<td runat="server" id="tdName">
dummy name
</td>
<td runat="server" id="tdSurname">
dummy surname
</td>
...
you can use tdSurname.visible = "false"; or tdSurname.Style["Visibility"] = "Hidden";
Take a look at the library Html Agility pack
i think this will work for you :
HtmlControl ctl = new HtmlGenericControl( "div" );
ctl.visible = false;
Have you considered using JQuery? If the elements you want to show/hide have fixed IDs then this might be a quick and dirty solution.
Similar to the "add more experience" functionality in http://careers.stackoverflow.com/cv/edit, I want to provide a "Add another location" link which should display an additional row of a set of 4 dropdowns (country, state, city, region). I'm actually using the CascadingDropDown jQuery Plugin for ASP.NET MVC (http://weblogs.asp.net/rajbk/archive/2010/05/20/cascadingdropdown-jquery-plugin-for-asp-net-mvc.aspx) for my location dropdown functionality, but I need to give the user the ability to add multiple locations. What would be the easiest way to handle this in ASP.NET MVC and jQuery?
I ended up using this: http://charlie.griefer.com/blog/index.cfm/2009/9/17/jQuery--Dynamically-Adding-Form-Elements
When I do such things I usually render PartialView's (with parameters to distinguish them) in a loop.
I keep a hidden textarea with the HTML of the elements I'm adding in it, something like:
<textarea style="display:none" id="template">
<select id="{0}_state" name="{0}_state"><options....></select>
<select id="{0}_city" name="{0}_city"><options....></select>
</textarea>
Then on the event where you want to add those elements to the form, using jQuery I do something like:
var global_number_added = 0;
var template = jQuery.format($("#template").val());
var add_this = template(global_number_added++); //something unique
add_this.appendTo("selector_to_append_the_elements_to");
Hooking it up with the plugin you are using is something you'll have to look up, but you'll probably need to tie in some events to set up the cascading drop down lists.
Hope that helps.
M
There are a lot of ways you could do this, but a pretty easy way in all asp.net is:
Put the form for each "additional row" in a UserControl
Put that section in an UpdatePanel
"Add another location" would cause an async postback to the UpdatePanel
Dynamically add an instance of the UserControl using Page.LoadControl(..) when they click Add Another.
Track the number of locations in ViewState so you know how many to render on each update.
You could also use jQuery to just copy the input form when they click "Add another," but it would be hard to make that sync up with asp.net for the postback, though not impossible, or you could just look at Request.Form to process it.