I have layout page and the page that uses layout.
How can I add some new elements to the head not changing layout.(layout already contains head)?
Layout:
<head>...</head>
I want my page be like:
<head>all layout head logic... plus
my page new elements...
</head>
You could use sections in the layout. For example:
<html>
<head>
#RenderSection("scripts", false)
</head>
<body>
#RenderBody()
</body>
</html>
and then in the view override this section and provide contents for it:
#section scripts {
<script type="text/javascript">
alert('hello');
</script>
}
<div>Hello from the index view</div>
And since the section is optional (second argument = false) if a view doesn't provide any contents for it, it will stay empty.
Related
I'm wondering if it's possible to get "typescript intellisense" in my razor views, as I have in my ts-files?
This is my app.ts file (when I type 'this.' the 'myExampleMessage' property shows up):
/// <reference path="Scripts/typings/angularjs/angular.d.ts"/>
'use strict';
var app = angular.module('app', []);
class TestController {
constructor($scope: ng.IScope) {
this.myExampleMessage = "Hello";
}
myExampleMessage: string;
}
This is my default.cshtml file (when I type 'tController.', no intellisense show up):
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<title>TypeScript HTML App</title>
<script src="Scripts/angular.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="TestController as tController">
<h1>TypeScript HTML App</h1>
<div id="content">{{tController.myExampleMessage}}</div>
</body>
</html>
What I would like, is for Visual Studio (2013) to understand what tController is, and give me the properties defined on this class. In this case it would be the 'myExampleMessage' property.
I'm I doing something wrong, or isn't this possible?
I'm I doing something wrong, or isn't this possible?
It isn't supported at the moment.
for quick reference I have attached the image of what I want.
I would like to update (change the content) without updating the whole page (without refreshing the page). Clicking on the links or buttons on the whitebox should fetch the data from the database and that is to be displayed in the redbox. Of course first thing you would write as an answer will be "Ajax!!!", but as I'm new to laravel framework, I want to know what is the best way to achieve this, should I write the javascript directly in the view or in the controller, and how to do it through controller? If you need any more info please let me know.
Revised question, is there any other better way other then the ones answered
First we need to set up some routes. You can also do this with controllers.
Route::get('home', function()
{
return View::make('home');
});
Route::get('someRoute', function()
{
return View::make('someView');
});
For the home view, I'd add a scripts section:
//home.php
<html>
<head>
<script>
$('a.ajax').click(function(e){
e.preventDefault();
var pageURL = $(this).attr('href');
$('#ajaxContent').load(pageURL);
});
</script>
</head>
<body>
<div class="wrapper">
Click Here
<div id="ajaxContent"></div>
</div>
</body>
</html>
In case you're using blade templating, here's an implementation
//main.blade.php
<html>
<head>
#yield('styles')
</head>
<body>
<div class="wrapper">
#yield('content')
</div>
#section('scripts')
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
#show
</body>
</html>
//home.blade.php
#extends('main')
#section('content')
Click Here
<div id="ajaxContent"></div>
#stop
#section('scripts')
#parent
$('a.ajax').click(function(e){
e.preventDefault();
var pageURL = $(this).attr('href');
$('#ajaxContent').load(pageURL);
});
#stop
it would be better for you if you use jQuery to do this update using ajax functionality.
and a simple code can be like this
$('a.ajax').click(function(e){
e.preventDefault();
var pageURL = $(this).attr('href');
$('#divID-to-be-updated').load(pageURL);
});
more about ajax functionality inside jQuery can be read from http://jqapi.com/#p=load
Creating an MVC 3 Razor project. have a very involved UI design. I wanted to put #renderbody() into a partial view source by _layout. The compiler won't let me. Is there a way to do this?
Instead of partial view you can go for master/sub layouts.
MasterLayout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title</title>
</head>
<body>
#RenderBody()
</body>
</html>
Layout.cshtml
#{
Layout = "~/Views/Shared/_MasterLayout.cshtml";
}
// html code above render body
#RenderBody()
// html code below render body
Your sublayout(Layout.cshtml) contains the code that should be in the partial view.
I'm trying to make my own tumblr search (tags only) since their own search function doesn't actually work.
So I'm nearly there. It works, but I need the search field to keep the value of what the user searched for.
So if I search for "foobar", it loads the tumblr.com/tagged/foobar directly into my tumblr.com, but the search field still contains the term "foobar"
Here is my working code except for the code where I'm trying to insert the previous search term into the newly loaded
Thanks in advance.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
jQuery(function($) {
$('#syndex').keydown(function(event) {
if (event.keyCode == '13') {
var syndex = $('input:text').val();
$('body').load("http://syndex.me/tagged/"+ syndex);
$(this).val(syndex); //this is what's not working
}
});
});
</script>
</head>
<body>
<div id="logo">
<input id="syndex" type="text"/>
</div>
</body>
</html>
You need to put this into the complete function which can be passed as a parameter to load.
http://api.jquery.com/load/
Load makes an AJAX call which is asynchronous. You are trying to set the value prior to the content being loaded.
$('body').load("http://syndex.me/tagged/"+ syndex,function(){
$('input:text').val(syndex);
});
Is there a way for me to use a functionality similar to what are called Global Variables in the Spark View Engine, but for Razor.
The point of it all lis to be able to define a variable in one section for the title and then being able to set or change the value of that variable later on in another section.
In Spark you would create the variable in a section kind of like this (incomplete code for example purposes):
<html>
<head>
<global type='string' Title='"Site Name"'/>
<title>${Title}</title>
</head>
<body>
<div><use content="view"/></div>
</body>
</html>
And then you could set it in a different view or section or whatever:
<set Title='product.Name + " - " + Title'/>
How would I go about doing something like this in Razor or just solving a similar problem if I have the wrong approach ?
You could use ViewBag.Title inside the layout:
<html>
<head>
<title>#ViewBag.Title - Site Name</title>
</head>
<body>
<div>
#RenderBody()
</div>
</body>
</html>
and then define this variable inside the view:
#model AppName.Models.Product
#{
ViewBag.Title = Model.Name;
}
UPDATE:
Following on the comments question about default values you could use sections.
<html>
<head>
<title>
#if (IsSectionDefined("Title"))
{
RenderSection("Title")
}
else
{
<text>Some default title</text>
}
</title>
</head>
<body>
<div>
#RenderBody()
</div>
</body>
</html>
and then inside your view you could redefine the section if you will:
#section Title {
<text>some redefined title here</text>
}
You can set and then overwrite this value in view as well using this approach:
#PageData["myTitle"] = "Title 1";