I have been tasked to create a layout editor for my companies internal Reporting System. The Specifications they gave me indicate that templates must be able to be defined in .html files in a certain folder. These HTML files can have their own style etc. So it's a full HTML page with the html, head and body tag with content areas that are indicated with special a syntax.
Now what's been bothering me is that I have to load this page with it's styling etc. into a layout div (or IFrame maybe?) where I need to be able to work on it with Javascript (Using JQuery) to insert the controls to manage how the data is displayed.
I can't seem to find a way to do this. Any ideas as to how achieve this according to specifications? Any Help will be appreciated.
The only way to load the page with all referenced stylesheets applied appropriately, and avoiding javascript conflicts is to embed the html in an iframe.
This does however mean that your page will have to be served from the same domain as your application in order for you to be able to interact with the content in an easy way, but as long as this is so (possibly using your app as a proxy for the pages) there is cross browser support out there from jQuery * other javascript frameworks are available I'm sure.
Related
I am working on small project Fast Food Ads in Mvc3 using c# .I want to create page where user can set the layout of page like header , footer and menu bar etc. manually so I think this page its HTML and Css file should be create dynamically. page name and css file will be unique for every user how can i do this?
I don't want to use any CMS...
In principal you can use the Razor engine in MVC3 to process any of your files. You can already do that for your HTML files.
If you want to use Razor to dynamically process (or even create, on the fly) your CSS, have a look at RazorJs. RazorJs allows Razor to pre-process Javascript files before they are included in a view. I have not looked at it's source code, but I imagine it should be straightforward to adapt it to pre-process CSS as well.
I'm going to develop a website which uses ajax to load pages. The cms behind it, is going to be Sitefinity. The problem is I don't know if it's possible to load the pages of sitefinity with jQuery.Load() or any other ajax technique.
Problems with sitefinity:
- I'm able to get the page object of sitefinity, but i need the rendered HTML.
- I'm going to make the pages in the CMS and each page will have a html, header, body tag etc. And I just need the main content of the page, so i'll have to strip the html aswell!
I've been searching alot, but haven't encountered a solution. If someone could give me tips where to search, or how to do it, I'll appreciate it alot!
A more efficient way to pull the pages in would be to connect to the Sitefinity WCF service with jQuery. You will receive JSON page data via AJAX that you can use to compose your page.
Your project's /Sitefinity/services/ folder is filled with .svc service files that you can query to get various items such as pages (/Sitefinity/services/pages/PagesService.svc/), images, blog posts, etc.
The documentation for using those services from jQuery is a little sparse at this point, but they are actively being improved.
See: Sitefinity Documentation Calling Sitefinity RESTful WCF services from Client Side
And this is a good example (non specific to Sitefinity) on how to call WCF services from jQuery.
One note: Sitefinity is very modular and serves pages and content items separately, you may need to query for a page first to find out what content items need to be queried.
Ask on the SiteFinity support forums. The devs are pretty good about answering questions on there.
Yes, it's possible to retrieve content from Sitefinity via .load(). You can use only a portion of the returned document by doing something like the example below.
$('#empty-container').load('sitefinity-page #main-content');
I'm working at a small company within a rather large company, where I don't really have control over our intranet. I have built a little site/page, and I want it to style exactly like the intranet pages.
I know I can download the stylesheets and start hacking away, but I need the links and the menu's to be up to date.
I'm working with asp.net mvc 2 here, but I've no idea how to go further from here. Thoughts?
You will need to copy the CSS etc.
About the menu - you will need to do the fallowing
use WebRequest for getting the new data, Use Html Agility Pack for parsing the page, And use XPath for getting the relevant data - I will recommend using caching for this
Is there a c# command to include another web page - the equivelant of the php require?
I know how to do server side includes but was looking for something code based.
Thanks
Thanks for the answers all. I think I might need to explain further. I have several sub-pages that I will be loading during the use of the site using an xmlhttp request. Initially however, I need to load the starting sub-page before the user has interacted with the site. I could do this with js, but that would require more overhead in server calls from the client for the initial load. I already use master pages, but this is a little different. Since this is done serverside initally but must remain able to be refreshed clientside, I don't think I can make these pages into controls can I? I am pretty new to .Net so I may be making my life harder than I need to.
I think what you may be looking for are MasterPages and UserControls. A MasterPage allows you to define a basic template that is "filled in" by the implementing pages by having the implementing page add it's own content to the ContentPlaceHolders defined on the MasterPage. A UserControl is a re-usable piece of markup and associated code that you can reference from your mark up or add dynamically to the page being rendered in codebehind.
The way ASP.NET is structured, you shouldn't really need to do this. Code is compiled, so all of your classes and functions should be accessible simply by referencing the relevant assembly or namespace, without having to include individual code files.
You might be looking for user controls, which allow you to create fragments of markup with their corresponding code behind, and then reference these in your page.
With ASP.NET MVC it looks like this:
<% Html.RenderPartial("LogOnUserControl"); %>
This way you can put another UserControl on your page.
you can use include in asp.net like php include from below mentioned code
<!--#include file="include/leftmenuscript.inc"-->
You can also use a master page, as someone stated below, which flushes out your basic layout and lets you define content place holders, which other pages can implement and fill in the content. Master pages are a popular approach for defining page elements that are consistent across all pages, like your nav there (also things like headers, footers, common scripts, CSS, etc.).
I have created a webpart in c# for sharepoint.
its basically a form with text boxes, literals, validators and buttons.
im not sure how to render this form to make it look pretty.
The layout etc is being done entirely within this c# class.
At the moment to get started im just overrinding CreateChildControls() method
and adding each form control using something like: this.Controls.Add(submitButton);
any ideas on how best to layout this form?
Thanks.
When creating custom webparts I also prefer to implement them by overriding the CreateChildControls() and Render() methods. In the Render() method I have full control of the html output and I can render my inner controls by calling this.someInnerControl.RenderControl(writer).
Having full control of the html output also makes it easy to style the html using CSS. As other people suggests, use an external CSS file and apply the styes to the class attribute on html elements or CssClass property on ASP.NET web control.
When I implement webparts, that does not require special branding, I prefer to reuse the CSS classes defined by SharePoint. This will ensure that my webpart is visually similar to the webpart provided by SharePoint and that I keep a consistent look and feel.
When using the SharePoint defined CSS styles, you should be aware of your html output. Some of the CSS classes requires a specific html structure to properly render. You can always use the browsers "View Source" to check the html of the SharePoint element you are trying to imitate.
I would recommend grabbing the source from an existing sharepoint page and using the styles defined by sharepoint. This link to the styles in 2003 is old, but still a good guide to get started. Most of the CSS class names haven't changed.
In my web parts I include css files in the solution and inject them in the page using something like:
this.Page.Header.RegisterCss("/_layouts/path/to/css/file.css", false);
You can override the RenderContents(...) method to manually render the HTML in anyway you want to. This includes adding any css includes, scripting includes, etc. that you want/use.
You can render your child controls to strings and then output them as well, but you probably should NOT call the base.RenderContents(...) method.
Just make sure you don't forget to render your child controls.
If it's important for you to see as you design, use the SmartPart which embeds a user control in a web part. (In case you didn't know, user controls can be designed using the tools within Visual Studio.)
If you prefer to hand-code, then you're on the right track. Simply create and set initial properties for your controls within the CreateChildControls() method and use this.Controls.Add() as you have been.
In both cases, where possible use the CssClass property so you can tinker with the look and feel in a CSS file without having to recompile. You could hard-code the CSS class names but it would be better to use the web part properties or an external config source to store these. Have a reference to the CSS file in your master page or inject it into the page using the other techniques mentioned in this answer.
The MSDN articles Web Parts in Windows SharePoint Services or Creating a Basic Web Part might also help.