I want to change background body image for specific pages.
How can I do that..?? Is there any functionality in Orchard CMS, or I have to do it manually... any suggestions..??
Thanks.
#using(Script.Foot()) {
<script type ="text/javascript">
//<![CDATA[
$(document).ready(function () {
var url = window.location.pathname;
var count = url.match(new RegExp("/", 'g'));
var urlsplit = url.split("/");
var page_class = urlsplit[1];
$('body').addClass(page_class);
});
//]]>
</script>
}
Related
In my Net Core 2.1 MVC project I have a viewmodel parameter userID, that I want to assign to a JQuery variable after the page loads. The ID is not displayed anywhere on the page.
So far, this doesn't seem to work:
View:
#{int userID = Model.ID;}
// rest of html page.
#section scripts {
<script src="~/AssigntoVariable.js"></script>
}
AssignToVariable.js
$(document).ready(function () {
$(function () {
var json = userID;
console.log(json);
// removed further code
When I run this, I receive a 'UserID not defined' error, obviously.
How can I put the userID parameter from my viewmodel directly in a JQuery script?
You can access viewmodel parameter ID as userID on client-side like:
#section scripts {
<script type="text/javascript">
var userID = #(Html.Raw(Json.Encode(Model.ID)));
// You can now access userID here
console.log(userID);
</script>
<script src="~/AssigntoVariable.js"></script>
}
and now you can also access userID in AssignToVariable.js like:
$(document).ready(function () {
var json = userID;
console.log(json);
});
Please note that you don't need to use
$(document).ready(function () {
$(function () {
both of them in AssignToVariable.js file, as $(function () { is just a shorthand for $(document).ready(function () {. Please use either one of them.
I am building an Asp.net MVC app and would like to add a datepicker.
I have this code in my form in the view
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
and I would like to add this javascript to it to enable to datapicker:
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
however when the application is run it shows the above code as text on the page.
How do I get it to recognize it as javascript?
Use script tag
#Html.LabelFor(b => b.Date)
#Html.EditorFor(b => b.Date, new {id = "news_date"})
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
wrap your code with script tags
<script type="text/javascript">
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
My attempted methods.
Looking at the JS via browser, the #ViewBag.CC is just blank... (missing)
var c = "#" + "#ViewBag.CC";
var d = $("#" + "#ViewBag.CC").value;
var e = $("#" + "#ViewBag.CC").val();
var c = "#ViewBag.CC";
var d = $("#ViewBag.CC").value;
var e = $("#ViewBag.CC").val();
if you are using razor engine template then do the following
in your view write :
<script> var myJsVariable = '#ViewBag.MyVariable' </script>
UPDATE:
A more appropriate approach is to define a set of configuration on the master layout for example, base url, facebook API Key, Amazon S3 base URL, etc ...```
<head>
<script>
var AppConfig = #Html.Raw(Json.Encode(new {
baseUrl: Url.Content("~"),
fbApi: "get it from db",
awsUrl: "get it from db"
}));
</script>
</head>
And you can use it in your JavaScript code as follow:
<script>
myProduct.fullUrl = AppConfig.awsUrl + myProduct.path;
alert(myProduct.fullUrl);
</script>
try: var cc = #Html.Raw(Json.Encode(ViewBag.CC)
<script type="text/javascript">
$(document).ready(function() {
showWarning('#ViewBag.Message');
});
</script>
You can use ViewBag.PropertyName in javascript like this.
ViewBag is server side code.
Javascript is client side code.
You can't really connect them.
You can do something like this:
var x = $('#' + '#(ViewBag.CC)').val();
But it will get parsed on the server, so you didn't really connect them.
You can achieve the solution, by doing this:
JavaScript:
var myValue = document.getElementById("#(ViewBag.CC)").value;
or if you want to use jQuery, then:
jQuery
var myValue = $('#' + '#(ViewBag.CC)').val();
None of the existing solutions worked for me. Here's another solution I found that did work:
Controller:
TempData["SuccessMessage"] = "your message here";
View:
let msg = '#TempData["SuccessMessage"]';
Try this:
Anywhere in HTML: <input hidden value=#ViewBag.CC id="CC_id" />
In JS: var CC= document.getElementById("CC_id").value.toString();
Can java script add the contents below to a asp table aswell at the same time (with html tags)
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
$('#test1').append('<div id="test">' + x + '</div>');
return false;
});
});
</script>
<textarea style="border: 0" cols="77" rows="2">Write Something....</textarea>
<button>Post Message</button>
<div id="test1"></div>
</asp:Content>
something like:
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
$('#test1').append('<div id="test">' + x + '</div>');
//$save append aswell to Table1
return false;
});
});
</script>
<script type="text/javascript">
$(function () {
$('button').click(function () {
var x = $('textarea').val();
$('textarea').val('');
var newdiv = $("<div></div>").html(x).attr('id','test');
$('#test1').append(newdiv);
$('#Table1').append(newdiv);
//$save append aswell to Table1
return false;
});
});
</script>
It seems like you are using jquery here.
Have you got your jquery framework loaded & tried your code to see if it works??
It is running fine on jsfiddle.net here
Updates
If your Table1 is on the same page.
All you need to do is to get hold of the DOM element.
if you have a table
<table id="Table1">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
</table>
You can add after your code
$('#test1').append('<div id="test">' + x + '</div>');
this code
$('#Table1 tr:last').after('<tr><td>'+ x +'<td></tr>');
Hope you find this helpful
I am developing a mvc application.I wrote a jquery for different operations and saved in to a js file named my.js. And i included that js file into my page.
<script src="../../Scripts/my.js" type="text/javascript"></script>
How can i access ViewData from that js file. I tried many methods.But didnt worked yet.
The code i used to access ViewData from js file is shown below.
var CalanderPreference = "<%= ViewData["CalanderPreference"] %>";
But it returning an error like 'Expected ; '
Any ideas?
ViewData is not accessible on client, because it exists only on view rendering.
You could serialize your view data to json on server side, write it to hidden field, and them parse it to javascript object on client side.
You can create your javascript object on the view like in this example.
Put this into your view and not in a seperate file:
<script type="text/javascript">
$(function() {
var saleYear = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Year %>");
var saleMonth = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Month %>") - 1;
var saleDay = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Day %>");
var saleHour = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Hour %>");
var saleMinute = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Minute %>");
var saleSecond = parseInt("<%=ViewData.Model.Sale24Hours.EndDate.Second %>");
var endSaleDate = new Date(saleYear, saleMonth, saleDay, saleHour, saleMinute, saleSecond);
$("#countDownSale24").countdown({ until: endSaleDate, compact: true, format: "HMS" });
});
</script>